Тщательно понять Map и Set в ES6

ECMAScript 6

Резюме:2 полезные структуры данных.

FundebugПерепечатано с разрешения, авторские права принадлежат оригинальному автору.

Map

MapОбъекты содержат пары ключ-значение. Любое значение (объект или примитив) может использоваться как ключ или значение. КонструкторMapМожет принимать массив в качестве параметра.

Разница между картой и объектом

  • MapКлючи в значении упорядочены (принцип FIFO), а ключи, добавляемые к объекту, — нет.
  • MapКоличество пар ключ-значение можно получить из атрибута size, аObjectКоличество пар ключ-значение можно рассчитать только вручную.
  • ObjectУ каждого есть собственный прототип, и имя ключа в цепочке прототипов может конфликтовать с именем ключа, которое вы установили для объекта.

Свойства объекта Карта

  • size: возвращает количество пар ключ-значение, содержащихся в объекте карты.

Методы объектов карты

  • set(key, val): добавить новый элемент на карту
  • get(key): найти конкретное значение по значению ключа и вернуть
  • has(key): определяет, есть ли значение, соответствующее ключу в объекте Map, возвращает true, если есть, иначе возвращает false
  • удалить (ключ): удалить соответствующие данные с карты по значению ключа
  • clear(): удалить все элементы на этой карте
const m1 = new Map([['a', 111], ['b', 222]])
console.log(m1) // {"a" => 111, "b" => 222}
m1.get('a')  // 111

const m2 = new Map([['c', 3]])
const m3 = new Map(m2)
m3.get('c') // 3
m3.has('c') // true
m3.set('d', 555)
m3.get('d') // 555

метод обхода

  • keys(): возвращает обходчик имен ключей
  • values(): итератор, который возвращает значение ключа
  • entries(): возвращает итератор пар ключ-значение.
  • forEach(): Используйте функцию обратного вызова переправа каждого участника
const map = new Map([['a', 1], ['b',  2]])

for (let key of map.keys()) {
  console.log(key)
}
// "a"
// "b"

for (let value of map.values()) {
  console.log(value)
}
// 1
// 2

for (let item of map.entries()) {
  console.log(item)
}
// ["a", 1]
// ["b", 2]

// 或者
for (let [key, value] of map.entries()) {
  console.log(key, value)
}
// "a" 1
// "b" 2

// for...of...遍历map等同于使用map.entries()

for (let [key, value] of map) {
  console.log(key, value)
}
// "a" 1
// "b" 2

Взаимопреобразование между картой и другими структурами данных

  • Mapобмен с объектами
const obj = {}
const map = new Map(['a', 111], ['b', 222])
for(let [key,value] of map) {
  obj[key] = value
}
console.log(obj) // {a:111, b: 222}
  • JSONстрока для преобразования вMapВы можете использовать JSON.parse() для преобразования его в массив или объект, а затем преобразовать его.

Set

SetОбъекты позволяют хранить значения любого типа, будь то примитивное значение или ссылка на объект. Он похож на массив, но все значения членов уникальны и нет повторяющихся значений.

Setсам по себе является конструктором, используемым для генерацииSetструктура данных.SetФункции могут принимать массив (или другую структуру данных с итерируемым интерфейсом) в качестве параметра для инициализации.

Специальные значения в Set

SetЗначение, хранимое объектом, всегда уникально, поэтому необходимо определить, идентичны ли два значения. Есть несколько особых значений, требующих особого обращения:

  • +0 и -0 идентичны при сохранении уникальности суждения, поэтому они не повторяются
  • undefined идентичен undefined, поэтому не повторяется
  • NaN и NaN не идентичны, но NaN и NaN считаются равными в Set, и без повторения может быть только одно из них.

Свойства объектов экземпляра Set

  • size: возвращает общее количество членов экземпляра Set.

Метод объекта экземпляра Set

  • add(value): добавляет значение, возвращает саму структуру Set (может быть объединена в цепочку).
  • delete(value): удалить значение, успешно удалить и вернутьсяtrue, иначе возвратfalse.
  • has(value): возвращает логическое значение, указывающее, является ли значение членом набора.
  • clear(): очистить все члены, без возвращаемого значения.
const mySet = new Set(['a', 'a', 'b', 1, 2, 1])
console.log(mySet)  // {'a', 'b', 1, 2}
myset.add('c').add({'a': 1})
console.log(mySet) // {'a', 'b', 1, 2, 'c', {a: 1}}
console.log(mySet.size) // 6

mySet.has(2) // true

метод обхода

  • keys(): возвращает итератор имен ключей.
  • values(): возвращает итератор ключевых значений.
  • entries(): возвращает итератор пар ключ-значение.
  • forEach(): Используйте функцию обратного вызова для перебора каждого члена.

из-заSetВ структуре нет имен ключей, только значения ключей (или имя ключа и значение ключа — это одно и то же значение), поэтому метод keys и метод values ​​ведут себя совершенно одинаково.

const set = new Set(['a', 'b', 'c'])

for (let item of set.keys()) {
  console.log(item)
}
// a
// b
// c

for (let item of set.values()) {
  console.log(item)
}
// a
// b
// c

for (let item of set.entries()) {
  console.log(item)
}
// ["a", "a"]
// ["b", "b"]
// ["c", "c"]

// 直接遍历set实例，等同于遍历set实例的values方法
for (let i of set) {
  console.log(i)
}
// a
// b
// c

set.forEach((value, key) => console.log(key + ' : ' + value))

// a: a
// b: b
// c: c

Установить роль объекта

  • Дедупликация массива (с использованием оператора распространения)
const mySet = new Set([1, 2, 3, 4, 4])
[...mySet] // [1, 2, 3, 4]
  • Объединить два набора объектов
let a = new Set([1, 2, 3])
let b = new Set([4, 3, 2])
let union = new Set([...a, ...b]) // {1, 2, 3, 4}
  • перекресток
let a = new Set([1, 2, 3])
let b = new Set([4, 3, 2])
let intersect = new Set([...a].filter(x => b.has(x)))  // {2, 3} 利用数组的filter方法
  • разница
let a = new Set([1, 2, 3])
let b = new Set([4, 3, 2])
let difference = new Set([...a].filter(x => !b.has(x))) //  {1}
Категории