tg-me.com/easy_javascript_ru/1159
Create:
Last Update:
Last Update:
Хотя объекты {} исторически использовались как ассоциативные массивы (ключ-значение), у Map есть ряд преимуществ, которые делают его более удобным в большинстве случаев.
В объектах {} ключи всегда автоматически приводятся к строке.
const obj = {};
const key1 = {};
const key2 = {};
obj[key1] = "value1";
obj[key2] = "value2";
console.log(obj); // { '[object Object]': 'value2' }
console.log(obj[key1]); // "value2" (ключи перезаписались, потому что оба стали "[object Object]")Пример с
Map: const map = new Map();
map.set(key1, "value1");
map.set(key2, "value2");
console.log(map.get(key1)); // "value1"
console.log(map.get(key2)); // "value2"
В объекте
{} порядок ключей не гарантируется (особенно для числовых ключей). const obj = { 2: "two", 1: "one", 3: "three" };
console.log(Object.keys(obj)); // ["1", "2", "3"] (порядок числовых ключей изменился!)Пример с
Map const map = new Map();
map.set(2, "two");
map.set(1, "one");
map.set(3, "three");
console.log([...map.keys()]); // [2, 1, 3] (порядок сохраняется!)
Объекты
{} оптимизированы для хранения структуры данных, но операции delete и Object.keys(obj).length могут быть медленными, потому что движок JavaScript выполняет дополнительные проверки.Разница в скорости
В
Map операции .set(), .get(), .delete() выполняются быстрее.В объекте
{} delete obj[key] может работать медленнее, так как JavaScript оптимизирует объекты для других целей.Объект
{} не имеет встроенных методов для работы с ключами и значениями. Чтобы, например, узнать размер объекта, приходится использовать Object.keys(obj).length.const map = new Map();
map.set("a", 1);
map.set("b", 2);
console.log(map.size); // 2
console.log(map.has("a")); // true
console.log(map.delete("b")); // true (удалит "b")
В объекте
{}const obj = { a: 1, b: 2 };
console.log(Object.keys(obj).length); // 2 (нужно вызывать Object.keys())
console.log(obj.hasOwnProperty("a")); // true (менее удобный синтаксис)
delete obj.b; // Удаление ключаВ объекте
{} могут быть неожиданные проблемы, если ключ совпадает с именем встроенного метода.const obj = {};
console.log(obj.toString); // [Function: toString] (унаследованное свойство!)
console.log(obj["toString"]); // [Function: toString] (может вызвать баги)Чтобы обойти это, приходится делать так
const obj = Object.create(null); // Теперь у объекта нет прототипа
obj.toString = "custom";
console.log(obj.toString); // "custom"
В
Map таких проблем нетconst map = new Map();
map.set("toString", "custom");
console.log(map.get("toString")); // "custom" (никаких багов!)
Ставь 👍 и забирай 📚 Базу знаний