1.小程序可以直接編些ES6袄膏,可以直接轉換
2践图,node支持ES6非常全
3,不太適合html和js混合寫沉馆,因為兼容性不太好
**let 塊級作用域 **
1.不允許重復定義
2.在作用域外訪問不了let定義的變量
3,類似于封閉空間码党,for循環(huán)i 外面訪問不了
4,就是一個匿名函數(shù)立即調用
** const ' ' **
1斥黑,定義常量揖盘,一旦賦值無法修改
2,const必須聲明的時候賦初始值锌奴,因為后面不允許再次定義
3兽狭,不能重復聲明,和let一樣
** 字符串連接, `` **
var a="我的"
var b="hannah"
console.log( ${a}名字叫${}
)
xxxxx$(變量名)xxxxx
有一個點 包住鹿蜀,才能使用${a}
**模板字符串(變量名)** 1箕慧,需要寫在點里面,可以使用變量用(變量名)
2耻姥,{}销钝,大括號內部可以放任意js表達式,也可以運算琐簇,甚至還可以調用函數(shù)${fn()}
模板編譯
xxxxxxxxxxxxxxxx(待完工)xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx()
很重要的
**結構賦值 **
1.左邊和右邊的機構是一樣的
var [a,b,c]=[12,5,101];//順序要相對
console.log(a,b,c)//12,5,101
和json配合
var {a,b,c}={a:12,b:5,c:101}//和順序無關
console.log(a)//12
var [a,[b,c],d]=[12,[1,2],5]//結構一定要一樣蒸健,格式一定要是一樣的
var jsons={"statuses":[{b:5,c:3,a:9}],"sta":[{b:5,c:3,a:9}]}
var {statuses,sta}=jsons
比較深層次的json數(shù)據(jù)
var jsons={"statuses":[{b:5,c:3,a:9}],"sta":[{b:5,c:3,a:9}]}
var {statuses,sta}=jsons
console.log(sta);
var [{a,b,c}]=sta;
console.log(a)
函數(shù)默認值
function getPost(){
return {left :100,stop:1000}
}
var {left,stop}=getPost();
console.log(left,stop)//100,1000
結構賦值給默認值
var{time=12,id=0}={};
console.log(time)//12
**復制數(shù)組Array.from [...args] **
Array.from
普通數(shù)組復制,如果想復制出一個獨立可刪減的數(shù)組需要for循環(huán)去做現(xiàn)在:
var arr=[1,2,3];
var arr2=Array.from(arr)
[...args]
var arr=[1,2,3];
var arr2=[...arr];
函數(shù)中的超引用
function show(...args){
console.log(args);//是一個獨立的數(shù)組婉商,可以增刪改查
}
show(1,2,3,4)似忧;
** 循環(huán) for of **
之前es5 中for 或者for in
現(xiàn)在是 for of
for in 遍歷的是索引 1,2,3
for of 遍歷的索引指向的值!
for in 循環(huán)主要就是為了循環(huán)json
for of 只要就是為了循環(huán) Map丈秩。
for of 可以循環(huán)數(shù)據(jù)盯捌,但是不能循環(huán)json!
Map 對象不可以使用for in 循環(huán)
Map 對象:初始化是一個二維數(shù)組蘑秽。
Map就是為了和for of 循環(huán)相結合使用
var map =new Map()饺著;
map.set("a","apple")//設置值
var map=new Map([["name", "張三"], ["title", "Author"]]);//也可以這樣設置值
map.get("a");//獲取a 的值 “apple”
map.delete("a")//刪除值!
Map配合for of 循環(huán)操作
全部key和value
var map=new Map([["name", "張三"], ["title", "李四"]]);
for(var n of map){
console.log(n);//["name","張三"]["title","Author"]
}
只出現(xiàn)單個kay或者單個value寫法如下
for(var [key,val] of map){
console.log(key);//name肠牲,title
console.log(b);//張三幼衰,李四
console.log(b,a);//張三 name,李四 title
}
只個循環(huán)key 或者value
for(var key of map.keys()){
console.log(key)//name title
}
for(var val of map.value()){
console.log(val)//張三,李四
}
for of 循環(huán)數(shù)組
循環(huán)值缀雳,默認循環(huán)值
var arr=[1,2,3];
for(var name of arr){
console.log(name)//循環(huán)是值渡嚣!
}
循環(huán)全部arr.entries()
for(var name of arr.entries()){
console.log(name)//循環(huán)是值!
}
循環(huán)索引 arr.keys()
for(var name of arr.keys()){
console.log(name)//循環(huán)是值!
}
** 箭頭函數(shù)=> **
使用箭頭函數(shù)的注意點:
1识椰,函數(shù)體內的this對象绝葡,就是定義時所在的對象,而不是使用時所在的對象(那里定義腹鹉,或者那里調用)
2藏畅,不可當做構造函數(shù),也就是不能使用new命令种蘸。
3墓赴,不能使用argument對象,可以使用reset(...arg)代替
4航瞭,不可以使用yield命令诫硕。
5,函數(shù)是按值傳遞的,但是普通函數(shù)刊侯,傳遞obj對象章办,如果在函數(shù)內修改參數(shù)的值,會影響外面obj對象滨彻,如果從新賦值一個實例就不會影響外貌藕届。箭頭函數(shù)中的reset...不同。
**面向對象**
ES5
function Person(name,age){ //又是類又是構造函數(shù)
this.name=name;
this.age=age;
};
Person.prototype.showName=function(){
return this.name;
};
var P=new Person("hanna",18);
console.log(P.name);
console.log(P.showName())
ES6
1亭饵,參數(shù)是可以是默認值的休偶。
class Person{//真正的類
constructor(name,age){//構造函數(shù)
this.name=name;//構造函數(shù)的屬性
this.age=age;
},
showName (){//構造函數(shù)的方法
return this.name
}
}
var p1=new Person("aaa",111);
alert(p1.name);
**面向對象的繼承**
ES5
function Person(name,age){ //父類
this.name=name;
this.age=age;
};
function wor(name,age){//子類
Person.call(this,name,age);//在子類的執(zhí)行環(huán)境中執(zhí)行父類的方法和屬性
};
var aa=new wor("11",11);
console.log(aa.showName());
ES6
class Worker extends Person{//直接繼承了
/*constructor(...args){//如果子類寫了構造方法,那么會覆蓋父類的屬性
super(...args)
this.name="111111111111";
}; */
};
var o=new Worker("11",11);//new出來子類實例
console.log(o.showName());//直接子類實例調用辜羊,就可以調用到父類的方法和屬性了
** 模塊化 **
ES6自帶的模塊化踏兜。
如何定義模塊化
如果使用
如果引用
區(qū)別1,common 輸出的是值得拷貝八秃,ES6 是值得引用碱妆,
Common是運行時加載,ES6是編譯是輸出接口昔驱。
Common是加載時執(zhí)行疹尾,es6是先加載,等渲染結束在執(zhí)行
Common循環(huán)加載有可能返回的是執(zhí)行一部分的數(shù)據(jù)不是最終全部的數(shù)據(jù)骤肛,
Es6引用的循環(huán)加載因為都是只加載一次纳本,所以有能因為發(fā)現(xiàn)引用,就去加載引用的模塊腋颠,導致用到的時候為null饮醇。
Es6的模塊加載和defer,一樣秕豫,都是先異步加載等到頁面渲染完成在執(zhí)行腳本。
Es6 模塊是并發(fā)性不是繼發(fā)性,cmd和amd混移,區(qū)別也是繼發(fā)和并發(fā)祠墅,commonjS是并發(fā)性。
Export defauit class{
歌径。毁嗦。。回铛。
}
Import myclass from‘myclass’狗准;
Let myclass =new myclass()
** **
** **
** **
** **
** **
** **
** **
** **
** **
** *`