【问题标题】:Typescript destructuring with required parameter带有必需参数的打字稿解构
【发布时间】:2019-08-23 23:34:21
【问题描述】:

编辑对不起,我的问题有点不清楚。我想强制始终需要 getList 参数。所以我没有它的默认值。例如,我希望用户始终提供一个 getlist

我正在尝试创建一个带有一些可选参数和一些必需参数的构造函数

export class PageConfig {
    constructor({
        isSliding = false,
    }: {
        isSliding?: boolean
        getList: (pagingInfo: PagingInfo) => Observable<any>
    } = {  }) { }
}

执行此操作时出现错误

类型“{}”中缺少getList,但类型中需要...

我希望能够在这样的课程中使用它:

class UsersPage {

    config = new pageConfig({ this.getList })    

    getList(pagingInfo: PagingInfo) {
      // do work...
    }
}

注意:我已经简化了这个例子的类,但是我有更多的属性,我想利用解构,所以我不必配置我的类的实例化其他比声明中的

如何强制在解构期间必须传递 getList?

【问题讨论】:

  • 我想你会想为你的构造函数定义一个参数接口。
  • config = new pageConfig({ ...this.getList })
  • ????我很困惑。你想在哪里使用解构?在PageConfig 构造函数实现签名?或者在PageConfig 构造函数的调用 中?如果是前者,它将像constructor({ isSliding = false, getList }: { isSliding?: boolean; getList: GetListFunc;}) 一样是多余的。如果是后者,new PageConfig({this.getList}) 不是有效的语法;你可能需要做new PageConfig(this)new PageConfig({getList: this.getList})。但我真的不太了解预期的用例,无法将这些变成答案。
  • @jcalz 你不能在调用中进行解构。
  • 为什么你将getList声明为你的参数的一个属性,然后在解构中没有使用它?

标签: javascript typescript object ecmascript-6 destructuring


【解决方案1】:

您为 PageConfig 构造函数参数使用默认值 {},但您在类型中将 getList 标记为必需。如果我理解正确,您希望始终设置构造函数参数和getList,因此将代码更改为:

export class PageConfig {
  constructor({
    getList,
    isSliding = false
  }: {
    getList: (pagingInfo: PagingInfo) => Observable<any>;
    isSliding?: boolean;
  }) {
    … // use getList and isSliding
  }
}

这种语法(使用默认值解构)有时会有点麻烦。当你extract the constructor argument type时,它会变得更清晰。

TypeScript docs example

【讨论】:

  • 感谢您回答我的问题,我创建了另一个有关如何将构造函数参数公开为类的公共属性的相关问题,如果您有时间,这可能是一个获得一些简单点的机会,因为你似乎对这个领域很熟悉。 The question is here
【解决方案2】:

您想删除默认值,并更改参数顺序 - 必需参数始终位于可选参数之前:

constructor(getList: (pagingInfo: PagingInfo) => Observable<any>, isSliding?: boolean = false) {...}

【讨论】:

  • 我觉得他确实想要默认值
  • required parameters always come before optional parameters 你确定吗?问题(以及您的答案)在构造函数的第一个参数上使用对象解构。对象键是无序的。在这种情况下,必需与可选无关。
  • 修复了@JakeHolzinger 和 MinusFour。
  • 这会起作用,但它会改变问题中提出的合同。但是,它可能是一个可以接受的替代方案。
  • @JackBashford,我首先尝试这样做,但是,想象一下您在 isSliding 之后还有另一个可选参数,如果不提供 isSliding,您如何提供该参数?例如,我有 10 个可选参数,有没有办法调用构造函数,同时只利用一些默认值?
【解决方案3】:

如果所有构造函数参数都是可选的/具有默认值,则一个选项是简单地在构造函数中使用 Partial 配置并与默认值合并,例如

interface IPageConfigConstructor {
  isSliding: boolean;
  getList: (pagingInfo) => Observable<any>;
}
const DEFAULT_CONFIG:IPageConfigConstructor = {
  isSliding: true,
  getList: (pagingInfo) => null
}

class PageConfig {
  constructor(config: Partial<IPageConfigConstructor>) {
    const mergedConfig:IPageConfigConstructor = {...DEFAULT_CONFIG,...config}
  }
}

class UsersPage {
  config = new PageConfig({getList:(pagingInfo)=>this.getList(pagingInfo)});

  getList(pagingInfo) {
    // do work...
    return new Observable
  }
}

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2019-10-12
    • 2016-04-14
    • 2019-12-12
    • 2022-01-03
    • 2023-03-07
    • 1970-01-01
    • 2019-11-18
    • 2021-06-09
    相关资源
    最近更新 更多