Computer >> Hướng Dẫn Máy Tính >  >> Lập Trình >> JavaScript

Thêm phần tử vào Dictionary (Map/Object) trong JavaScript

Thêm cặp key-value vào Dictionary trong JavaScript: Object (cũ) hoặc Map (ES6 - khuyên dùng).

1. Thêm vào Object (Cơ bản)

const obj = {};

// Cách 1: Dot notation (key hợp lệ identifier)
obj.key1 = "value1";

// Cách 2: Bracket notation (key bất kỳ, biến, ký tự đặc biệt)
obj["key-2"] = "value2";
obj[myVariable] = "value3";

// Cách 3: Object.assign / Spread (Merge nhiều)
Object.assign(obj, { key3: "value3", key4: "value4" });
// Hoặc ES6+
const newObj = { ...obj, key5: "value5" }; // Tạo object mới

2. Thêm vào ES6 Map (Khuyên dùng cho Dictionary động)

Dùng phương thức .set(key, value).

const myMap = new Map();

// Thêm
myMap.set("key1", "value1");
myMap.set("key2", "value2");

// Key có thể là OBJECT, FUNCTION, PRIMITIVE...
const objKey = { id: 1 };
myMap.set(objKey, "Object as key");
myMap.set(function() {}, "Function as key");

// Chaining (trả về map instance)
myMap.set("k3", "v3").set("k4", "v4");

3. Custom Dictionary Class (MyMap) - Triển khai put()

class MyMap {
    constructor() {
        this.container = {};
    }
    
    put(key, value) {
        // Object tự động convert key thành string
        this.container[key] = value;
    }
    
    hasKey(key) {
        return key in this.container;
    }
    
    display() {
        console.log(this.container);
    }
}

const myMap = new MyMap();
myMap.put("key1", "value1");
myMap.put("key2", "value2");
myMap.display(); // { key1: 'value1', key2: 'value2' }

console.log(myMap.hasKey("key1")); // true
console.log(myMap.hasKey("key3")); // false

So sánh Object vs Map khi Thêm

Đặc điểmObjectMap (ES6)
Cú phápobj.key = val / obj[key] = valmap.set(key, val)
Key typeChỉ String / SymbolBất kỳ kiểu (Object, Function, NaN, Date...)
Trùng keyGhi đè thầm lặngGhi đè thầm lặng (trả về map để chain)
Hiệu năng thêm nhiềuChậm hơn (hidden class change)Nhanh hơn, ổn định
Kích thướcKhông có .sizemap.size tự động cập nhật

ES6 Map - Khởi tạo từ Array/Iterable

// Từ array cặp [key, value]
const map1 = new Map([
    ["key1", "value1"],
    ["key2", "value2"]
]);

// Từ object (chỉ string key)
const obj = { a: 1, b: 2 };
const map2 = new Map(Object.entries(obj));

// Từ iterable khác
const map3 = new Map(myGenerator());

Best Practice

  • Dùng Map cho: Dictionary động, key không phải string, thêm/xóa thường xuyên, cần size, iterable, tránh prototype pollution.
  • Dùng Object cho: Record tĩnh (schema cố định), config, DTO, cần JSON.stringify, key string đơn giản.
  • Luôn kiểm tra key tồn tại nếu logic phụ thuộc: if (!map.has(key)) map.set(key, val) hoặc dùng map.set(key, val) ghi đè (idempotent).

Tóm lại: Thêm vào Dictionary: Object obj[key] = value, Map map.set(key, value). Map mạnh hơn: key bất kỳ, size, iterable, perf thêm/xóa tốt hơn, an toàn prototype. Khuyên dùng Map cho Dictionary chung.