JS - Default parameter

10259 ワード
TIL JavaScript ES6 テキストリンク

Default parameter


ES 6から、関数のデフォルトパラメータを指定できます.以前は,パラメータ伝達値が関数誤動作を引き起こすundefinedと同じであれば,if문を用いて処理していた.しかし、ES 6では、より簡単な構文を用いて処理することができる.

基本構文


ES5
function hello(name) {
  if (!name) {
    name = "World";
  }
  console.log("Hello, " + name + "!");
}

hello("Leo");		// Hello, Leo!
hello(undefined);	// Hello, World!
hello();		// Hello, World!
ES6
const hello = (name = "World") => {
  console.log(`Hello, ${name}!`);
}

hello("Leo");		// Hello, Leo!
hello(undefined);	// Hello, World!
hello();		// Hello, World!

詳細


expression, function


Defaultパラメータは式でも関数でも構いません.
/* 표현식 */
const f = (x = 5, y = x + 5) => {
  console.log(x, y);
}

f();
/* 함수 */
const showError = () => {
  console.error("wrong parameter");
  return 0;
};

const getPlus = (a, b = showError()) => {
  console.log(`${a} + ${b} = ${a + b}`);
};

getPlus(10, 20);	// 10 + 20 = 30
getPlus(50);		// Error worng parameter 50 + 0 = 100

letと同じ


Default parameterは関数でlet宣言と同じです.
const f = function (x = 1, y = 2 + x) {
 /*
 let x = 1;
 let y = 2 + x;
 */
  let z = y + 3;
  x = 4;
  console.log(x, y, z);	// 4 3 6
}
f();

整理する

  • Default Parameterは、undefinedおよび欠落した値に対してのみ機能します.
  • Default Parameter、표현식(expression)および함수(function)度を使用できます.
  • Defaultパラメータは、関数でletと宣言されたものと同じです.

    • リファレンス

  • https://www.inflearn.com/course/ecmascript-6-flow
    • CSDN文章の抽出
    1470. Shuffle the Array