九,ES6為函式做的一些擴充套件

2021-07-28 07:56:11 字數 2110 閱讀 2947

引數的預設值

傳統方法:

function demo(m,n)

傳統做法實現原理是:如果運算子||左側是true則直接返回左側的,反之,返回右側的;

不過有乙個缺點,就是如果我想傳進去0的話,那麼就不行了,或者說傳入的引數布林值為false就不可以了,

es6新方法:

function demo(m="shasha",n=20)

demo()//shasha 20

demo("xiaoming",30)//xiaoming 30

如果函式有多個引數,但只有部分需要指定預設值,另一部分不需要的話,那麼,

設定預設值的引數一定要放在最後

新方法解決了傳入引數是false就不可以的問題了,只有傳入的引數是undefined或者不傳才會使用預設值;哪怕傳入的引數是0,null.....

rest引數

先看例子:

function sum(result,...values));

//列印出求和的結果看看

console.log(result);

//結果:10

}//儲存求和結果的變數res

var res = 0;

//呼叫sum函式

sum(res,1,2,3,5);

首先會看到...values(三個點+變數名),這是一種新寫法,也就是rest引數,它的意思是在實參中除了第乙個引數以外,剩餘的引數都會被values獲取到;

rest引數必須是函式的最後乙個引數,後面不能再跟其他引數

錯誤寫法:

function demo(a,...values,bb)

正確寫法:

functiondemo(a,bb,...values)

擴充套件運算子

rest引數,它的表示法使用...(三個點),它除了用在rest引數中,還有其他用途,我們稱這種表示法為

擴充套件運算子

它一般結合陣列使用,把陣列的元素用逗號分隔開來,組成乙個序列

function demo(a,b)

var arr=[1,2]

demo(...arr) //3

從這個案例我們就可以理解擴充套件運算子...的作用了,

它可以將乙個陣列轉成乙個對應的引數數列

。在實際開發中,你可以根據擴充套件運算子的作用,可以靈活運用,實現各種效果

箭頭函式(=>)

傳統寫法:

var num=function demo(a)

箭頭函式:

var num=a=>a

簡單吧!是不是有點不可思議!

第二種寫法:a=>a; 這裡的

第乙個a代表是傳進去的引數,箭頭=>後面的a表示函式體;

var num=(a,b)=>

num(1,2) //3

注意上面的引數和函式體部分,

如果引數超過1個的話,需要用小括號()括起來,函式體語句超過1條的時候,需要用大括號括起來

箭頭函式的最大作用就是簡化函式,大大地減少**量

例如對乙個陣列求和:

傳統寫法:

var num=0;

[1,2,3,4,5,6].foreach(function(value))

箭頭函式:

var num=0;

[1,2,3,4,5,6].foreach(value=>num+=value)

確實省了很多**!!!

ES6學習筆記九 函式的擴充套件

一 函式引數的預設值function log x,y world log hello hello world log hello hello注意 引數是預設宣告的,所以在函式體內不能用let或const再次宣告 function foo x 5 注意 使用引數預設值時,函式不能有同名引數 funct...

ES6 函式的擴充套件

在es5中有這種情況 function fn a,b fn 30 fn 0,10 20因為a 0,所以將10賦給它在es6中 function fn a 10,b 20 fn 30 fn 0,10 10rest 引數形式為 變數名 用於獲取函式的多餘引數,這樣就不需要使用arguments物件了。r...

ES6 函式的擴充套件

es6允許為函式的引數設定預設值,可以直接寫在引數定義的後面。let x 1 function f x,y x f 2 y 2 let x 1 function f y x f y 1let foo outer function bar func x foo rest引數 變數名 用於獲取多餘引數 ...