どうも。櫻庭です。
今回はObject.assign()メソッドについて書き留めていきたいと思います。
なぜ、Object.assign()について書くのか
弊社、TGGLOBALにてコードを書く際、SS等から取得した2次元配列をそのまま処理するのではなく、一旦ObjectArrayに変換してから処理をします。
そしてこのObjetArrayの処理にこのObject.assign()メソッドは非常に役立ちます。
なぜObjectにしてから処理をするのかと言うと、もしSSから習得したデータを二次元配列のまま処理をしてしまうと、仮に列を追加した際にコード全体の編集が必要となってしまうからです。
図:SS例
//二次元配列で1つの配列を狙い撃ちすると
array[1][3]
//と書く。(一つ目の[]が行、二つ目の[]が列)
//この例だと、1つ目と2つ目の列の間に列が追加されるとarray[1][3]で取れる値が変わ
てしまう。
//Object.arrayに変換するとどうなるかと言うと、、
//SSのsubjectをObjectのプロパティ値としてObjcetを作成するため、列が挿入されても指
した配列のコード修正をする必要がない。
//また、subjectをプロパティ値とするためコードとしても見やす
objectArray[2][packingNo]
//↑のように取りたい値を狙い撃ちする。ただ実際のコーディングでこのように[2]とマジ
クナンバーを指定することは少ない。(詳細は次回以降説明)
このようにObjectArray化した配列を処理する際に活用すべきメソッドの一つとして
Object.Assign()メソッドがあります。
どう言うメソッドか
コピー元のObjectArrayからコピー先のObjectArrayへ配列をマージ。
その際、プロパティ値の同じものは値を置き換えします。
このメソッドを使うことで、ObjectArrayのマージ+プロパティ値の置き換えができます。
使用例
//2つのサンプルObjectArrayを作成
const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 };
//ObjectArrayをマージ。同じプロパティ値のものはsource値が投入
const returnedTarget = Object.assign(target, source);
//targetのObjectArray自体にSourceの値が投入される
console.log(target);
// expected output: Object { a: 1, b: 4, c: 5 }
//もちろん新しく変数を定義したものも以下のようになる
console.log(returnedTarget);
// expected output: Object { a: 1, b: 4, c: 5 }
まとめ
Object.Assign()メソッドはObjectArrayを処理する上で必ず使用するメソッドなので仕様は必ず押さえておきましょう。
Comments