【ES6】函數(shù)默認參數(shù)與rest參數(shù)

(一)函數(shù)默認參數(shù)

ES6中,可以為函數(shù)的參數(shù)指定默認值。函數(shù)默認參數(shù)允許在沒有值或undefined被傳入時使用默認形參。

function log(x, y = 'World') {
  console.log(x, y);
}

log('Hello') // Hello World
log('Hello', 'China') // Hello China
log('Hello', '') // Hello

默認參數(shù)使用注意點

  1. 參數(shù)變量是默認聲明的,所以不能用let或const再次聲明。
function foo(x = 5) {
  let x = 1; // error
  const x = 2; // error
}
  1. 使用參數(shù)默認值時,函數(shù)不能有同名參數(shù)。
// 不報錯
function foo(x, x, y) {
  // ...
}

// 報錯
function foo(x, x, y = 1) {
  // ...
}
// SyntaxError: Duplicate parameter name not allowed in this context
  1. 顯式傳入undefined或不傳值時使用函數(shù)默認參數(shù)值;傳入''null時使用傳入的參數(shù)值。
function test(num = 1) {
  console.log(typeof num);
}

test();          // 'number' (num is set to 1)
test(undefined); // 'number' (num is set to 1 too)

// test with other falsy values:
test('');        // 'string' (num is set to '')
test(null);      // 'object' (num is set to null)
  1. 參數(shù)默認值不是傳值的,而是在函數(shù)被調(diào)用時,參數(shù)默認值才會被解析。
function append(value, array = []) {
  array.push(value);
  return array;
}

append(1); //[1]
append(2); //[2], not [1, 2]
  1. 位置在前的默認參數(shù)可用于后面的默認參數(shù)。
function greet(name, greeting, message = greeting + ' ' + name) {
    return [name, greeting, message];
}

greet('David', 'Hi');  // ["David", "Hi", "Hi David"]
greet('David', 'Hi', 'Happy Birthday!');  // ["David", "Hi", "Happy Birthday!"]
  1. 通常情況下,定義了默認值的參數(shù),應該是函數(shù)的尾參數(shù)。因為這樣比較容易看出來,到底省略了哪些參數(shù)。如果非尾部的參數(shù)設置默認值,實際上這個參數(shù)是沒法省略的。
// 例一
function f(x = 1, y) {
  return [x, y];
}

f() // [1, undefined]
f(2) // [2, undefined])
f(, 1) // 報錯
f(undefined, 1) // [1, 1]

// 例二
function f(x, y = 5, z) {
  return [x, y, z];
}

f() // [undefined, 5, undefined]
f(1) // [1, 5, undefined]
f(1, ,2) // 報錯
f(1, undefined, 2) // [1, 5, 2]
  1. 指定了默認值以后,函數(shù)的length屬性,將返回沒有指定默認值的參數(shù)個數(shù)。如果設置了默認值的參數(shù)不是尾參數(shù),那么length屬性也不再計入后面的參數(shù)了。后文的 rest 參數(shù)也不會計入length屬性。
(function (a) {}).length // 1
(function (a = 5) {}).length // 0
(function (a, b, c = 5) {}).length // 2

(function(...args) {}).length // 0

(function (a = 0, b, c) {}).length // 0
(function (a, b = 1, c) {}).length // 1

(二)剩余(rest)參數(shù)

ES6 引入 rest 參數(shù)(形式為...變量名),用于獲取函數(shù)的多余參數(shù),這樣就不需要使用arguments對象了。rest參數(shù)搭配的變量是一個數(shù)組,該變量將多余的參數(shù)放入數(shù)組中。

function add(...values) {
  let sum = 0;

  for (var val of values) {
    sum += val;
  }

  return sum;
}

add(2, 5, 3) // 10

rest 參數(shù)使用注意點

  1. rest 參數(shù)之后不能再有其他參數(shù)(即只能是最后一個參數(shù)),否則會報錯。
// 報錯
function f(a, ...b, c) {
  // ...
}
  1. 函數(shù)的length屬性,不包括 rest 參數(shù)。
(function(a) {}).length  // 1
(function(...a) {}).length  // 0
(function(a, ...b) {}).length  // 1
  1. rest參數(shù)可以被解構,這意味著他們的數(shù)據(jù)可以被解包到不同的變量中。
function f(...[a, b, c]) {
  return a + b + c;
}

f(1)          // NaN (b and c are undefined)
f(1, 2, 3)    // 6
f(1, 2, 3, 4) // 6 (the fourth parameter is not destructured)

rest參數(shù)和 arguments對象的區(qū)別

  • rest參數(shù)只包含那些沒有對應形參的實參,而arguments對象包含了傳給函數(shù)的所有實參。
  • arguments對象不是一個真正的數(shù)組,而rest參數(shù)是真正的Array實例,也就是說你能夠在它上面直接使用所有的數(shù)組方法,比如 sort,map,forEachpop。
  • arguments對象還有一些附加的屬性 (如callee屬性)。
?著作權歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容