1. Map對(duì)象
ES6提供了新的數(shù)據(jù)結(jié)構(gòu)Map,Map結(jié)構(gòu)提供了“值—值”的對(duì)應(yīng)嘉裤,是一種更完善的Hash結(jié)構(gòu)實(shí)現(xiàn)郑临。如果你需要“鍵值對(duì)”的數(shù)據(jù)結(jié)構(gòu),Map比Object更合適屑宠。它類(lèi)似于對(duì)象厢洞,也是鍵值對(duì)的集合,但是“鍵”的范圍不限于字符串典奉,各種類(lèi)型的值(包括對(duì)象)都可以當(dāng)作鍵躺翻。{"b" => "banana"}并且每一項(xiàng)都包含了key和value
我們來(lái)新建一個(gè)Map對(duì)象,并為其賦值:
let map = new Map();
map.set('a','apple');
map.set('b','banana');
console.log(map); // Map {"a" => "apple", "b" => "banana"}
結(jié)果如圖:
獲取Map對(duì)象里面的值(map.get()):
let map = new Map();
map.set('a','apple');
map.set('b','banana');
console.log(map.get('b')); //banana
刪除Map對(duì)象里面的值(map.delete();):
let map = new Map();
map.set('a','apple');
map.set('b','banana');
map.delete('a');
console.log(map); // {"b" => "banana"}
獲取Map對(duì)象的“長(zhǎng)度”:
let map = new Map();
map.set('a','apple');
map.set('b','banana');
console.log(map.size); //2
console.log(map.length); //undefined
map.entries()
let map = new Map();
map.set('a','apple');
map.set('b','banana');
console.log(map.entries()); // MapIterator {["a", "apple"], ["b", "banana"]}
遍歷Map對(duì)象(for...of... )
let map = new Map();
map.set('a','apple');
map.set('b','banana');
for(let name of map){
console.log(name); //["a", "apple"] ["b", "banana"]
}
//循環(huán)出來(lái)的是以數(shù)組套鍵值對(duì)的方式
如果我們只要Map中的“值”怎么辦卫玖?別急
let map = new Map();
map.set('a','apple');
map.set('b','banana');
for(let val of map.values()){
console.log(val); //apple banana
}
如果我們只要Map中的“鍵(key)”怎么辦公你?別急
let map = new Map();
map.set('a','apple');
map.set('b','banana');
for(let key of map.keys()){
console.log(key); // a b
}
如果我們只要Map中的“鍵 --- 值”怎么辦?也別急
let map = new Map();
map.set('a','apple');
map.set('b','banana');
for(let [key,value] of map.entries()){
console.log(key,value); //a apple b banana
}
2.for循環(huán)那些事
a) for ... in ...循環(huán)
//循環(huán)數(shù)組
let arr = [12,5,8];
for(let i = 0;i<arr.length;i++){
console.log(i); //0 1 2
console.log(arr[i]); //12 5 8
}
let arr = [12,5,8];
for(let i in arr){
console.log(i); //0 1 2
console.log(arr[i]); //12 5 8
}
//循環(huán)json數(shù)據(jù)
let json = {a:12,b:5,c:8};
for(let name in json){
console.log(name); //a b c
console.log(json[name]); //12 5 8
}
b) for ... of ...循環(huán)
//循環(huán)數(shù)組
let arr = [12,5,8];
for(let name of arr){
console.log(name); // 12 5 8
}
//循環(huán)json數(shù)據(jù)
let json = {a:'apple',b:'banana'};
for(let name of json){
console.log(name);
}
//報(bào)錯(cuò)假瞬,因?yàn)椴荒苡胒or ...of...來(lái)循環(huán)json數(shù)據(jù)
c) 刪除json的某一條數(shù)據(jù)
let json = {a:12,b:5};
delete json.a;
console.log(json); // b:5
3. 箭頭函數(shù)
ES6標(biāo)準(zhǔn)新增了一種新的函數(shù):Arrow Function(箭頭函數(shù))陕靠。
為什么叫Arrow Function迂尝?因?yàn)樗亩x用的就是一個(gè)箭頭:
x => x * x
我們先回顧下ES5函數(shù)定義與調(diào)用:
var show = function(){
alert(12);
};
show(); // 12
const show = () =>{
alert(12);
};
show(); // 12
//個(gè)人理解:這里將function關(guān)鍵字去掉然后在“()”后面加一個(gè)“=>”
接下來(lái)我們舉幾個(gè)例子,來(lái)進(jìn)一步了解下箭頭函數(shù):
a) 函數(shù)有返回值
//ES5函數(shù)寫(xiě)法
var sum = function(a,b){
return a+b;
}
alert(sum(12,5));
//ES6函數(shù)寫(xiě)法
let sum = (a,b) => {
return a+b;
}
alert(sum(12,5));
//進(jìn)化一下 --- 省略花括號(hào)
let sum = (a,b) => a+b;
alert(sum(12,5));
b) 參數(shù)是1個(gè)
var show = function(a){ return 'welcome'}
//相當(dāng)于 省略括號(hào)
var show = a => 'welcome'
c) 參數(shù)是0個(gè)
var show = function(){ return 'welcome'}
//相當(dāng)于 省略括號(hào)
var show = () => 'welcome'
注意:箭頭函數(shù)下 剪芥,arguments 不能使用了
var show = (a,b) => console.log(this.arguments); // 報(bào)錯(cuò)
######箭頭函數(shù)簡(jiǎn)單應(yīng)用:
數(shù)組排序
var arr = [12,55,8];
//es5寫(xiě)法
arr.sort(function(n1,n2){
return n1 - n2;
});
//es6寫(xiě)法
arr.sort((n1,n2) => n1-n2);
alert(arr);