Встроенные структуры данных JavaScript получили серьезное обновление с введением Map и Set в ECMAScript 2015. В этой статье мы рассмотрим основы использования этих мощных структур данных, включая их преимущества и практическое применение.
Введение :
Если вы ежедневно используете JavaScript, вам необходимо иметь четкое представление о типах данных языка и нативных методах, введенных для представления этих типов данных в различных структурах данных, каждый из которых имеет свои собственные варианты использования и удобное место для посадки.
Сегодня мы выделим Map и Set, две менее известные структуры данных, которые могут быть чрезвычайно полезны в определенных ситуациях, мы рассмотрим, что такое Sets и Maps, и чем они отличаются из других структур данных и некоторых распространенных случаев использования, где они могут быть особенно полезны, поэтому давайте начнем с Map .
Карта :
Карты – это структура данных, позволяющая хранить пары "ключ-значение", где ключи и значения могут относиться к любому типу данных, включая объекты. Это отличается от обычных объектов, которые позволяют использовать в качестве ключей только строки или символы.
Сначала давайте начнем с создания новой карты:
const myMap = new Map(); // creates a new instance of the Map constructor function
Карта предоставляет множество методов и свойств для взаимодействия, давайте узнаем, как мы можем добавлять и извлекать данные из карты:
let map = new Map(); // create a new Map
map.set('1', 'string1'); // add '1' as a string key and 'str1' as a string value
map.set(1, 'num1'); // add 1 as numeric key
map.set(true, 'boolean1'); // a boolean key
// remember the regular Object? it would convert keys to string
// Map keeps the type, so these two are different:
alert( map.get(1) ); // 'num1'
alert( map.get('1') ); // 'str1'
alert( map.size ); // 3
Мы также можем использовать объекты в качестве ключа в Map:
let person = { name: "Nadjem eddine" };
// for every user, let's store his friends
let friendsCount = new Map();
// person is the key for the map
friendsCount.set(person, 123);
console.log( friendsCount.get(john) ); // 123
Это очень удобно, особенно при работе со сложными структурами данных, для которых требуются нестроковые ключи.
Итерация по Map очень проста, и у нас есть 3 метода для этого:
1- map.keys() возвращает новый объект итератора, содержащий ключи.
2- map.values()возвращает новый объект итератора, содержащий values.
3- map.entries() возвращает новый итератор для записей [key, value]
Кроме того, Map имеет встроенный метод forEach, похожий на Array:
let personsMap = new Map([
['nadjem', 28],
['ahmed', 19],
['mohammed', 30]
]);
// 1 - iterate over keys (presons)
for (let person of personsMap.keys()) {
console.log(vegetable); // nadjem, ahmed, mohammed
}
// 2 - iterate over values (ages)
for (let age of personsMap.values()) {
console.log(age); // 28, 19, 30
}
// 3 - iterate over [key, value] entries
for (let entry of personsMap) { // the same as of personsMap.entries()
console.log(entry); // nadjem,28 (and so on)
}
// 4 - built in for each method returns (key, value) pair
personsMap.forEach( (value, key, map) => {
console.log(`${key} is age: ${value}`); // nadjem is age: 28 ...
});
До сих пор мы исследовали ключевые методы и свойства Map, а теперь обратим внимание на другую важную встроенную структуру данных Set.
Набор :
Set — это встроенный объект, который позволяет нам хранить уникальные значения любого типа, будь то примитивные значения или ссылки на объекты.
Set можно создать с помощью ключевого слова new и конструктора Set(). Мы также можем инициализировать Set итерируемым объектом (например, массивом), передав итерируемый объект в качестве аргумента конструктору Set().
Вот пример создания и использования Set:
// Create a new Set
const mySet = new Set();
// Add elements to the Set
mySet.add(1);
mySet.add('two');
mySet.add({ name: 'Nadjem', age: 28});
// Check the size of the Set
console.log(mySet.size); // Output: 3
// Check if an element exists in the Set
console.log(mySet.has(1)); // Output: true
console.log(mySet.has('two')); // Output: true
console.log(mySet.has({ name: 'Nadjem', age: 28 })); // Output: false (this is a different object reference)
// Remove an element from the Set
mySet.delete('two');
// Iterate over the elements in the Set
for (const element of mySet) {
console.log(element);
}
// Output: 1
// { name: 'John', age: 30 }
Основная особенность Set заключается в том, что повторные вызовы set.add(value) с одним и тем же значением ничего не делают, поэтому каждое значение появляется только один раз.
Мы можем перебрать Set, используя for..of или forEach:
let set = new Set(["oranges", "apples", "bananas"]);
for (let value of set) alert(value);
// the same with forEach:
set.forEach((value, valueAgain, set) => {
alert(value);
});
Заключение :
Таким образом, Map и Set — две полезные структуры данных в JavaScript. Карты используются для сопоставления ключей со значениями, а наборы используются для хранения уникальных значений. Карты позволяют использовать любой тип данных в качестве ключа, а наборы позволяют использовать только один экземпляр каждого значения. Оба предоставляют встроенные методы для добавления, обновления и удаления элементов, а также для проверки существования элемента. Понимание их различий и вариантов использования может повысить эффективность и читабельность вашего кода.
