Posted at

【メモ】JavaScriptの分割代入を利用してオブジェクトの一部を関数の引数にする


JavaScriptの分割代入を利用してオブジェクトの一部を関数の引数にする

以下の様な場合のメモ。


({hoge})=>{
// 何かの処理
}


分割代入自体の学習

以下等で学習するとわかりやすい。

ECMAScript 2015 の分割代入は奥が深かった - Qiita

ES2015で拡張されたObjectの記法と分割代入を活用する - Qiita


JavaScriptの分割代入を利用してオブジェクトの一部を関数の引数にするサンプル

ES2015で拡張されたObjectの記法と分割代入を活用する - Qiitaを非常に参考にさせていただいている。


サンプル実装


// person objectの定義
const person = {
name: 'hoge',
age: 25
};

// person objectの中のage propertyをshow関数の仮引数にセッティング
let show = ({age}) => alert(age);

// person objectを実引数にセッティング
show(person);


処理の内容

上記のサンプル実装では、以下の様になっている。

1. personのobjectを定義する

2. show関数で分割代入を利用し、person objectのage propertyを関数の仮引数として利用している

3. show関数を呼び出す際には、person objectを実引数に呼び出す

4. 呼び出されたshow関数は、person objectのageのみを引数で受け取っているので、ageのみを関数内で使用する


参考にさせていただいたURL

ECMAScript 2015 の分割代入は奥が深かった - Qiita

ES2015で拡張されたObjectの記法と分割代入を活用する - Qiita