title: es6基礎(chǔ)知識6（set和map）
date: 2019-06-30 14:52:26
tags:

• set
• map
  categories:
• 前端

1. set

set叫做集合，是一種新的數(shù)據(jù)類型，這種數(shù)據(jù)類型跟數(shù)組很類似，但是它的值是無序的，并且set沒有重復(fù)值。

set可以通過Set()這個構(gòu)造函數(shù)來創(chuàng)建

let s = new Set([1, 2, 3, 4])
console.log(s)

set

可以看出，set中的鍵和值是相同的。

由于set內(nèi)沒有重復(fù)值，利用這個特點可以方便的實現(xiàn)數(shù)組的去重：

let arr = [1, 1, 2, 2, 3, 3]
let s = new Set(arr)
let newArr = [...s] //這里利用了解構(gòu)賦值
console.log(newArr) //(3) [1, 2, 3]

set還有很多的屬性和方法，都比較簡單，具體可以參考Set

2. Map

Map，映射，這種數(shù)據(jù)類型保存的是鍵值對，和對象Object很相似，不同的在于Object的鍵必需是字符串類型，而Map的鍵沒有要求數(shù)據(jù)類型。此外，map具有可迭代屬性，因此Map可以直接用于for...of語句，而普通定義的對象需要考慮其是否具有迭代函數(shù)iterator。

map的一個重要作用也是應(yīng)用在對象屬性的私有化上面，舉一個例子：

const Student = (function(){
      let _score = 0;//自執(zhí)行函數(shù)的內(nèi)部變量實現(xiàn)對象的私有屬性
      function S(name, score) {
        this.name = name;
        _socre = score;
      }
      return S;
    })();
    let s1 = new Student('john', 100);
    let s2 = new Student('marry', 90);
    console.log(s1);
    console.log(s2);

在上面這里例子中，創(chuàng)建了一個student對象，student對象有兩個屬性name和score。我們希望name屬性是公開的，可以任意訪問和修改，但是我們不希望score也能夠被隨意訪問和修改，要不然有可能每一個學生的成績都是100分了，如果有一些的學生成績?nèi)绻?000分或者-100,那就更糟糕了，所以我們希望score是對象的一個私有屬性，這里的做法是通過自執(zhí)行函數(shù)來創(chuàng)建對象，其中對象的私有屬性通過函數(shù)的內(nèi)部變量來實現(xiàn)。打印實例化后的兩個對象s1和s2:

對象屬性私有化

上面這個例子可以實現(xiàn)對象屬性的私有化，但是這個例子有一些問題，具體原因在于對象s1和s2都共用了score這個私有化屬性，為了說明問題，修改一下上面的例子：

const Student = (function(){
  let _score = 0;//自執(zhí)行函數(shù)的內(nèi)部變量實現(xiàn)對象的私有屬性
  function S(name, score) {
    this.name = name;
    _socre = score;
  }

  S.prototype.getScore = function () {
    return _score;
  }

  S.prototype.setScore = function (num) {
      _score = num;
  }

  return S;
})();
let s1 = new Student('john', 100);
let s2 = new Student('marry', 90);

s1.setScore(98);
s2.setScore(80);

console.log(s1.getScore())
console.log(s2.getScore())

Z02pex.png

我們在S的原型上加上getScore方法和setScore方法，分別用來設(shè)置score和訪問score，但是在給s1設(shè)置98分，給s2設(shè)置80分后，發(fā)現(xiàn)最終s1和s2的分數(shù)都是80分，產(chǎn)生這個錯誤的原因在于s1和s2共用了自執(zhí)行函數(shù)里的_score變量。要解決這種問題就需要改寫自執(zhí)行函數(shù)的_score變量，最好是一種對象與成績一一對應(yīng)的數(shù)據(jù)結(jié)構(gòu)，這個時候map的作用就體現(xiàn)了，因為，在map中，對象可以作為鍵，因此可以實現(xiàn)對象與鍵值的一一對應(yīng)。改寫上面的這個例子：

const Student = (function(){
  let _score =  new Map()
  function S(name, score) {
    this.name = name;
    _score.set(this. score);
  }

  S.prototype.getScore = function () {
    return _score.get(this)
  }

  S.prototype.setScore = function (num) {
    _score.set(this, num)
  }

  return S;
})();

let s1 = new Student('john', 100);
let s2 = new Student('marry', 90);

s1.setScore(98);
s2.setScore(80);

console.log(s1.getScore())
console.log(s2.getScore())

Z02LHP.png

這樣改寫以后就能夠正常訪問到s1和s2對象的私有需要保護的屬性。