Javascript

Object.assignではなく、スプレッド構文を使う【JS】

Object.assignでパラメータの複製とか追加を実装していたのですが、
スプレッド構文を使えばもっと短くかけるよね、というTipsです。

スプレッド構文自体の使い方はこんな感じです。

# 配列もしくはオブジェクト
const Hoge = [ 'foo', 'bar' ]

# 別のリストの中で、配列を展開する
[...Hoge, 'hoge']
=> (3) ['foo', 'bar', 'hoge']

結論

今までObject.assignを使用していましたが、スプレッド構文を使う事でこんな風に書けます。

# オブジェクトがあって、プロパティを追加したい時
let params = { foo: 1, bar: 2 }

# 今まではこう書いていた
Object.assign(params, { hoge: 3 })

# スプレッド構文でこのように書ける
{ ...params, hoge: 3 }
=> {foo: 1, bar: 2, hoge: 3}

まとめ

今までObject.assignを使っていましたが、スプレッド構文の方がスマートに書けますし、慣れてくると読解もしやすいです。
ただ、スプレッド構文はshallow copyなので、ネストしているオブジェクトを扱う場合には注意が必要です。

ピックアップ記事

  1. 【UE4】用語備忘録メモ
  2. 【Blender】zip版のBlenderをBlender Launcherに移…
  3. 【Blender】複数バージョンを簡単に管理できる、BlenderLaunche…
  4. 【Rails】selectメソッドで特定の条件を満たす要素を取得する
  5. 【Rails】railsでIndex name ‘xxx’…

関連記事

 
  1. Javascript

    reverse()は破壊的メソッド【JS】

    配列の逆順ソートには reverse() が使えるが、破壊的…

  2. Javascript

    パラメータをobjectでまとめて渡す【Vue】

    フロントエンドをvueで実装しているアプリがあります。…

カレンダー

2024年4月
1234567
891011121314
15161718192021
22232425262728
2930  

最近の記事

  1. Blender

    【Blender】レンダリング結果を新規ウィンドウで開かないようにする
  2. gitでファイル変更の一部をコミットする

    git

    git add -p でファイルの一部をコミットする【Git】
  3. Blender

    起動時の設定をカスタムする【Blender】
  4. Ruby on Rails

    【Rails】findメソッドで連想配列から指定した値を検索する
  5. 慣れれば3分!Bumpノードを使用した質感表現の方法

    Blender

    【Blender】Bumpを使用した質感表現の方法
PAGE TOP