一栖疑、ES6簡(jiǎn)介
ECMAScript6.0(簡(jiǎn)稱ES6)下一代標(biāo)準(zhǔn),在2015年6月正式發(fā)布滔驶。目標(biāo):js語(yǔ)言編寫復(fù)雜的大型應(yīng)用程序遇革,成為企業(yè)級(jí)開發(fā)語(yǔ)言。規(guī)定了瀏覽器腳本的標(biāo)準(zhǔn)揭糕。
二萝快、新增let、const命令 用來聲明變量
let聲明的變量:1著角、沒有聲明提升揪漩,必須先聲明再使用。2.不能重復(fù)定義
為js新增加了塊級(jí)作用域 吏口,在塊級(jí)作用域中聲明函數(shù)奄容。聲明變量。只有在代碼塊內(nèi)有效产徊。
const聲明變量昂勒。聲明的常量。一旦聲明舟铜,常量的值就不能改變戈盈。
三、Class
引入Class(類)這個(gè)概念
創(chuàng)建對(duì)象
ES5
//構(gòu)造函數(shù)法
prototype對(duì)象的constructor屬性谆刨,直接指向“類”的本身 塘娶,與ES5行為是一致的。
constructor方法是類默認(rèn)的方法
2痴荐、class的繼承
使用extents關(guān)鍵字 與ES5修改原型鏈相比清晰很多
使用?super關(guān)鍵字 血柳,它在這里表示父類的構(gòu)造函數(shù),用來新建父類的this對(duì)象生兆。
ES5繼承难捌,實(shí)質(zhì)是先創(chuàng)建子類的實(shí)例對(duì)象this膝宁,然后再講父類的方法添加到this上面(Parent.apply(this))
ES6繼承,實(shí)質(zhì)是先創(chuàng)建父類的實(shí)例對(duì)象this(所以必須先調(diào)用super方法)根吁,然后再用子類的構(gòu)造函數(shù)修改this员淫。
三、string
新增模板字符串 ``
用`` 反引號(hào)來標(biāo)識(shí)起始击敌,用${}來引用變量
字符串自動(dòng)解析變量
` my name is ${this.name}`
四介返、Set和Map數(shù)據(jù)結(jié)構(gòu)
map的forEach()方法
鍵、值
Map.prototype【在控制臺(tái)敲】
map.forEach()
map.keys()
Set 集合 ?構(gòu)造函數(shù) 就有原型 Set.prototype
類數(shù)組結(jié)構(gòu)
唯一數(shù)組的集合
五沃斤、for...of循環(huán)圣蝎,作為遍歷所有數(shù)據(jù)結(jié)構(gòu)的統(tǒng)一方法、
循環(huán)可以使用的范圍包括數(shù)組衡瓶、Set徘公、和Map結(jié)構(gòu),某些類數(shù)組哮针,以及字符串
不支持對(duì)象遍歷
私有屬性size
案例:
六关面、新增箭頭運(yùn)算符
var priint = function(msg){
console.log(msg)
}
print("1617");
var print = (msg)=>{console.log(msg)}
print();
var print2 = () =>{
console.log();
}
匿名函數(shù)簡(jiǎn)寫形式
//function(){}
varstuList=[{name:"tom1",age:8},{name:"tom2",age:18},{name:"tom3",age:28}];
//按年齡排序
//? ? stuList.sort(function(a,b){
//? ? ? ? return?a.age?>?b.age;
//? ? });
stuList.sort((a,b)=>{
returna.age>b.age;
});
document.body.onclick=e=>console.log(e.pageX+"?"+e.pageY+this);
varperson={
name:"tom",
say:()?=>?console.log(this);
}
注意! 目前箭頭形式匿名函數(shù)簡(jiǎn)寫十厢,
函數(shù)執(zhí)行時(shí)內(nèi)部this始終代表window等太。
七、總結(jié)
目前并不是所有的瀏覽器都兼容ES6全部特性蛮放,用Babel可以將ES6碼轉(zhuǎn)為ES5代碼缩抡。
可以用20%的語(yǔ)法,在ES6的日常使用中占80%筛武。