新增的es6資料結構有哪些

新增結構有：1、Symbol，表示獨一無二的值，是一個函數結構；2、Set，指的是「集合」結構，類似陣列，允許存放無序且不能重複的資料；3、WeakSet，類似Set，內部資料也不能有重複值；4、Map，指的是「字典」結構，可儲存對映關係。

本教學操作環境：windows7系統、ECMAScript 6版、Dell G3電腦。

ES6新增資料結構

1、Symbol

Symbol是ES6中新增的一個基本資料型別之一，它是一個函數。每一個從Symbol函數返回的Symbol值都是獨一無二的，symbol值作為物件屬性的識別符號，也是唯一的用途的。

const s1 = Symbol()
const s2 = Symbol()
console.log(s1 === s2); // false

symbol作為key

第一種方式，直接在物件的字面量中新增。

// symbol作為key
const obj = {
  [s1]:'abc',
  [s2]:'cc',
}

第二種方式，通過新增陣列方式新增。

// 需要用陣列方式來獲取，不能通過點語法，否則會獲取到字串key
console.log(obj[s1]);

第三種方式，通過物件中的defineProperty方法新增。

const s4=Symbol()
Object.defineProperty(obj,s4,{
  configurable:true,
  enumerable:true,
  writable:true,
  value:'ff'
})

通過symbol獲取對應的值

需要用陣列方式來獲取，不能通過點語法，否則會獲取到字串key。

console.log(obj[s1]);

symbol不能被隱式轉換成string型別。

注意：Symbol函數中的引數是symbol描述符，這是在ES10新增的特性

let Sym = Symbol("Sym")
alert(Sym)  // TypeError: Cannot convert a Symbol value to a string

我們不能直接alert一個symbol物件，但是我們可以通過toString的方式或者.description來獲取symbol物件的描述符。

let sym = Symbol('a')
console.log(sym.description); // 'a'

遍歷symbol

在使用for遍歷、object.keys中是獲取不到symbol健的，對此object還提供了getOwnPropertySymbols方法，用於獲取物件中所有symbol的key。

const sKeys=(Object.getOwnPropertySymbols(obj));
for(const skey of sKeys){
  console.log(obj[skey]);
}

全域性symbol物件註冊

有時，我們可能需要多個symbol的值是一致的，我們可以通過symbol提供的靜態方法for方法傳入一樣的描述符來使它們的值一致。

Symbol.for

該方法會在使用給定鍵搜尋執行時符號登入檔中的現有符號，並在找到時返回它。否則，使用此鍵在全域性符號登入檔中建立一個新符號。

const sa=Symbol.for('cc')
const sb=Symbol.for('cc')
console.log(sa===sb); //true

Symbol.keyFor

該方法用於獲取全域性symbol的描述符。

const key =Symbol.keyFor(sb)
console.log(key); // c

2、Set

Set物件（類似陣列）允許你存放任何資料型別，但裡面的值不能重複。

const s1 = new Set()
s1.add(10)
s1.add(20)
s1.add(30)
s1.add(40)

console.log(s1) // Set(4) { 10, 20, 30, 40 }

s1.add(20)
console.log(s1) // Set(4) { 10, 20, 30, 40 }

Set常用方法

3、WeakSet

WeakSet是類似Set的另外一種資料結構，內部資料也不能有重複值。

• 它與Set的區別
  • WeakSet只能存放物件型別，不能存放基本資料型別
  • WeakSet對元素是弱參照

基本使用

const weakSet = new WeakSet();
let obj = {
  name: "_island"
};

weakSet.add(obj);

WeakSet常用方法

關於遍歷

WeakSet不能被遍歷，因為它只是對物件進行弱參照，如果遍歷去獲取元素，有可能導致物件不能被GC回收。

所以WeakSet中的物件是不能獲取的

4、Map

ES6新增的資料結構，用於儲存對映關係。我們知道在JavaScript中物件中是不能用物件來作為key的。（假如我們把物件作為key，其內部會將物件轉換為字串[object object]）

const obj1 = { name: "_island" };
const obj2 = { name: "QC2125" };
const obj3={
  [obj1]:'a',
  [obj2]:'b',
}

console.log(obj3);
// { '[object Object]': 'b' }

而Map則可以把物件作為key進行儲存，可以通過set方法新增到Map中，也直接通過字面量的方式新增。

const obj1 = { name: "_island" };
const obj2 = { name: "QC2125" };
const map = new Map();
map.set(obj1, "a");
map.set(obj2, "b");
console.log(map); // Map(2) { { name: '_island' } => 'a', { name: 'QC2125' } => 'b' }

// or
const map2 = new Map([[obj1,'a'],[obj2,'b']])

Map常用方法

遍歷Map

通過foreach語句遍歷Map

map2.forEach((item) => console.log(item));

通過for..of遍歷Map

for ([val, key] of map2) {
  console.log(`${key}---${val}`);
}

5、WeakMap

和Map類似，也是以鍵值對的形式存在的

• 和Map的區別
  • WeakMap的key只能使用物件，不接受其他的型別作為key
  • WeakMap的key對物件是弱參照

基本使用

const weakMap = new WeakMap();
weakMap.set(obj, "a");
console.log(weakMap.get(obj)); // a

WeakMap常用方法

關於遍歷

和WeakSet一樣，正因為它是弱參照，WeakMap的key是不可列舉的，如果key可列舉那其列表將會受GC影響。

【相關推薦：、】

以上就是新增的es6資料結構有哪些的詳細內容，更多請關注TW511.COM其它相關文章！