45296


<https://www.youtube.com/watch?v=JbaZs1dzsVo>

上記react native参考動画の

[code]

    static navigationOptions = ({navigation}) => {...}
    
[/code]

の部分なのですが、navigationを引数に受け取れる仕組みが理解出来ません。  
そもそも変数を{}で囲むとどういった動きをするのでしょうか。  
これはreact native独自の仕様なのか、それともJSの仕様なのでしょうか。

何をキーワードに検索したら良いかもわからず困っています。  
仕様の詳細が載っている文献がありましたら、ご紹介頂きたいです。


CC BY-SA 4.0
2018-07-04T03:24:22.693
45294
2018-07-04T06:44:04.527
2018-07-04T06:44:04.527
19110
22827
question
javascript reactjs react-native
static x = ( { y } ) => { ... }の仕組みについて


[引数の分割代入](https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment)といいます。

以下、サンプルです。

[code]

    // 引数で指定されたオブジェクトのうち、nameプロパティのみ利用する
    const f1 = ({ name }) => { return "hello " + name + "!!" }
    obj = { age: 12, name: 'hoge' }
    f1(obj)
    
[/code]

> "hello hoge!!"

以下のような分割代入を関数の引数に適応したものです。

[code]

    var o = {p: 42, q: true};
    var {p, q} = o;
    
    console.log(p); // 42
    console.log(q); // true
    
[/code]

JavaScriptは言語仕様が、ここ4、5年で大きく進化しています(ES2015,ES2016,ES2017など)。なので、一度、最近のJavaScriptについて書かれた参考書などを読まれると良いと思います。  
(私は最近のJavaScriptについて学ぶために、[初めてのJavaScript 第3版
――ES2015以降の最新ウェブ開発](https://www.oreilly.co.jp/books/9784873117836/)
を購入しました。他にも良い本があると思います。)


CC BY-SA 4.0
2018-07-04T03:53:46.407
45296
2018-07-04T04:08:05.580
2018-07-04T04:08:05.580
45294
answer