如何在ES5與ES6環境下處理函式預設引數

函式預設值是乙個很提高魯棒性的東西（就是讓程式更健壯）

mdn關於函式預設引數的描述：函式預設引數允許在沒有值或undefined被傳入時使用預設形參。

所以只能夠自己去增強函式的功能，一般會這麼來做：

function

dosomething (name, age)

我們將函式的兩個引數name與age進行預設值的處理，如果沒有則使用預設值。

在執行一下函式後，好像並沒有什麼不對：

dosomething()       //

default name, 18
dosomething('niko') //
niko        , 18
dosomething(, 12)   //
default name, 12

然而當我們執行這樣的**時，就會獲得一些超出預期的結果：

dosomething('niko', 0) // niko, 18

就像下邊的四個表示式，都會輸出wrong，這很顯然不能夠滿足上邊mdn關於函式預設引數的定義：

console.log(0         || 'wrong')

console.log(''        || 'wrong')
console.log(
null      || 'wrong')
console.log(
false     || 'wrong')

所以，在es5中正確的預設值處理應該是這樣：

function

dosomething (name, age) 
if (age ===undefined) 
console.log(name, age)
}

使用三元運算子簡化操作

或者我們簡寫成三元運算子形式的：

function

dosomething (name, age)

使用函式進行封裝

但是如果我們每寫乙個函式，都要重複的去做這些操作

未免太麻煩了，所以，我們對這個邏輯進行乙個簡單的封裝：

function

defaultvalue (val, defaultval) 
function
dosomething (name, age)

這樣就很簡潔的在es5實現了函式預設引數的邏輯

one momre things

關於上邊的defaultvalue函式實現方法，我們在合理的使用弱型別語言的優勢後

可以使用這種方式來省去三元運算子的操作：

function

defaultvalue ()

我們知道，arguments表示函式所有的實參

我們使用arguments[0]獲取第乙個實參，然後與undefined進行全等比較

在外層將表示式的結果轉換為number，然後將這個值作為下標獲取arguments中對應的引數。

因為是由boolean值轉變而來，所以只會存在0、1兩種選項。

也就實現了上邊三元運算子的功能。

es6版本的函式預設值基本上就是我們上邊實現的那種套路了

但是因為是原生的，所以會有相應的新語法，能夠更簡潔的使用：

function dosomething (name = 'default name', age = 18)

es6中提供了新的語法，可以讓我們在函式宣告引數後邊直接寫= [defaultvalue]的這種形式來設定某個引數的預設值。

直接使用這種方式，省去了在函式內部進行預設值的檢查，能夠讓函式專注的做它應該做的事情。

function

requireparams () 
function dosomething (name = requireparams(), age = 18)

如果name引數為undefined，就會觸發預設值規則

然後呼叫requireparams函式，而我們在函式中直接throw了乙個error

上邊的處理都是針對簡單的基本型別資料進行處理的，但如果我們有如下的乙個函式：

function

init () {}
init()

如果在es5環境下，針對這種引數的預設值處理將會變得無比複雜

首先要判斷這乙個引數是否存在，然後在判斷引數中的所有key是否存在

而在es6中，可以這樣來做：

function

init ( ={}) 
init()

首先在析構函式的後邊新增預設值= {}，然後針對每一項引數新增預設值，很簡潔的就實現了我們的需求。

es5版本的polyfill**在倉庫中的位置：defaultvalue

在ES5與ES6環境下處理函式預設引數的實現方法

函式預設值是乙個很提高魯棒性的東西 就是讓程式更健壯 mdn關於函式預設引數的描述 函式預設引數允許在沒有值或undefined被傳入時使用預設形參。es5使用邏輯或 來實現 眾所周知，在es5版本中，並沒有提供的直接方法供我們我們處理函式預設值 所以只能夠自己去增強函式的功能，一般會這麼來做 fu...

ES6與ES5差別簡述

es6與es5差別 1 es6新增了let命令，用來宣告變數。它的用法類似於var，但是所宣告的變數，只在let命令所在的 塊內有效。a 1 b undefined let不像var存在變數提公升，即變數一定要宣告之後才能使用。2 塊級作用域 es5只有全域性作用域和函式作用域，沒有塊級作用域。3 ...

es5繼承與es6繼承

es5中的繼承方式 1.原型鏈繼承 缺點 1.建立例項時無法像父類建構函式傳遞引數 2.因為指定了原型，所以不能實現多繼承 3.父類建構函式上的屬性被所有子類共用，給原型上的屬性賦值會改變其他子類的屬性值 es5 const parent function name,age parent.proto...