ES6非構造オブジェクトの割り当て機能パラメータのデフォルト値

Question

こんにちは、私はここに渡す関数パラメータにオブジェクトの非構造の使用例を経たObject Destructuring Demo

function drawES6Chart({size = 'big', cords = { x: 0, y: 0 }, radius = 25} = **{}**) { 
    console.log(size, cords, radius); 
// do some chart drawing 
} 

// In Firefox, default values for destructuring assignments are not yet 
implemented (as described below). 
// The workaround is to write the parameters in the following way: 
    // ({size: size = 'big', cords: cords = { x: 0, y: 0 }, radius: radius = 
     25} = **{}**) 

drawES6Chart({ 
    cords: { x: 18, y: 30 }, 
    radius: 30 
}); 

は誰が最後に空のオブジェクトの割り当てを使用する理由は何である私に知らせることができ 私は太字（二重星に埋め込まれている）で上記の関数のパラメータを？

Answer 1

あなたはそれを使用し、パラメータなしで関数を呼び出す場合は、それが動作：

function drawES6Chart({size = 'big', cords = { x: 0, y: 0 }, radius = 25} = {}) { 
 
    console.log(size, cords, radius); 
 
// do some chart drawing 
 
} 
 

 
drawES6Chart();

場合エラーがスローされます。

TypeError: can't convert undefined to object

function drawES6Chart({size = 'big', cords = { x: 0, y: 0 }, radius = 25}) { 
 
    console.log(size, cords, radius); 
 
// do some chart drawing 
 
} 
 

 
drawES6Chart();

Answer 2

オブジェクトにはデフォルト値がありますが、そのオブジェクトも引数であるため、最初の引数のデフォルト値として空のオブジェクトが必要です。このオブジェクトは値が埋め込まれています。

擬似コードでは、なり、

function drawES6Chart({size = 'big', cords = { x: 0, y: 0 }, radius = 25} = {}) { 
} 

：

function drawES6Chart({**first argument**} = {**default value for first argument**}) { 
} 

Answer 3

あなたはそれぞれの性質を持っていないオブジェクトを渡す際に、デフォルトで非構造のみがそのことを行います。パラメータ全体のデフォルトである= {}では、（空の）オブジェクトをまったく渡すことができません。

drawES6Chart()はdrawES6Chart({})に相当します。

Answer 4

これは、functionパラメータのデフォルト値です。 = {}を使用しない場合undefinedの値を破棄できないため、関数に渡されるオブジェクトがないと、JavaScriptインタプリタはエラーをスローします。