Object.assign ES6組み合わされ()オブジェクト

参照リンク(参考ルアンYifeng):https://github.com/ruanyf/es6tutorial/search?utf8=%E2%9C%93&q=assign

転載リンク:https://www.jianshu.com/p/d5f572dd3776

 

基本的な使い方

Object.assignオブジェクトをマージするための方法は、全ての列挙属性のソースオブジェクト(ソース)は、対象物(ターゲット)にコピーします。

1つの CONSTターゲット= {1 }。
2  
3 CONSTソース1 = {B:2 }。
4 CONSTソース2 = {C:3 }。
5  
6  Object.assign(ターゲット、ソース1、ソース2)。
7ターゲット// {:1、B:2、C 3}

Object.assign最初のパラメータは、ソース・オブジェクトのパラメータが後ろにあり、ターゲット・オブジェクトのメソッドです。

ソースオブジェクトとターゲットオブジェクトは、以前の属性上書き属性後、同じ名前の属性、または同じname属性のソースオブジェクトを複数有している場合ことに留意されたいです。

1つの CONSTターゲット= {1、B:1 }。
2  
3 CONSTソース1 = {B:2、C:2 }。
4 CONSTソース2 = {C:3 }。
5  
6  Object.assign(ターゲット、ソース1、ソース2)。
7ターゲット// {:1、B:2、C 3}

唯一つのパラメータ場合は、Object.assignパラメータに直接戻ります。

1 CONST OBJ = {1 }。
2 Object.assign(OBJ)=== OBJ // 

このパラメータがオブジェクトでない場合は、それが第一の目的に変身してから返します。

1  typeof演算 Object.assign(2)// "オブジェクト"

そのためundefined、およびnullそれらをパラメータとして使用されているそうだとすれば、対象物に変わりはない、エラーが報告されています。

1 Object.assign(不定)は// 与えられる
2 Object.assign(NULL// 与えられました

非オブジェクトは、ソースオブジェクト(すなわち、非最初のパラメータ)の位置に表示された場合、処理ルールが異なっています。まず、これらのパラメータは、あなたがオブジェクトに回すことができない場合は、スキップされ、オブジェクトに変わります。この手段であればそれundefinednullではない最初のパラメータでは、エラーがないでしょう。

1 LET OBJ = {1 }。
2 Object.assign(OBJ、未定義)=== OBJ // 
3 Object.assign(OBJ、NULL)=== OBJ // 

他のタイプの値(即ち、値、およびブール列)最初のパラメータではないが与えられていません。しかし、ターゲットオブジェクトにコピーされた文字列の配列に加えて、他の値が有効でないであろう。

1 CONST V1 = 'ABC' 2 CONST V2 = 3 CONST V3 = 10 4  
5 CONST OBJ = Object.assign({}、V1、V2、V3)。
6にconsole.log(OBJ)。// { "0": ""、 "1": "B"、 "2": "C"}

上記のコードでは、v1v2v3それぞれ、のみ(文字の配列の形で)ターゲット・オブジェクトに文字列の文字列、ブール値、および結果は、数値およびブール値は無視されます。文字列だけラップされたオブジェクトは、列挙プロパティを生成するためです。

1つのオブジェクト(// {[PrimitiveValue]:真} 
2オブジェクト(10)   //   {[PrimitiveValue]:10} 
3オブジェクト( 'ABC')// {0: ""、1: "B"、2: "C"、長さ:3、[PrimitiveValue]: "ABC"}
上記のコードでは、元の値にブール値、数値、文字列、及びラップさに対応するオブジェクトにトランスフェクションは、パッケージオブジェクト内のプロパティで見ることができる [[PrimitiveValue]] 上、このプロパティはされない Object.assign コピー。ラッパーのみオブジェクトの文字列は、本当の意味列挙可能な特性を持つことになり、これらのプロパティがコピーされます。

Object.assign プロパティのコピーは、ソースオブジェクト(継承された属性をコピーしない)の自分の財産のコピーだけを制限され、またコピーが属性を(列挙することはできません enumerable: false )。
1 Object.assign({B 'C' }、
 2    Object.defineProperty({}、 '不可視' 、{
 3      列挙:4      値: 'こんにちは'
 5    })
 6  7  // {B「C '}

上記のコードでは、Object.assign唯一の非列挙型属性をコピーするオブジェクトはinvisible、このプロパティはにコピーされていません。

プロパティという名前のシンボルのプロパティ値は、となりますObject.assignコピー。

1 Object.assign({ 'B'}、{[記号( 'C')]: 'D' })
 2  // {: 'B'、記号(C): 'D'}

 

注意点

(1)浅いコピー

Object.assignこの方法ではなく、深いコピーよりも、簡易コピーを実践されています。つまり、ソースオブジェクトがオブジェクトである場合、プロパティの値は、ターゲットオブジェクトのコピーが、オブジェクトへの参照になってしまいます。

1 CONST OBJ1 = {{B:1 ;}}
2 CONST OBJ2 = Object.assign({}、OBJ1)。
3  
4 obj1.ab = 2 5 obj2.ab // 2

上記のコードでは、ソース・オブジェクトobj1a属性の値は、オブジェクトであるObject.assign得られたコピーはオブジェクトへの参照です。このオブジェクトの変更は、宛先オブジェクトに反映されます。

同じname属性の(2)の交換

このネストされたオブジェクトの場合、同じ名前のイベント属性は、Object.assign処理方法ではなく追加するよりも、交換することです。

1 CONSTターゲット= {{B 'C'、D 'E' }}
 2 CONSTソース= {{B 'ハロー' }}
 3  Object.assign(ターゲット、ソース)
 4  // {A :{B 'ハロー'}}

上記のコードは、targetオブジェクトのa属性はsource、オブジェクトaを取得しないが、置換全体の特性{ a: { b: 'hello', d: 'e' } }結果を。これにより、開発者は、欲しい特別なケアを必要としない通常です。

いくつかのライブラリが提供するObject.assign(例えば、カスタマイズされたバージョンLodash_.defaultsDeep法)ディープコピーを得ることができます。

(3)処理アレイ

Object.assignアレイを処理するために使用することができるが、アレイは、オブジェクトとして扱われます。

1 Object.assign([1、2、3]、[4、5 ])
 2  // [4,5、3]

上記のコードでは、Object.assign指定された属性として配列0,1,2オブジェクト、光源アレイ0 Number属性4標的配列覆う0番号属性1

工程(4)関数の値

Object.assignその後、評価され、その後、コピー、値のみをコピーし、あなたが値をコピーしたい場合は、値の関数です。

1つの CONSTソース= {
 2    GETのfoo(){ リターン 1 }
 3  }。
4 CONST目標= {};
5  
6  Object.assign(ターゲット、ソース)
 7  // {FOO:1}

上記のコードは、sourceオブジェクトのfoo属性値は、関数でObject.assign、過去にこの値をコピーして、値を取得するだけで、後に、関数の値をコピーしません。

一般的な用途

Object.assign便利な多くの方法があります。

(1)目的のために添加しました

1  クラスポイント{
 2    コンストラクタ(X、Y){
 3      Object.assign(この、{X、Y})。
4    }
 5 }

上記プロセスによってObject.assign方法、x特性及びyに属性を追加するPointオブジェクト・クラスのインスタンス。


(2)オブジェクトを追加する方法

1  Object.assign(SomeClass.prototype、{
 2    のsomeMethod(ARG1、ARG2){
 3      ···
 4    }、
 5。   anotherMethod(){
 6      ···
 7    }
 8。 });
 9  
10  // 次の文言と等価で
11 = SomeClass.prototype.someMethodの機能(ARG1、ARG2){
 12は   ?????
 13である };
 14 SomeClass.prototype.anotherMethod = 関数(){
 15    ?????
 16 }。

上記のコードは、括弧内に直接、二つの機能をオブジェクトのプロパティの簡単な表現を使用し、その後、使用assignする方法をSomeClass.prototypeされています。

オブジェクトの(3)のクローニング

1つの 関数クローン(原点){
 2    リターンObject.assign({}、原点)。
3 }

上記目的は、元のコードにコピーされている空のオブジェクトであり、元のオブジェクトのクローンを得ます。

しかし、この方法でクローンを、元のオブジェクト値自体の唯一のクローンは、それが継承された値をクローン化することができません。あなたが継承チェーンを維持したい場合は、次のコードを使用することができます。

1つの 関数クローン(原点){
 2    LET originProto = Object.getPrototypeOf(原点)。
3    リターンObject.assign(Object.create(originProto)、原点)。
4 }

(4)複数のオブジェクトを組み合わせます

オブジェクトに複数のオブジェクトを結合します。

1つの CONSTマージ=(目標、...ソース)=> Object.assign(ターゲット、...源)

あなたは新しいオブジェクトを返すように統合したい場合は、上記の関数、合併への空のオブジェクトを書き換えることができます。

1つの CONSTマージ=(...ソース)=> Object.assign({}、...源)

5)属性のデフォルト値の指定

1 CONST DEFAULTS = {
 2    ログレベル:0 3    OUTPUTFORMAT: 'HTML'
 4  }。
5  
6  関数processContent(オプション){
 7つの    オプション= Object.assign({}、デフォルト、オプション)。
8    にconsole.log(オプション)。
9    // ... 
10 }

上記のコードは、DEFAULTSオブジェクトはデフォルトでoptionsオブジェクトがユーザ指定のパラメータです。Object.assign方法DEFAULTSoptionsの両方、同じ名前の属性を持っている場合は、新しいオブジェクトに結合option属性値が上書きされますDEFAULTS属性値を。

浅いコピー問題の存在に、という注意DEFAULTSオブジェクトとoptionsオブジェクトのすべての属性、好ましくは、シンプルなタイプが別のオブジェクトを指していません。それ以外の場合は、DEFAULTSオブジェクトのプロパティは無効である可能性が高いです。

1 CONST DEFAULTS = {
 2    URL:{
 3      ホスト: 'example.com' 4      ポート:7070
 5    }、
 6  }。
7  
8 processContent({URL:{ポート:8000 }})
 9  // { 
10  //    URL:{ポート:8000} 
11  // }

上記のコードの本来の意図をされて  url.port8000に変更し、url.host変更されません。実際の結果がoptions.url上書きされDEFAULTS.url、それはurl.host存在しません。

おすすめ

転載: www.cnblogs.com/PasserByOne/p/12167456.html