1. ホーム
  2. javascript

Javascript ES6 spread operator on undefined [duplicate] (未定義)

2023-09-25 22:18:22

質問

reactアプリの開発中に、コンポーネントに条件付きpropを送る必要があったので、それを行うパターンをどこかで見つけました。

もし私がタイプすると

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

未定義に対してスプレッド演算子を実行するとエラーが発生しますが、未定義がオブジェクトの中にある場合は、空のオブジェクトが返されます。

私はこの動作に関して非常に驚いています。これは本当にあるべき姿なのでしょうか?

どのように解決するのですか?

この動作は、次のようなことをするときに便利です。 任意拡散 :

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

そして、さらに良くなるのが オプションの連鎖 にある Stage 4 であり、(すでに が TypeScript で利用可能です。 3.7+):

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

一念 配列への展開ができないのが残念です。