鍍金池/ 問答/HTML/ JavaScript 的集合(Set)除了遍歷有別的方式訪問嗎?

JavaScript 的集合(Set)除了遍歷有別的方式訪問嗎?

看了文檔,發(fā)現(xiàn) JavaScript Set 有 Add 卻沒有 Get,用起來似乎沒有 Map 好用,這個(gè) Set 有哪些好用的場景呢?我本來是希望用 Set 來創(chuàng)建類似 Enum 的功能的,不過看上去是沒有希望了...

回答
編輯回答
巫婆

Set是用來存唯一值的,重點(diǎn)在于唯一,所以有.has方法(文檔)。至于.get,仔細(xì)想一下,就會發(fā)現(xiàn)Set不存在這種語義,因?yàn)镾et并不是一個(gè)鍵值對應(yīng)的結(jié)構(gòu)。

最典型的場景就是事件監(jiān)聽器了:

  • 丟棄重復(fù)注冊的監(jiān)聽器: Set數(shù)據(jù)唯一
  • 監(jiān)聽器按順序調(diào)用: Set按插入順序遍歷
  • 調(diào)用所有監(jiān)聽器: Set遍歷跟數(shù)組差不多快
  • 經(jīng)常添加/刪除: Set添加/刪除都很快

所以Set對應(yīng)的是數(shù)組,而不是對象。


如果想要模擬Enum的話,我一開始其實(shí)沒搞懂為什么要用Set……然后意識到,可能是想控制枚舉值唯一。那么應(yīng)該用Symbol:

const Color = {
  red:   Symbol('red'),   // 文本是可選的,方便debug
  green: Symbol('green'),
  blue:  Symbol('blue'),
}
Color.red === Color.blue    // false
Color.red === Symbol('red') // false

但是IDE并不認(rèn)識這種模擬的Enum,所以我更喜歡用TypeScript的enum,:

// enum.ts
const enum Color {
  red,
  green,
  blue,
}
export default Color

// app.js
import Color from './enum.js';
const red = Color.red;      // -> const red = 0 /* red */;

不過這也有學(xué)習(xí)成本,用不用就見仁見智了。

2018年1月23日 01:10