Set是ES6的新特性。 Set是ES6新增的資料結構,是一種有序列表集合,類似數組,但是其成員的值都是唯一的,沒有重複的值;set的遍歷順序就是插入順序,set保存的一個函數列表調用時,就是按照指定的順序進行調用,因此set類型是有順序的。
本教學操作環境:windows7系統、ECMAScript 6版、Dell G3電腦。
Set是ES6的新特性。
Set 是 ES6 提供的新的資料結構,類似數組,但是成員的值都是唯一的,沒有重複的值。
Set本身就是一個建構函數,用來產生Set資料結構。
// 创建Set实例 let set1 = new Set(); // {} let set2 = new Set([1,2,{name:'杰克'}]); // {1,2,{name:'杰克'}}
set類型是es6中新增的有序列表集合,其中包含了一些相互獨立的非重複值;set的遍歷順序就是插入順序,set保存的一個函數列表調用時,就是按照指定的順序進行調用,因此set類型是有序的。
Set的增刪改查
Set的實例關於增刪改查的方法:
add()
delete()
#has()
clear()
add()
新增某個值,傳回Set 結構本身
當新增實例中已經存在的元素,set不會進行處理新增
s.add(1).add(2).add(2); // 2只被加了一次
delete ()
刪除某個值,傳回一個布林值,表示刪除是否成功
s.delete(1)
has()
傳回一個布爾值,判斷該值是否為Set的成員
s.has(2)
clear()
#清除所有成員,沒有傳回值
s.clear()
Set的遍歷
Set實例遍歷的方法有如下:
關於遍歷的方法,有如下:
keys():傳回鍵名的遍歷器
values():傳回鍵值的遍歷器
entries():傳回鍵值對的遍歷器
forEach():使用回呼函數遍歷每個成員
Set的遍歷順序就是插入順序
keys方法、values方法、entries方法回傳的都是遍歷器物件
let set = new Set(['red', 'green', 'blue']); for (let item of set.keys()) { console.log(item); } // red // green // blue for (let item of set.values()) { console.log(item); } // red // green // blue for (let item of set.entries()) { console.log(item); } // ["red", "red"] // ["green", "green"] // ["blue", "blue"]
forEach()用於對每個成員執行某種操作,沒有傳回值,鍵值、鍵名都相等,同樣的forEach方法有第二個參數,用來綁定處理函數的this
let set = new Set([1, 4, 9]); set.forEach((value, key) => console.log(key + ' : ' + value)) // 1 : 1 // 4 : 4 // 9 : 9
擴充運算子和Set 結構結合實作陣列或字串去重
// 数组 let arr = [3, 5, 2, 2, 5, 5]; let unique = [...new Set(arr)]; // [3, 5, 2] // 字符串 let str = "352255"; let unique = [...new Set(str)].join(""); // ""
實作並集、交集、和差集
let a = new Set([1, 2, 3]); let b = new Set([4, 3, 2]); // 并集 let union = new Set([...a, ...b]); // Set {1, 2, 3, 4} // 交集 let intersect = new Set([...a].filter(x => b.has(x))); // set {2, 3} // (a 相对于 b 的)差集 let difference = new Set([...a].filter(x => !b.has(x))); // Set {1}
擴充知識:
普通陣列與Set實例的互相轉換
1.陣列轉為Set實例
let arr = [1,2,3]; let set = new Set(arr);// {1,2,3}
2.Set實例轉為陣列
let set = new Set([1,2,3]);// {1,2,3} // 方式一 扩展运算符 let arr = [...set];// [1,2,3] // 方式二 Array.from方法 let arr = Array.from(set);// [1,2,3]
【相關推薦:javascript影片教學、web前端】
#以上是Set是ES6的嗎的詳細內容。更多資訊請關注PHP中文網其他相關文章!