1.函數參數的默認值

基本用法

ES6 之前,不能直接為函數的參數指定默認值,只能采用變通的方法。

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

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

上面代碼檢查函數log的參數y有沒有賦值,如果沒有,則指定默認值為World。這種寫法的缺點在于,如果參數y賦值了,但是對應的布爾值為false,則該賦值不起作用。就像上面代碼的最后一行,參數y等于空字符,結果被改為默認值。

為了避免這個問題,通常需要先判斷一下參數y是否被賦值,如果沒有,再等于默認值。

if (typeof y === 'undefined') {
  y = 'World';
}

ES6 允許為函數的參數設置默認值,即直接寫在參數定義的后面。

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

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

可以看到,ES6 的寫法比 ES5 簡潔許多,而且非常自然。下面是另一個例子。

function Point(x = 0, y = 0) {
  this.x = x;
  this.y = y;
}

const p = new Point();
p // { x: 0, y: 0 }

除了簡潔,ES6 的寫法還有兩個好處:首先,閱讀代碼的人,可以立刻意識到哪些參數是可以省略的,不用查看函數體或文檔;其次,有利于將來的代碼優(yōu)化,即使未來的版本在對外接口中,徹底拿掉這個參數,也不會導致以前的代碼無法運行。

參數變量是默認聲明的,所以不能用let或const再次聲明。

function foo(x = 5) {
  let x = 1; // error
  const x = 2; // error
}

上面代碼中,參數變量x是默認聲明的,在函數體中,不能用let或const再次聲明,否則會報錯。

使用參數默認值時,函數不能有同名參數。

// 不報錯
function foo(x, x, y) {
  // ...
}

// 報錯
function foo(x, x, y = 1) {
  // ...
}
// SyntaxError: Duplicate parameter name not allowed in this context

另外,一個容易忽略的地方是,參數默認值不是傳值的,而是每次都重新計算默認值表達式的值。也就是說,參數默認值是惰性求值的。

let x = 99;
function foo(p = x + 1) {
  console.log(p);
}

foo() // 100

x = 100;
foo() // 101

面代碼中,參數p的默認值是x + 1。這時,每次調用函數foo,都會重新計算x + 1,而不是默認p等于 100。

?著作權歸作者所有,轉載或內容合作請聯系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內容

  • 函數參數的默認值 基本用法 在ES6之前,不能直接為函數的參數指定默認值,只能采用變通的方法。 上面代碼檢查函數l...
    陳老板_閱讀 514評論 0 1
  • 函數參數的默認值 基本用法 在ES6之前,不能直接為函數的參數指定默認值,只能采用變通的方法。 上面代碼檢查函數l...
    呼呼哥閱讀 3,703評論 0 1
  • 前面的話 函數是所有編程語言的重要組成部分,在ES6出現前,JS的函數語法一直沒有太大的變化,從而遺留了很多問題,...
    CodeMT閱讀 887評論 0 1
  • 特別說明,為便于查閱,文章轉自https://github.com/getify/You-Dont-Know-JS...
    殺破狼real閱讀 628評論 0 0
  • 11-9日卡 吳小倩 2017.11.10 12:30 打開App 吳小倩~【日精進打卡第20天】 深圳市慧友冠源...
    吳小倩_680f閱讀 188評論 0 0

友情鏈接更多精彩內容