2021-03-16

一、變量let和const


var:


可以重復(fù)聲明

可以進(jìn)行變量提升(即將聲明提升到最前面)

let:


不可以重復(fù)聲明

塊級(jí)作用域

不可以變量提升

const:


不可以重復(fù)聲明

塊級(jí)作用域

聲明后不可以進(jìn)行修改

聲明時(shí)必須初始化

const聲明的數(shù)組內(nèi)容可以被修改,所以常規(guī)使用const進(jìn)行數(shù)組變量的聲明

二、解構(gòu)賦值


1.什么是解構(gòu)?:es6允許按照一定的模式,從數(shù)組和對(duì)象中提取值,對(duì)變量進(jìn)行賦值,這被稱為解構(gòu)


2.數(shù)組解構(gòu)賦值:


語(yǔ)法:

let [a,b,c] = [1,2,3];

console.log(a,b,c);

3.對(duì)象解構(gòu)賦值:


語(yǔ)法:let{a,b} = {

? ? ? ? a:'aa',

? ? ? ? b:'bb'

};


console.log(a,b);

4.字符串的解構(gòu)賦值:


語(yǔ)法: let[a,b,c,d] = 'hello';

console.log(a,b,c,d);//h e l l

5.函數(shù)的解構(gòu)賦值:

function fun([x,y]){

console.log(x+y);

}


fun([1,2]);//實(shí)參

6.解構(gòu)的用途:


交換變量的值

從函數(shù)返回多個(gè)值(這樣就可以快速調(diào)用一些數(shù)據(jù))

函數(shù)傳參

提取json數(shù)據(jù)(解構(gòu)對(duì)提取json尤其有用)

函數(shù)參數(shù)默認(rèn)值(es6允許函數(shù)的參數(shù)設(shè)置默認(rèn)值)

7.函數(shù)默認(rèn)初始值

一般用法:(直接將默認(rèn)值寫在形參之后)

function fun(x,y ='world'){

? ? ? console.log(x,y);

}

與解構(gòu)配合使用:

function fun({x,y=5}={}){

? ? ? console.log(x,y);

}

三、對(duì)象的簡(jiǎn)化寫法


1.ES6允許在大括號(hào)里面,直接寫入變量和函數(shù),作為對(duì)象的屬性和方法在Vue中經(jīng)常使用,這樣寫會(huì)使得編寫更加的簡(jiǎn)潔!

四、箭頭函數(shù)


1.ES6允許使用「箭頭」(=>)定義函數(shù)

聲明函數(shù)的兩種方法:

let fn = function(){

}


let fn = (a,b) => {

return a+b;

}

2.this是靜態(tài)的,this始終指向函數(shù)聲明時(shí)所在作用域下的this的值


3.箭頭函數(shù)的this值是靜態(tài)的,始終指向函數(shù)聲明時(shí)所在作用域下的this的值

4.箭頭函數(shù)不能作為一個(gè)構(gòu)造函數(shù)實(shí)例化對(duì)象!


5.箭頭函數(shù)不能使用arguments變量

五、Symbol

Symbol是一種標(biāo)識(shí)符,是一種類型,表示獨(dú)一無(wú)二的值

1.Symbol簡(jiǎn)介:

Symbol的值是唯一的,用來(lái)解決命名沖突的問(wèn)題

Symbol的值不能與其他數(shù)據(jù)進(jìn)行運(yùn)算

Symbol定義的對(duì)象屬性不能使用for…in...進(jìn)行循環(huán)遍歷,但是可以使用Reflect.ownKeys來(lái)獲取對(duì)象的所有鍵名

1.直接使用Symbol進(jìn)行創(chuàng)建

2.使用Symbol.for進(jìn)行創(chuàng)建

六、迭代器


1.for…in…:遍歷返回的是鍵名~~~for…of…:遍歷返回的是鍵值


2.迭代器的工作原理


創(chuàng)建一個(gè)指針對(duì)象,指向當(dāng)前數(shù)據(jù)結(jié)構(gòu)的起始位置

第一次調(diào)用對(duì)象的next方法,指針自動(dòng)指向數(shù)據(jù)結(jié)構(gòu)的第一個(gè)成員

接下來(lái)不斷使用next方法,指針不斷向后移動(dòng)直到指向最后一個(gè)數(shù)據(jù)成員

每調(diào)用一次方法返回一個(gè)包含value和done屬性的對(duì)象(done代表是否完,為一個(gè)布爾值,如果遍歷完成則為ture,否則為false)

3.注意:要自定義遍歷數(shù)據(jù)的

時(shí)候,要想到迭代器!

七、ES6模塊化

1.有助于處理各個(gè)模塊之間的沖突,易于維護(hù),易于修改

2.ES6之前的模塊化規(guī)范主要有:

1. CommonJS => NodeJS、Broeserify

2. AMD => requireJ

3. CMD => seaJS

3.模塊化功能主要由兩個(gè)命令構(gòu)成:export和import


1)export命令用于規(guī)定模塊的對(duì)外接口

2)import命令用于輸入其他模塊提供的功能

八、瀏覽器使用模塊化的兩種方式

1、使用import引入

2、建立一個(gè)入口文件然后僅直接引入入口文件

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • ES6 新特性 ES6 新特性 一ES6簡(jiǎn)介 二塊級(jí)作用域綁定1 let聲明2 const聲明Constant D...
    _無(wú)為_(kāi)閱讀 933評(píng)論 0 3
  • 1、es5和es6的區(qū)別,說(shuō)一下你所知道的es6 ECMAScript5,即ES5,是ECMAScript的第五次...
    沒(méi)糖_cristalle閱讀 753評(píng)論 0 0
  • let && const let與var的聲明用法相同,但是多了一個(gè)臨時(shí)死區(qū)(Temporal Distonrti...
    天那一邊閱讀 318評(píng)論 0 0
  • 小伙伴大多數(shù)還在使用ES5來(lái)進(jìn)行編寫,使用ES5這無(wú)可厚非,因?yàn)镋S5畢竟還是主流,速度也更快,但ES6引入的新特...
    cuiyao50閱讀 350評(píng)論 0 0
  • ECMAScript - 學(xué)習(xí)筆記 ?? ??nvm node.js 包管理工具 nvm github[https:/...
    Super三腳貓閱讀 899評(píng)論 0 1

友情鏈接更多精彩內(nèi)容