一個常見的問題:ECMAScript 和 JavaScript 到底是什麼關係?
ECMAScript 6.0(以下簡稱 ES6)是 JavaScript 語言的下一代標準,已經在 2015 年 6 月正式發佈了。它的目標,是使得 JavaScript 語言可以用來編寫複雜的大型應用程序,成爲企業級開發語言。
ECMAScript 和 JavaScript 的關係是,前者是後者的規格,後者是前者的一種實現。
Let命令
ES6新增的命令,有以下特點:
1.let是變量,可以對let聲明的數據重新賦值
2.在同一作用域裏面,let不能重複聲明
以下這種寫法是錯誤的。
function error() {
let i = 10;
let i = 12;
}
以下這種寫法是正確的,因爲定義的let變量i在不同的作用域中。
function correct1() {
let i = 10;
}
function correct2() {
let i = 10;
}
3.和var聲明的變量一樣,let聲明的變量區分全局和局部變量。
Const命令
在ES6中,新增了常量的概念
特點:
1.同一作用域內的常量不能修改
2.和let一樣,同一作用域內不能重複定義相同的變量
3.const也區分全局變量和局部變量
Symbol
使用Symbol定義的是一個獨一無二的數據,以下是一個簡單的例子:
用let聲明的變量a和b,console出來的結果是true(相等的)
let a = "hello";
let b = "hello";
console.log(a == b);
而用Symbol定義的a和b,console出來的結果是false(不相等)
let a = Symbol("hello");
let b = Symbol("hello");
console.log(a == b);
解構賦值
提供一個和源數據類型相同的帶變量的數據結構,可以實現對應位置的數據直接賦值到變量上的效果。
對於數組:
let [a, b, c] = [1, 2, 3];
可以從數組中提取值,按照對應位置,對變量賦值。結果爲:a = 1;b = 2;c = 3;
數組中不需要獲取的數據需要佔位實現
如下例子中,不想獲取4
let arr = [1,2,3,[4,3]];
let [a,b,c,[,e]] = arr;
console.log(a); //1
console.log(b); //2
console.log(c); //3
console.log(e); //3
對於對象:
不需要獲取的數據不需要佔位,直接提供你想獲取的屬性名即可。
let obj = {name:"zhangsan",age:24,add:"yt"};
let { name, add } = obj;
console.log(name);
console.log(add);
對於字符串:
let str = "大家好呀";
let [j1,j2,j3,j4] = str;
console.log(j1); //大
console.log(j2); //家
console.log(j3); //好
console.log(j4); //呀
對於函數:
函數調用的同時可使用解構賦值,也可設定默認值,如下,若obj1未定義degree屬性,則console出來的結果爲”benke”,若obj1定義了degree屬性爲“daxue”,則console出來的結果爲“daxue”
function showInfo({name,age,weight,degree="benke"}) {
console.log(name);
console.log(age);
console.log(weight);
console.log(degree);
}
let obj1 = {
name:"lisi",
age:"21",
weight:70,
degree:"daxue"
};
showInfo(obj1);
set集合:
set集合和數組類似,但是不能存放相同的數據
常用方法和屬性:
add():往集合添加數據。
let set = new Set([1, 2, 3, 4]);
set.add(5);//新增元素5
delete(value):刪除某個值,返回一個布爾值,表示刪除是否成功。
let set = new Set([1, 2, 3, 4]);
set.delete(1);//刪除1
has(value):返回一個布爾值,表示該值是否爲Set的成員。
let set = new Set([1, 2, 3, 4]);
console.log(set.has(2));//結果爲true
clear():清除所有成員,沒有返回值。
let set = new Set([1, 2, 3, 4]);
set.clear();
size屬性:獲取集合的大小。
let set = new Set([1, 2, 3, 4]);
console.log(set.size);//長度是4
for of:遍歷集合
for (let i of set) {
console.log(i);
}
利用set清除數組的重複數據
[...set]:把set集合轉換成數組
let arr = [1,2,3,1,1,3];
let set = new Set(arr);
set.forEach(function (value) {
console.log(value);
});
let arr2 = [...set];
console.log(arr2);
則輸出結果爲[1,2,3];
WeakSet
1.成員只能是對象,而不能是其他類型的值。
2.不能遍歷,因爲大小不能確定,size屬性也不能用
WeakSet 結構有以下三個方法。
.add(value):向 WeakSet 實例添加一個新成員。
.delete(value):清除 WeakSet 實例的指定成員。
.has(value):返回一個布爾值,表示某個值是否在 WeakSet 實例之中。
Map
在ES5中對象的key值只能是字符串類型,ES6中新增了一種數據類型map,和對象一樣是鍵值對的集合,但是map中的key值可以是任意的數據類型。
屬性和方法:
size 屬性
size屬性返回 Map 結構的成員總數。
set(key, value)方法
設置鍵名key對應的鍵值爲value,然後返回整個 Map 結構。如果key已經有值,則鍵值會被更新,否則就新生成該鍵。
let arr = [1,2];
let obj1 = {name:"zs"};
let map = new Map();
map.set(1,"1");
map.set(true,"true");
map.set(arr,"array");
map.set(obj1,"obj1");
get方法
使用get方法讀取這個鍵
console.log(map.get(1));
delete方法
使用delete方法刪除了這個鍵
console.log(map.delete(1));
for of遍歷
for(item of map){
console.log(item[0] + ":" + map.get(item[0]));
}
forEach遍歷
map.forEach(function (value, key) {
console.log(value + ":" + key);
});
WeaMap
結構與Map結構類似,也是用於生成鍵值對的集合。但key值只能是對象類型的。
主要方法和屬性有:
set(),has(),get()和delete()。
iterator遍歷器
遍歷過程是這樣的。
(1)創建一個指針對象,指向當前數據結構的起始位置。也就是說,遍歷器對象本質上,就是一個指針對象。
(2)第一次調用指針對象的next方法,可以將指針指向數據結構的第一個成員。
(3)第二次調用指針對象的next方法,指針就指向數據結構的第二個成員。
(4)不斷調用指針對象的next方法,直到它指向數據結構的結束位置。
遍歷arr數組:
let arr = [1,2,3,4];
let it = arr[Symbol.iterator]();
while (true){
let re = it.next();
if (re.done){
break;
}
console.log(re.value);
}
遍歷set數組:
let set = new Set(["zs","ls","ww"]);
let it2 = set[Symbol.iterator]();
while (true){
let re = it2.next();
if (re.done){
break;
}
console.log(re.value);
}