2016-09-23 1 views
2

私は最近、このコードを見てきました:クラスのコンストラクタ/関数の構文は

class Foo { 
 
    constructor({ 
 
    a, 
 
    b, 
 
    c = [] 
 
    }) { 
 
    this.a = a; 
 
    this.b = b; 
 
    this.c = c; 
 
    console.log(this); 
 
    } 
 
} 
 
const foo = new Foo({ 
 
    a: 1, 
 
    b: 2 
 
});

をしかし、私はパラメータ名を包む中括弧で定義されたパラメータを見たことがありません。私のリンターはそれについて不平を言うが、コードは正常に動作するので、エラーなしで実行されるので有効であると仮定する。

私はMDNドキュメントについて、classconstructorおよびdefault argumentsを読んでいます。しかし、どこに記載されているこのパターンは表示されません(多分私はそれを逃したのでしょうか?)。

これは私が探しているものです、このパターンには名前がありますか、それともどこかに記載されていますか?

+1

@Downvoter、どのようにしてこの質問を改善できますか? – Bathsheba

+0

はい、改善が必要なことが分かっていれば改善します。 – Xotic750

+1

これは「パラメータ破壊」です。 –

答えて

3

それは、parameter destructuringです。

ただし、この場合には、あなたは単にあなたがそれを幸せにするためにあなたのリンターのための「ES6」フラグのいくつかの種類を見つける必要があり

class Foo { 
    constructor(opts) { 
    Object.assign(this, {c: []}, opts); 
    console.log(this); 
    } 
} 

const foo = new Foo({ 
    a: 1, 
    b: 2 
}); 

を行うことができます。

+0

ありがとうございます。私はそれが似ていると推測していたが、それが何と呼ばれていたのか分からなかった。私は既にフラグが設定されているので、私はリンターを更新する必要があると思う。 – Xotic750

+1

'Object.assign'はここに行く方法です。 'c'を同じオブジェクト' Object'に入れた場合、少し短くなります。代入(これは、{c:[]}、opts); 'のようになりますが、おそらく余分な割り当てを犠牲にしています。 –

+0

これが最適化に影響を与えるかどうかは疑問です。一部のエンジンは、オブジェクトが持つすべてのプロパティを静的に決定できるときに、最適化を利用できます。彼らはコールサイトからそれを理解しようとする可能性があります。 –

1

しかし、これまでにこのように定義された議論は見たことがありません。

これは、議論に使用された破壊です。

私は良いリファレンスを見つけることができませんでしたが、私はそれがES6の機能だと信じています。それは、オブジェクトの引数を個々の変数に分解し、変数に同じ名前のプロパティの値を割り当てることです。

それはやってに似て:

class Foo { 
    constructor(obj) { 
    this.a = obj.a; 
    this.b = obj.b; 
    this.c = obj.c || []; 
    console.log(this); 
    } 
} 
+2

実際、それはES6の機能です。 –

+2

ここに記載されていると思う:https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#Pulling_fields_from_objects_passed_as_function_parameter –

+0

ありがとう。私は何を見ていたのか探していた。 – Xotic750