1、回顧
用ES5定義一個(gè)加法函數(shù):
function add(a,b){
return a+b;
}
console.log(add(1,2)); //3
如果b有默認(rèn)值:(這個(gè)時(shí)候可以只傳一個(gè)參數(shù))
function add(a,b=1){
return a+b;
}
console.log(add(1)); //2
2、ES6中函數(shù)拋出錯(cuò)誤
function add(a,b=1){
if(a == 1){
throw new Error('a is a error');
}
return a+b;
}
console.log(add(1)); //Uncaught Error: a is a error
通過(guò)throw new Error,控制臺(tái)可以拋出我們自定義的錯(cuò)誤
3、函數(shù)中的嚴(yán)謹(jǐn)模式
在ES5中,嚴(yán)謹(jǐn)模式'use strict'只能在文件的最上面,相當(dāng)于全局使用,而在ES6中,可以寫(xiě)在函數(shù)中或者是塊級(jí)作用域{}中,如下:
function add(a,b=1){
'use strict'
return a+b;
}
console.log(add(1)); //Illegal 'use strict' directive in function with non-simple parameter list
會(huì)報(bào)錯(cuò)是因?yàn)槟J(rèn)值與嚴(yán)謹(jǐn)模式?jīng)_突了,如果在函數(shù)中使用嚴(yán)謹(jǐn)模式,那么函數(shù)的參數(shù)就不能有默認(rèn)值,將默認(rèn)值去掉,程序就可以正常運(yùn)行:
function add(a,b){
'use strict'
return a+b;
}
console.log(add(1,2)); //3
4、獲得函數(shù)需要傳遞的參數(shù)
在ES6中,可以通過(guò)函數(shù)名.length的方式獲得函數(shù)需要傳遞的參數(shù):
function add(a,b){
return a+b;
}
console.log(add.length); //2
但如果這時(shí)候我們給b一個(gè)默認(rèn)值:
function add(a,b=1){
return a+b;
}
console.log(add.length); //1
所以通過(guò)函數(shù)名.length獲得的就是函數(shù)必須要傳的參數(shù)的個(gè)數(shù),(不包括函數(shù)中有默認(rèn)值的參數(shù))
5、箭頭函數(shù)
將上面的加函數(shù)變成箭頭函數(shù):
var add = (a, b) => a+b;
console.log(add(1,2)); //3
如果函數(shù)體只有一句話就可以省略函數(shù)的花括號(hào){},這時(shí)候就相當(dāng)于{return a+b;},如果函數(shù)體里不止有一條語(yǔ)句,那么花括號(hào){}不能省
此外,箭頭函數(shù)中不能使用new,所以,箭頭函數(shù)不能當(dāng)構(gòu)造函數(shù)使用
6、函數(shù)解構(gòu)
①函數(shù)對(duì)對(duì)象的解構(gòu)
let json = {
a:'字符串a(chǎn)',
b:'字符串b'
};
function fun({a,b}){
console.log(a,b);
}
fun(json); //字符串a(chǎn) 字符串b
通過(guò)該方式,json型的數(shù)據(jù)可以直接傳到函數(shù)中,不用再一次次傳參數(shù)了
②函數(shù)對(duì)數(shù)組的解構(gòu)
let arr = ['值1','值2','值3'];
function fun(a,b,c){
console.log(a,b,c);
}
fun(...arr); //值1 值2 值3
通過(guò)對(duì)象擴(kuò)展運(yùn)算符,可以在函數(shù)中傳入數(shù)組,而不用傳入一個(gè)一個(gè)的值
7、ES6中的in
①判斷對(duì)象中是否存在某個(gè)鍵名:
let obj = {
a:'值a',
b:'值b'
};
console.log('a' in obj); //true
console.log('c' in obj); //false
如果存在,則返回true,否則返回false
②判斷數(shù)組的值是否是空值
在ES5中可以通過(guò)數(shù)組.length的方式看數(shù)組是否有值,但該方法有個(gè)弊端,如下:
let arr = [,,,,,];
console.log(arr.length); //5
當(dāng)數(shù)組都是空值時(shí),數(shù)組依舊有長(zhǎng)度值
針對(duì)這種情況,在ES6中就可以通過(guò)in的方式來(lái)判斷
let arr = [1,,,,];
console.log(0 in arr); //true
console.log(1 in arr); //false
當(dāng)數(shù)組在該位置上不是空值時(shí),會(huì)返回true,如果是空值會(huì)返回false(這里的0和1代表的是數(shù)組的下標(biāo)即索引)
8、數(shù)組遍歷的各種方式
①forEach:
let arr = ['值1','值2','值3'];
arr.forEach((item,index)=>console.log(index, item));
//0 "值1"
//1 "值2"
//2 "值3"
②filter
let arr = ['值1','值2','值3'];
arr.filter((item,index)=>console.log(index, item));
//0 "值1"
//1 "值2"
//2 "值3"
③some
let arr = ['值1','值2','值3'];
arr.some((item,index)=>console.log(index, item));
//0 "值1"
//1 "值2"
//2 "值3"
④map
let arr = ['值1','值2','值3'];
arr.map(item => console.log(item)); //值1 值2 值3
console.log(arr.map(item => 'web')); //(3) ["web", "web", "web"]
9、數(shù)組轉(zhuǎn)字符串
①tostring()
let arr = ['值1','值2','值3'];
console.log(arr.toString()); //值1,值2,值3
該方法轉(zhuǎn)換時(shí)默認(rèn)用逗號(hào)隔開(kāi)
②join()
let arr = ['值1','值2','值3'];
console.log(arr.join('=')); //值1=值2=值3