How to structure utility class

2020-02-07 16:59发布

问题:

I have several utility functions. What is the best way to package these up, and then import them?

This is what I am trying to do:

import * as util from './util'

export class myClass{
     constructor()
     {
           util.doSomething("test");
     }
}

Then in the class:

export class Util{
    doSomething(val: string){ return val;}

    doSomethingElse(val: string{ return val;}
}

The error message I get from VS is "Property doSomething does not exist on type util."

回答1:

If you create a file utils.ts which contains

export default class Utils {
    static doSomething(val: string) { return val; }
    static doSomethingElse(val: string) { return val; }
}

then you can simplify your client code like this:

import Utils from './utils'

export class MyClass {
     constructor()
     {
         Utils.doSomething("test");
     }
}


回答2:

There's a couple problems here:

  1. You're not instantiating anything, and doSomething is an instance method
  2. When you do import * as util, util represents the module, not an object in it.

If you want Util, you should just import that:

import { Util } from './util'

Next, you should instantiate Util, before finally calling the method on it:

var u = new Util();
u.doSomething("test");

Here's your code patched up:

import { Util } from './util'

export class MyClass{
     constructor()
     {
         var u = new Util();
         u.doSomething("test");
     }
}

All that said, there seems to be something odd about the way you're using your utils. This is totally personal opinion, but I wouldn't invoke methods that "do something", i.e. cause side effects, in a constructor.

Also, the methods in Util don't really look like they need to be in that class, since the class holds no state that they depend on. You can always export regular functions from a module. If you wrote your utils module like this:

export function doSomething(val: string) { return val; }

export function doSomethingElse(val: string) { return val; }

you'd be exporting your functions directly and would sidestep the instantiation hassle, and in fact your original code would work correctly as is.



回答3:

Alternative way:
1) Export constants in your utils.ts file:

export const doSomething = (val: string): any => {
  return val;
};

export const doSomethingElse = (val: string): any => {
  return val;
};

2) Import and use this methods in main *.ts file:

import { doSomething, doSomethingElse } from './util';
...
let value1 = doSomething('abc');
let value2 = doSomethingElse ('efg');


回答4:

Or you could export is as an object literal:

export const Util = {
    doSomething(val: string){ return val;},
    doSomethingElse(val: string{ return val;}
}


回答5:

you can also create a util.ts class which has a function to export

export const formatDateOfBirth = 
(dob: string) : string => `${dob.substring(0, 4)}-${dob.substring(4, 6)}-${dob.substring(6, 8)}`;

now you can import the method as below, shared folder structure is src > app > shared, i am calling this import inside src > app > shelf > shelf.component.ts file

import { formatDateOfBirth } from '../shared/utils/util';
public getFormattedDate(dob: string):string{
  return formatDateOfBirth(dob);
}