web-dev-qa-db-ja.com

未定義のJavascript ES6スプレッド演算子

React Appの開発中に、コンポーネントに条件付きプロップを送信する必要があったので、どこかにそうするパターンを見つけましたが、それは本当に奇妙に思え、どのようにそしてなぜ機能したのか理解できませんでした。

入力した場合:

console.log(...undefined)   // Error 
console.log([...undefined]) // Error
console.log({...undefined}) // Work

未定義でスプレッド演算子がアクティブになるとエラーが発生しますが、未定義がオブジェクト内にある場合は空のオブジェクトが返されます。

私はこの振る舞いについて非常に驚いています、それは実際にどのようになっているのでしょうか、これに頼ることができますか?それは良い習慣ですか?

23
omri_saadon

この動作は、オプションの拡散のような何かをするのに便利です:

function foo(options) {
  const bar = {
    baz: 1, 
    ...(options && options.bar) //options and bar can be undefined
  } 
}

そして、それはさらに良くなります オプションの連鎖 、これはstage-1

function foo(options) {
  const bar = {
    baz: 1, 
    ...options?.bar //options and bar can be undefined
  } 
}

a思考:あまりにもひどいので、配列に広がらない

24
bitstrider