TypeScript Interface 疑惑？

Question

TypeScript中函数通过Interface来描述参数时，如何设置参数的默认值？

interface Opts {
  method: string;
  header: object;
  body: object;
}

function request(url: string, opts: Opts) {
  // opts.method，opts.header等参数如何设置默认值？
  // 省略代码...
}

Answer 1

interface Opts {
  method: string;
  header: object;
  body: object;
}

function request(url: string, { method = 'get', header, body }: Partial<Opts> = {}) {
  // opts.method，opts.header等参数如何设置默认值？
  // 省略代码...
}

Answer 2

interface Opts {
  method: string;
  header: object;
  body: object;
}
const defaultOpts:Opts = {
  method='get',
  header= {},
  body={}
}
function request(url: string, opts: Opts) {
  opts = Object.assign(defaultOpts,opts)
  //或者
  opts = {...defaultOpts,...opts}
  
}

请注意

上面答案存在一个潜在隐患：无论 assign还是结构赋值，都只能进行第1层的替换，无法对比第2层属性值。
像上面代码中，假设默认 defaultOpts.body = {a:1,b:2}，但是传递过来的参数中，props.body = {a:3}，那么2者合并之后的值是不存在 xxx.body.b 这个属性的。

Answer 3

interface只是ts的东西，负责编译前的类型检查，不会影响js代码
你这个需求需要用解构赋值来实现

Answer 4

上面的其实都对，interface 里面确实没有所谓的默认值，这个和 react 的 PropType 或者 vue 里面的属性都不太一样