es6語法是一種標準。ES6全稱是ECMAScript 6，是正式發(fā)布的JavaScript語言的一種標準，該標準的目標是使得JavaScript語言可以用來編寫復雜的大型應用程序，成為企業(yè)級開發(fā)語言。ECMAScript和JavaScript的關系是：前者是后者的規(guī)格，后者是前者的一種實現(xiàn)。

本教程操作環(huán)境：windows7系統(tǒng)、ECMAScript 6版、Dell G3電腦。

ES6全稱是ECMAScript 6，是正式發(fā)布的JavaScript語言的一種標準，該標準的目標是使得JavaScript語言可以用來編寫復雜的大型應用程序，成為企業(yè)級開發(fā)語言。

ES6是繼ES5之后發(fā)布的JavaScript語言的新一代標準，加入了很多新的特性和語法，該標準于2015年6月17日發(fā)布了正式版本，并被正式命名為ES2015。

ECMAScript 和 JavaScript 的關系是，前者是后者的規(guī)格，后者是前者的一種實現(xiàn)（另外的 ECMAScript 方言還有 JScript 和 ActionScript）

2011 年，ECMAScript 5.1 版發(fā)布后，就開始制定 6.0 版了。因此，ES6 這個詞的原意，就是指 JavaScript 語言的下一個版本。 ES6 的第一個版本，在 2015 年 6 月發(fā)布，正式名稱是《ECMAScript 2015 標準》（簡稱 ES2015）。 2016 年 6 月，小幅修訂的《ECMAScript 2016 標準》（簡稱 ES2016）如期發(fā)布，這個版本可以看作是 ES6.1 版，因為兩者的差異非常小，基本上是同一個標準。根據(jù)計劃，2017 年 6 月發(fā)布 ES2017 標準。

因此，ES6 既是一個歷史名詞，也是一個泛指，含義是 5.1 版以后的 JavaScript 的下一代標準，涵蓋了 ES2015、ES2016、ES2017 等等，而 ES2015 則是正式名稱，特指該年發(fā)布的正式版本的語言標準。我 們說 ES6 的地方，一般是指 ES2015 標準，但有時也是泛指“下一代 JavaScript 語言”。

一、塊作用域構造let和const

塊作用域存在于：函數(shù)內部、塊中（即：字符 “ { ” 與 “ } ” 之間的區(qū)域）

1.let聲明

• 通過var聲明的變量存在變量提升機制，而let聲明的變量不會被提升，可將變量的作用域限制在當前代碼塊中

//通過var聲明的變量
??//函數(shù)內部
????????function?changeState(flag)?{
????????????if?(flag)?{
????????????????var?color?=?"red"
????????????}?else?{
????????????????console.log(color);
????????????????return?null;
????????????}
????????}
????????changeState(false);
???//塊中
????????{
????????????var?a?=?1;
????????}
????????console.log("a="?+?a);
???//for循環(huán)中
????????for?(var?i?=?0;?i?<?10;?i++)?{}
????????console.log("i="?+?i);

?//通過let聲明的變量
????????????//函數(shù)內部
????????????function?changeState(flag)?{
????????????????if?(flag)?{
????????????????????let?color?=?"red"
????????????????}?else?{
????????????????????console.log(color);
????????????????????return?null;
????????????????}
????????????}
????????????changeState(false);
???????
????????????//塊中
????????????{
????????????????let?a?=?1;
????????????}
????????????console.log("a="?+?a);
??????
????????????//for循環(huán)中
????????????for?(let?i?=?0;?i?<?10;?i++)?{}
????????????console.log("i="?+?i);

• 在同一作用域下，不能使用let重復聲明已經(jīng)存在的標識符，但如果在不同的作用域下，則是可以的。

//?在同一作用域下，不能使用let重復聲明已經(jīng)存在的標識符，但如果在不同的作用域下，則是可以的
????var?a=0;
????var?b=0;
????{
????????let?a=0;
????}
????let?b=0;

• 使用let聲明變量，可以防止變量的重復聲明

?		var?a=0;
????????var?a=10;//ok
????????var?b=1
????????let?b=100;

2.const聲明

• 每個通過const關鍵字聲明的變量必須在聲明的同時進行初始化
• 在同一作用域下用const聲明已經(jīng)存在的標識符也會導致語法錯誤
• 使用const聲明對象，對象本身的綁定不能修改，但對象的屬性和值是可以修改的

???	const?person={
????????????name:"zhangSan"
????????};
????????person.name="lisi";	?//ok
????????person.age=19;	//ok
????????
????????person={
????????????name:"wangwu"
????????};

3.全局塊作用域綁定

• 在全局作用域中使用var聲明的變量或對象，將作為瀏覽器環(huán)境中的window對象的屬性（使用var很可能會無意中覆蓋一個已經(jīng)存在的全局屬性）

?		var?greeting="welcome";
????????console.log(window.greeting);
????????console.log(window.Screen);
????????var?Screen="liquid?crystal";
????????console.log(window.Screen);

• 使用let或const聲明變量和常量，避免覆蓋window對象的屬性

?		let?greeting="welcome";
????????console.log(window.greeting);
????????console.log(window.Screen);
????????const?Screen="liquid?crystal";
????????console.log(window.Screen==Screen);

總結

• 通過var聲明的變量存在變量提升機制，而let聲明的變量不會被提升，可將變量的作用域限制在當前代碼塊中
• 在同一作用域下，不能使用let重復聲明已經(jīng)存在的標識符，但如果在不同的作用域下，則是可以的
• 使用let聲明變量，可以防止變量的重復聲明
• 每個通過const關鍵字聲明的變量必須在聲明的同時進行初始化
• 在同一作用域下用const聲明已經(jīng)存在的標識符也會導致語法錯誤
• 使用const聲明對象，對象本身的綁定不能修改，但對象的屬性和值是可以修改的
• 在全局作用域中使用var聲明的變量或對象，將作為瀏覽器環(huán)境中的window對象的屬性（使用var很可能會無意中覆蓋一個已經(jīng)存在的全局屬性）
• 使用let或const聲明變量和常量，避免覆蓋window對象的屬性

二、解構賦值

解構賦值是對賦值運算符的擴展。

他是一種針對數(shù)組或者對象進行模式匹配，然后對其中的變量進行賦值。

在代碼書寫上簡潔且易讀，語義更加清晰明了；

也方便了復雜對象中數(shù)據(jù)字段獲取。

//1、數(shù)組解構
// 傳統(tǒng)
let a = 1, b = 2, c = 3
console.log(a, b, c)
// ES6
let [x, y, z] = [1, 2, 3]
console.log(x, y, z)
/*********************************************************************************************************/
/*********************************************************************************************************/
//2、對象解構
let user = {name: 'Johon', age: 18}
// 傳統(tǒng)
let name1 = user.name
let age1 = user.age
console.log(name1, age1)
// ES6
let { name, age } = user//注意：解構的變量必須和user中的屬性同名
console.log(name, age)

三、模板字符串

模板字符串相當于加強版的字符串，用反引號 `,除了作為普通字符串，還可以用來定義多行字符串，

還可以在字符串中加入變量和表達式。

// 字符串插入變量和表達式。變量名寫在 ${} 中，${} 中可以放入 JavaScript 表達式。
let name = 'Kuangshen'
let age = 27
let info = `My Name is ${name},I am ${age+1} years old next year.`
console.log(info)
// My Name is Kuangshen,I am 28 years old next year.

四、聲明對象簡寫

const age = 12
const name = '小王'
// 傳統(tǒng)
const person1 = {age: age, name: name}
console.log(person1)
// ES6
const person2 = {age, name}
console.log(person2) //{age: 12, name: '小王'}

五、定義方法簡寫

// 傳統(tǒng)
const person1 = {
sayHi:function(){
console.log('Hi')
}
}
person1.sayHi();//'Hi'
// ES6
const person2 = {
sayHi(){
console.log('Hi')
}
}
person2.sayHi() //'Hi'

六、對象拓展運算符

符號 (...)

let person = {nameL:"oAk",age:23}
let someone1 = persion // 引用賦值
let someone2 = { ...person } // 對象拷貝
someone1.name = 'oAk_OLD'
someone2.name = 'oAk_NEW'
console.log(persion) // {name:'oAk_OLD', age:23}
console.log(someone1) // {name:'oAk_OLD', age:23}
console.log(someone2) // {name:'oAk_NEW', age:23}

【相關推薦：javascript視頻教程、編程視頻】

以上是es6語法是一種標準嗎的詳細內容。更多信息請關注PHP中文網(wǎng)其他相關文章！