JavaScript Symbol: Định Danh Độc Đáo cho Các Đối Tượng

JavaScript ES6 giới thiệu một kiểu dữ liệu nguyên thủy mới gọi là Symbol. Các Symbol là không thay đổi (không thể thay đổi) và là duy nhất. Ví dụ,

// two symbols with the same description

const value1 = Symbol('hello');
const value2 = Symbol('hello');

console.log(value1 === value2); // false

Mặc dù value1 và value2 đều chứa cùng mô tả, chúng khác nhau.

Tạo Symbol

Bạn sử dụng hàm Symbol() để tạo một Symbol. Ví dụ,

// creating symbol
const x = Symbol()

typeof x; // symbol

Bạn có thể truyền một chuỗi tùy chọn làm mô tả. Ví dụ,

const x = Symbol('hey');
console.log(x); // Symbol(hey)

Truy Cập Mô Tả của Symbol

Để truy cập mô tả của một symbol, chúng ta sử dụng toán tử .. Ví dụ,

const x = Symbol('hey');
console.log(x.description); // hey

Thêm Symbol như một Khóa của Đối Tượng

Bạn có thể thêm các symbol như một khóa trong một đối tượng bằng cách sử dụng dấu ngoặc vuông []. Ví dụ,

let id = Symbol("id");

let person = {
    name: "Jack",

    // adding symbol as a key
    [id]: 123 // not "id": 123
};

console.log(person); // {name: "Jack", Symbol(id): 123}

Symbol không bao gồm trong vòng lặp for…in

Vòng lặp for...in không duyệt qua các thuộc tính Symbolic. Ví dụ,

let id = Symbol("id");

let person = {
    name: "Jack",
    age: 25,
    [id]: 12
};

// using for...in
for (let key in person) {
    console.log(key);
}

Kết quả

name
age

Lợi ích của Việc Sử Dụng Symbols trong Đối Tượng

Nếu đoạn mã giống nhau được sử dụng trong các chương trình khác nhau, thì tốt hơn hết là sử dụng Symbols trong khóa đối tượng. Điều này bởi vì bạn có thể sử dụng cùng tên khóa trong các mã khác nhau và tránh vấn đề trùng lặp. Ví dụ,

let person = {
    name: "Jack"
};

// creating Symbol
let id = Symbol("id");

// adding symbol as a key
person[id] = 12;

Trong chương trình trên, nếu đối tượng person cũng được sử dụng bởi một chương trình khác, thì bạn không muốn thêm một thuộc tính có thể được truy cập hoặc thay đổi bởi chương trình khác. Do đó, bằng cách sử dụng Symbol, bạn tạo ra một thuộc tính duy nhất mà bạn có thể sử dụng.

Bây giờ, nếu chương trình khác cũng cần sử dụng một thuộc tính có tên id, chỉ cần thêm một Biểu tượng có tên là id và sẽ không có vấn đề về trùng lặp. Ví dụ,

let person = {
    name: "Jack"
};

let id = Symbol("id");

person[id] = "Another value";

Trong chương trình ở trên, ngay cả khi cùng tên được sử dụng để lưu trữ giá trị, kiểu dữ liệu Biểu tượng sẽ có một giá trị duy nhất.

Trong chương trình ở trên, nếu sử dụng khóa chuỗi, chương trình sau này sẽ thay đổi giá trị của thuộc tính. Ví dụ,

let person = {
    name: "Jack"
};

// using string as key
person.id = 12;
console.log(person.id); // 12

// Another program overwrites value
person.id = 'Another value';
console.log(person.id); // Another value

Trong chương trình ở trên, user.id thứ hai ghi đè lên giá trị trước đó.

Phương thức Biểu tượng

Có nhiều phương thức khả dụng với Biểu tượng.

Ví dụ: Các Phương thức Biểu tượng

// get symbol by name
let sym = Symbol.for('hello');
let sym1 = Symbol.for('id');

// get name by symbol
console.log( Symbol.keyFor(sym) ); // hello
console.log( Symbol.keyFor(sym1) ); // id

Thuộc tính Biểu tượng

Ví dụ: Ví dụ về Các Thuộc tính Biểu tượng

const x = Symbol('hey');

// description property
console.log(x.description); // hey

const stringArray = ['a', 'b', 'c'];
const numberArray = [1, 2, 3];

// isConcatSpreadable property
numberArray[Symbol.isConcatSpreadable] = false;

let result = stringArray.concat(numberArray);
console.log(result); // ["a", "b", "c", [1, 2, 3]]

• Bài đăng trên blog này ban đầu được đăng tải tại:https://www.programiz.com/