javascrip原有的表現集合概念的數據結構:
Array-數組
Object-對象
es6:四種集合概念的數據結構
Array-數組
Object-對象
Map
Set
Iterator遍歷器
1 提供一種通用的遍歷不同數據結構的方法
2 擁有Symbol.iterator屬性的數據結構,都可以使用for...of來進行遍歷
3 原生具備Iterator接口的數據結構如下
3.1 Array
3.2 String
3.3 Set
3.4 Map
3.5 TypedArray
3.6 函數的arguments對象(箭頭函數中沒有arguments對象)
3.7 NodeList
4 所以其他的結構如果要使用for...of的話,需要加上Symbol.iterator屬性,比如Object默認是沒有的,可以加上,但不是很有必要
Promise對象的好處:
1 可以將異步操作以同步的流程表達出來,不會出現層層嵌套的情況
2 Promise對象提供統一的接口,使得控制異步操作更加容易
Promise對象的缺點:
1 無法取消Promise,一旦新建它就會立即執行,無法中途取消
2 如果不設置回調函數,Promise內部拋出的錯誤,不會反應到外部
3 當處於pending狀態時,無法得知目前進展到哪一個階段(剛剛開始還是即將完成)
字符串的擴展:
1 模板字符串
2 新增了一些方法:
2.1 之前判斷內容會否存在這個字符串只有indexOf(),現在新增了3個方法:
includes(); 是否包含
startWith(); 是否以它開頭
endWith(); 是否以它結尾
2.2 將一個字符串重複
let h = 'hello'.repeat(3); //h="hellohellohello"a
參數只能是正數,不能爲負數,可以爲小數,但只會取整數部分,如:2.9->2
如果參數爲負數會報錯,注:如果是小數會在取整數部分之後判斷是否爲負數,因爲如:-0.1 取整數部分-> -0 ->0 所以這裏不會報錯,因爲取整之後就等於0了,不是負數了
2.3 trim() 消除前後字符串前後的空格
這裏新增了2個方法:
trimStart() 清除頭部
trimEnd() 清除尾部
數值的擴展:JavaScript 所有數字都保存成 64 位浮點數
1 ES6 將全局方法parseInt()和parseFloat(),移植到Number對象上面,行爲完全保持不變。
1.1 parseInt() 這是原來的使用方式
1.2 Number.parseInt() 現在的使用方式
2 判斷是否爲整數
Number.isInteger();
3 Math的擴展:
3.1 Math.trunc() 返回一個數的整數部分(+-號保留)
如:Math.trunc(12.9)->12
Math.trunc(-12.9)->-12
3.2 Math.pow(n,m) n的m次方(這個不是新增的)
4 es6新增了一個數據類型-BigInt(大整數,類似Java中的大數BigDecimal),可以計算超出Number範圍的數值
函數的擴展:
1 參數可以設置默認值
指定默認值後,這個參數就不計算在函數的length屬性上了,比如:
(function func(x,y=1){}).length //1,如果y沒有設置默認值,則length=2
2 rest參數,可以將多餘的參數放到rest中
如:function func(x,...arr){} arr是個數組
func(1,2,3,4,5);
則這個時候arr=[2,3,4,5]
3 函數的name屬性:返回函數名
function func(){};
func.name; //func
4 箭頭函數:
寫法:
let f = value=>value+1;
等同於:
let f = function(value){
return value+1;
}
如果有多個參數並且多條語句,則如下:相當於省略了function
let f = (v1,v2)=>{
console.log(v1);
return v1+v2;
}
注:箭頭函數中的this和非箭頭函數的this指向不同
普通函數:this指向當時調用這個函數的對象
箭頭函數:this指定當時聲明這個箭頭函數所在的對象的this對象所指
數組的擴展:
1 spread 擴展運算符 (任何定義了 Iterator 接口的對象,都可以用擴展運算符轉爲真正的數組)
對數組使用擴展運算符
1.1 基本描述
console.log(...[1,2,3]) 只有函數調用時,擴展運算符外面才能包一層括號使用,否則會報錯,比如直接 (...[1,2,3]) 回車會報錯,
和函數的rest參數是相反的
function func(...arr){
//這是把外面的多個參數接成一個數組
}
1.2 替代apply()方法
spread可以替代es5中的apply方法,因爲擴展運算符可以直接展開數組
es5:
function func(a,b,c){}
let param = [1,2,3];
func.apply(null,param);
es6:
function func(a,b,c){}
let param = [1,2,3];
func(...param);
1.3 複製數組
let arr1 = [1,2,3];
let arr2;
使用原來的方法:
方法1:for循環一個個給arr2.push();
方法2:arr2 = arr1.concat(); //通過連接,返回一個新數組,而concat又沒有傳參數,所以返回的就是arr1數組的內容
使用es6中的擴展運算符:
arr2 = [...arr1];
1.4 合併數組
同樣,合併數組也可以使用擴展運算符:
let arr3 = [...arr1,...arr2];
對字符串也可以使用擴展運算符
let strs = [..."hello"]; //["h", "e", "l", "l", "o"]
上面發現對數組可以使用 擴展運算符;對字符串也可以使用擴展運算符,那到底什麼時候能使用擴展運算符呢?
任何定義了遍歷器(Iterator)接口的對象(參閱 Iterator 一章),都可以用擴展運算符轉爲真正的數組。
2 Array.of方法用於將一組值,轉換爲數組
let arr = Array.of(1,2,4); //[1,2,4]
其實也可以這樣:let arr = [];
arr.push(1,2,4); //[1,2,4]
3 數組的find()和findIndex()方法
3.1 find(); 返回第一個符合條件的數據
[-9,-5,0,2-7].find((value,index,arr)=>{ //value:循環的每一項值;index:當前下標;arr:該數組
return value>0;
})
//結果是2
3.2 findIndex(); 返回符合條件的第一個數據的index
[-9,-5,0,2-7].findIndex((value,index,arr)=>{ //value:循環的每一項值;index:當前下標;arr:該數組
return value>0;
})
//結果是3
4 includes()等
對象的擴展:
1 屬性和方法的簡寫:
1.1 屬性的簡寫:
let foo = "bar";
let obj = {foo};
相當於:
let foo = "bar";
let obj = {foo:foo};
1.2 方法的簡寫:
let obj = {
add(x,y){
return x+y;
}
}
等同於:
let obj = {
add:function(x,y){
return x+y;
}
}
2 方法的name屬性:
不管是不是對象的方法,都有name屬性,返回方法名
obj.add.name; //add
3 屬性的遍歷:
ES6 一共有 5 種方法可以遍歷對象的屬性
3.1 for...in
循環遍歷對象自身的和繼承的可枚舉屬性(不含 Symbol 屬性)
3.2 Object.keys(obj)
返回一個數組,包括對象自身的(不含繼承的)所有可枚舉屬性(不含 Symbol 屬性)的鍵名
3.3 Object.getOwnPropertyNames(obj)
返回一個數組,包含對象自身的所有屬性(不含 Symbol 屬性,但是包括不可枚舉屬性)的鍵名
3.4 Object.getOwnPropertySymbols(obj)
返回一個數組,包含對象自身的所有 Symbol 屬性的鍵名
3.5 Reflect.ownKeys(obj)
返回一個數組,包含對象自身的(不含繼承的)所有鍵名,不管鍵名是 Symbol 或字符串,也不管是否可枚舉
以上的 5 種方法遍歷對象的鍵名,都遵守同樣的屬性遍歷的次序規則。
首先遍歷所有數值鍵,按照數值升序排列。
其次遍歷所有字符串鍵,按照加入時間升序排列。
最後遍歷所有 Symbol 鍵,按照加入時間升序排列。
4 加入了super 關鍵字
當前對象的原型對象
5 對象的解構賦值
let { x, y, ...z } = { x: 1, y: 2, a: 3, b: 4 };
5 擴展運算符:對象的擴展運算符(...)用於取出參數對象的所有可遍歷屬性,拷貝到當前對象之中
let z = { a: 3, b: 4 };
let n = { ...z };
n // { a: 3, b: 4 }
由於數組是特殊的對象(key值爲下標值),所以對象的擴展運算符也可以用於數組
let foo = { ...['a', 'b', 'c'] };
Symbol類型
Symbol類型的值是獨一無二的
基本類型有:undefined,null,number,string,boolean,Object+新增的Symbol
Symbol值的定義:(基本上,它是一種類似於字符串的數據類型)
let s = Symbol();
這個s就是個Symbol值
可以給它加描述信息,便於區分:
let s = Symbol("s");
Set和Map
1 Set
1.1 Set類似於數組,但是Set中的元素不允許重複,都是唯一的
添加成員:
let set = new Set();
set.add(1);
1.2 Set可以接收有Iterator接口的數據結構,所以這裏就可以接受:string,Array等
new Set([1,2,2,3]); //{1,2,3}
new Set("hello"); //{"h", "e", "l", "o"}
1.3 利用Set給數組/字符串去重
let array = [.....];
let set = new Set(array);
let arr = [...set];
1.4 Set不能加入重複元素的判斷類似於 “===” 的比較,即類型和值都要相同,
因爲Set.add()時不會發生類型轉換,所以"1",和 1 是不相同的,都能加進去
1.5 Set上的方法
長度:size; 不是方法
是否存在:has(value);
添加:add(value); 返回操作完之後的整個Set
刪除:delete(value) 返回boolean值
清除:clear(); 將裏面的元素都清掉,size爲0
遍歷:有四個方法
keys();返回鍵名的遍歷器 由於Set沒有鍵名,所以key和value的值是一樣的(這裏注意key不是和數組一樣的下標值)
new Set("hello"); //第一個元素的key和value都是"h"
values();返回鍵值的遍歷器
entries();返回鍵值對的遍歷器
forEach();返回每個元素
前面3個方法都返回的是遍歷器,因此可以直接使用for...of遍歷返回的值
let set = new Set([1,2,3,4,5,5,43]);
let keys = set.keys();
for(k of keys){
console.log(k);
}
最後一個forEach()
set.forEach((value,key,set)=>{
console.log(`${key},${value}`);
})
2 Map
2.1 Map結構類似Object,是鍵值對的形式
Object的key只能是字符串,值的類型沒有限制
Map的key和value都可以是任意類型
2.2 基本使用
let map = new Map(); //也可以給參數:new Map([{"name:":"jack"},{"age",12}])
長度:size; //不是方法
是否存在:has(value);
添加(設置):set(key,value);
刪除:delete(key);
獲取:get(key);
清除所有成員:clear();
遍歷:和Set一樣,只是keys和values的值不一樣,因爲Map是有鍵名的