アプリ開発サークル勉強会① 開催日時 2021年1月2日(土) 19:40-21:00

JavaScript問題集

今日はこちらの問題集をすすめていきました。
https://gist.github.com/kenmori/1961ce0140dc3307a0e641c8dde6701d
Q.1からよくわからなかったのでいろいろやってみました。

学習メモ

Q1.の連想配列をマージして結果を表示する問題
Object.assign(target, source);

developer.mozilla.org

Object.assign() メソッドは、すべての列挙可能な自身のプロパティの値を、1つ以上のコピー元オブジェクトからコピー先オブジェクトにコピーするために使用されます。

連想配列と連想配列をマージした場合

const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 }; 
const result = Object.assign(target, source);
// 結果 { a: 1, b: 4, c: 5 }

• targetがコピー先
• sourceがコピー元
• resultが結果
  targetの中身を見ると{ a: 1, b: 4, c: 5 }となっていたのでsourceがtargetにコピーされていました。同じkeyがある場合は上書きされる。

配列と連想配列をマージした場合

const target = { a: 1, b: 2 };
const source = ['b', 'd'];
Object.assign(a, d)
// 結果 { '0': 'b', '1': 'd', a: 1, b: 2 }

普通にできました。keyを設定していない場合は自動で連想配列に変換されてindex番号がついてくる。

配列と配列をマージした場合

const target = ['a', 'b'];
const source = ['b', 'd'];
console.log(Object.assign(target, source));
// 結果 [ 'b', 'd' ]

コピー先の値がなくなりました。

すべての列挙可能な自身のプロパティの値

プロパティの値がないからかな？？

その他

const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 };
// c:5
target.c = source.c;

// c:5
target['c'] = source.c;

// Key全件取得
Object.keys(target);

// 削除
delete target['a'];

感想

はまりポイントとしては配列と連想配列の違いをよく理解していなかった。
頑張って連想配列をpushやconcatしようとしてました　笑
keyとvalue形式はAPIで値を取得した際にもよく使うので今回使ったメソッドは覚えておくと便利そう。