在es6之前,不能直接為函式的引數指定預設值,只能採用變通的方法
function
log(x, y)
log('hello'); // hello world
log('hello', 'china'); // hello china
log('hello', ''); // hello world
這種寫法的缺點在於,如果引數y
賦值了,但是對應的布林值為false
,則該賦值不起作用。就像上面最後一行,引數y
等於空字元,結果該改為預設值。
為了避免這個問題,通常需要先判斷一下引數y
是否被賦值,如果沒有,再等於預設值
if (typeof y === 'undefined')
es6允許為函式的引數設定預設值,即直接寫在引數定義的後面
function
log(x, y = 'world')
log('hello') // hello world
log('hello', 'china') // hello china
log('hello', '') // hello
可以看到,es6的寫法比es5簡潔許多。
引數變數是預設宣告的,所以不能用let
或const
再次宣告
function
foo(x = 5)
function
foo()
foo({}); // undefined,5
foo(); // 1,5
foo(); // typeerror: cannot read property 'x' of undefined
上面的**使用了物件的解構賦值預設值,而沒有使用函式引數的預設值。只有當函式foo
的引數是乙個物件時,變數x
和y
才會通過解構賦值而生成。否則會報錯。
通常情況下,定義了預設值的引數,應該是函式的尾引數。因為這樣比較容易看出來,到底省略了那些引數。如果非尾部的引數設定預設值,實際上這個引數是沒法省略的。
// 例子1
function
f(x=1, y)
f(); // [1, undefined]
f(2); // [2, undefined]
f(, 1); // 報錯
f(1, 1); // [1, 1]
// 例子2
function
f(x, y=5, z)
f() // [undefined, 5, undefined]
f(1) // [1, 5, undefined]
f(1, 2) // 報錯
f(1, undefined, 2) // [1, 5, 2]
指定了預設值以後,函式的length
屬性,將返回沒有指定預設值的引數個人。也就是說,指定了預設值,length
屬性將失真。
(function
(a){}).length // 1
(function
(a=5){}).length // 0
(function
(a, b, c=5){}).length // 2
乙個需要注意的地方是,如果引數預設值是乙個變數,則該變數所處的作用域,與其他變數的作用域規則是一樣的,即先是當前函式的作用域,然後才是全域性作用域
var x = 1;
function
f(x, y=x)
f(2); // 2
上面的**中,引數y
的預設值等於x
。呼叫時,由於函式的作用域內部的變數x
已經生成,所以y
等於引數x
,而不是全域性變數x
。
如果呼叫時,函式的作用域內部的變數x
沒有生成,結果就會不一樣
let x = 1;
function
f(y=x)
f() // 1
上面的**中,函式呼叫時,y
的預設值變數x
尚未在函式內部生成,所以x
指向全域性變數。
如果此時,全域性變數x
不存在,就會報錯
function
f(y = x)
f() // referenceerror: x is not defined
ES2015函式擴充套件 函式引數的預設值
在es6之前,不能直接為函式的引數指定預設值,只能採用變通的方法 function log x,y log hello hello world log hello china hello china log hello hello world 這種寫法的缺點在於,如果引數y賦值了,但是對應的布林值為...
解析ES2015中的靜態方法
es2015引入的靜態方法 static關鍵字 和我之前文章中解析的class和constructor一樣,都只是一種語法糖,本質上,與es5中的函式沒有什麼區別。注意,es2015並沒有對靜態屬性的定義。從es2015開始,我們可以使用static關鍵字定義乙個類的靜態方法 class foo f...
解析ES2015中的物件繼承
從es2015開始,我們可以使用extends關鍵字實現物件繼承,使用super關鍵字指向父物件。比如下面的es2015 class fooshow class barextends fooshow var bar newbar 1 jason bar.show 上面 的輸出結果為 子類 父類id ...