字符串属性上的 TypeScript 接口默认值

Question

I have an interface that looks like this

export interface IAppSection {
  key: string;
  order: number;
  header: string;
  content: string;
  modifiedAt: string;
  modifiedByEmployeeId: number;
  change: 'added' | 'removed' | 'updated' | 'none';
}

What I'd like to do is have change default as none when the object this interface relates to is stored.

I have tried change: 'added' | 'removed' | 'updated' | 'none' = 'none' change: 'added' | 'removed' | 'updated' | 'none' = 'none' change: 'added' | 'removed' | 'updated' | 'none' = 'none' but this does not work.

I am sure I am doing something wrong here and would really appreciate some feedback on how I can achieve this.

Answer 1

You can't do this with interfaces. Interfaces are completely erased at runtime and can't impact runtime behaviour; this is by design. You can create a class instead and assign a default value to the field, or you can create a function that will assign the defaults.

We could even construct a function that helps us create such functions with defaults:

interface IAppSection {
  key: string;
  order: number;
  header: string;
  content: string;
  modifiedAt: string;
  modifiedByEmployeeId: number;
  change: 'added' | 'removed' | 'updated' | 'none';
}

function withDefaults<T>() {
  return function <TDefaults extends Partial<T>>(defs: TDefaults) {
    return function (p: Pick<T, Exclude<keyof T, keyof TDefaults>> & Partial<TDefaults>) :T {
      let result: any = p;
      for (let k of Object.keys(defs)) {
        result[k] = result[k] || defs[k];
      }
      return result;
    }
  }
}

const appSection = withDefaults<IAppSection>()({
  change: 'none'
})

Answer 2

You can't set the default value in the interface, only in the implementation.

But by default they are undefined which is mostly just fine.

For the 'real' implementation your string union looks good.

See also: Typescript interface default values

Answer 3

Another way to deal with is marking all IAppSection values as required, and then use factory methods to create the IAppSection objects, inside the factory method you can ensure that all invariants are meet and assign default values for the optional arguments, per instance

    const createAppSection = (
      key: string,
      order: number,
      header: string,
      content: string,
      modifiedAt: string,
      modifiedByEmployeeId: number,
      change?: 'added' | 'removed' | 'updated' | 'none';
    ) : IAppSection => {
       // perform invariants validations 
       if(!key){
         throw Error('key required');
       }
       return {
         key, order, content, modifiedAt, modifiedByEmployeeId,
         change: change || 'none'
       }
    }