【问题标题】:Named default ES6 parameter without destructuration命名为默认的 ES6 参数,没有解构
【发布时间】:2017-06-14 17:39:37
【问题描述】:

我正在尝试使用 babel 在 ES7 中设置默认选项。这是我能做的:

class Foo {
  constructor({key='value', foo='bar', answer=42}) {
    this.key = key; 
    this.foo = foo;
    this.number = number;
  }
}

这可能适用于本示例,但我想知道如何为非常大的配置对象分配; 这是我想做的一个例子:

class Foo {
  constructor(opts = {key='value', foo='bar', answer=42}) {
    this.opts = opts;
  }
}

但是这不会编译。我试着这样做:

class Foo {
  constructor(opts = {key:'value', foo:'bar', answer:42}) {
    this.opts = opts;
  }
}

但随后它会替换整个对象,如下所示:

let foo = new Foo({key: 'foobar'});

console.log(foo.opts);
// {key: 'foobar'} is what is displayed
// When I want {key: 'foobar', foo:'bar', answer:42}

【问题讨论】:

    标签: javascript ecmascript-6 babeljs ecmascript-2016


    【解决方案1】:

    我不认为你可以用 ES6 可选参数(对象作为带有可选键的参数)来做到这一点,因为当你调用构造函数时,它是一个带有新引用的新对象。那是因为它正在被替换。

    但是,作为一个建议,如果您想处理大型选项对象,一种常见的方法是在某处存储一个 默认选项 对象,并将该对象与实例化时传递的对象合并。

    类似的东西:

    class Foo {
    
      constructor(opts) {
        this.opts = Object.assign({}, Foo.defaultOptions, opts)
        console.log(this.opts)
      }
    }
    
    Foo.defaultOptions = {
        key: 'value', 
        foo: 'bar',
        answer: 42
    }
    
    let foo = new Foo({key: 'another value'})
    //{ key: 'another value', foo: 'bar', answer: 42 }
    

    您可以与Object.assign 合并(请注意,它不会执行深度合并 - 嵌套对象会被替换)。

    或者,如果您想将默认选项 Object 声明为类变量(不是在最后、在类声明之后或在构造函数内部),因为您正在使用 babel,您可以使用 this 插件并执行此操作:

    class Foo {
    
        defaultOptions = {
            key: 'value', 
            foo: 'bar',
            answer: 42
        }
    
        constructor(opts) {
            this.opts = Object.assign({}, this.defaultOptions, opts)
            console.log(this.opts)
        }
    }
    

    它更具可读性。

    【讨论】:

      【解决方案2】:

      是的

      class Foo {
        constructor({key='value', foo='bar', answer=42} = {}) {
          ...
        }
      }
      

      它是 ES6 解构特性,并非特定于 ECMAScript 7 (ECMAScript Next) 提案。

      如果不进行解构,通常通过对象克隆/合并来完成,Object.assign 会提供帮助:

      class Foo {
        constructor(opts = {}) {
          this.opts = Object.assign({
            key: 'value',
            foo: 'bar',
            answer: 42
          }, opts);
        }
      }
      

      【讨论】:

      • 对不起,我意识到我的帖子不是很清楚。所以我编辑了标题。我不想破坏我的参数
      • 如果不进行解构,您必须手动复制对象。我已经用我通常使用的食谱更新了答案。
      • 这就是我最终要做的事情,我只是想知道我是否可以用 ES6/7 做到这一点。谢谢!
      • 不客气。不,这是它的完成方式。如果opts 不用于其他任何用途,则opts = {} 可以只是opts,因为Object.assign 允许undefined。 Object.assign 已经是 quite ES6-ish。
      猜你喜欢
      • 1970-01-01
      • 2017-08-23
      • 2016-10-30
      • 2019-04-18
      • 2018-08-14
      • 1970-01-01
      相关资源
      最近更新 更多