iT邦幫忙

0

JavaScript 的Symbol

  • 分享至 

  • xImage
  •  

在 JavaScript 中,Symbol 是一種原始數據類型,適合用於創建唯一的標識符。它主要用於避免命名衝突、保護對象的屬性,以及實現元編程。

適用情況

  1. 創建唯一的屬性鍵:
  • 在對象中需要使用不會和其他屬性衝突的鍵時,Symbol 是理想的選擇。
  • 即使屬性名稱相同,每次創建的 Symbol 都是唯一的。
  1. 隱藏屬性:
  • Symbol 鍵屬性是非可枚舉的,不能被 for...in 或 Object.keys() 等列舉出來,適合用於為對象添加“隱藏”屬性。
  1. 元編程:
  • JavaScript 提供了一些內建的 Symbol,例如 Symbol.iterator、Symbol.toStringTag,這些可以用於自定義對象的行為。

範例 1:創建唯一鍵屬性

避免對象屬性名稱的命名衝突。

const uniqueKey1 = Symbol("key");
const uniqueKey2 = Symbol("key");

const obj = {
  [uniqueKey1]: "Value for uniqueKey1",
  [uniqueKey2]: "Value for uniqueKey2",
};

console.log(obj[uniqueKey1]); // Value for uniqueKey1
console.log(obj[uniqueKey2]); // Value for uniqueKey2

// 無法使用常規方法獲取 Symbol 鍵
console.log(Object.keys(obj)); // []
console.log(Object.getOwnPropertyNames(obj)); // []
console.log(Object.getOwnPropertySymbols(obj)); // [ Symbol(key), Symbol(key) ]

範例 2:實現隱藏屬性

使用 Symbol 添加對象屬性,但不讓它暴露在普通的屬性枚舉中。

const secret = Symbol("secret");

const user = {
  name: "Alice",
  age: 25,
  [secret]: "This is a hidden property",
};

console.log(user[secret]); // This is a hidden property

// 不會被普通的方法列舉出來
for (const key in user) {
  console.log(key); // 只會輸出 name 和 age
}

範例 3:用 Symbol 實現元編程

自定義對象的行為,如可迭代性或類型標籤。

自定義迭代器
使用 Symbol.iterator 讓對象可迭代。

const iterableObject = {
  data: [1, 2, 3],
  [Symbol.iterator]() {
    let index = 0;
    return {
      next: () => {
        if (index < this.data.length) {
          return { value: this.data[index++], done: false };
        } else {
          return { done: true };
        }
      },
    };
  },
};

for (const value of iterableObject) {
  console.log(value); // 1, 2, 3
}

自定義 toStringTag
使用 Symbol.toStringTag 修改 Object.prototype.toString 的結果。

class CustomClass {
  get [Symbol.toStringTag]() {
    return "CustomClass";
  }
}

const instance = new CustomClass();
console.log(Object.prototype.toString.call(instance)); // [object CustomClass]

小結

Symbol 適合用於:

  • 創建唯一的對象屬性,避免命名衝突。
  • 隱藏對象屬性,提高對象的安全性。
  • 自定義行為,利用內建的 Symbol 實現元編程功能。
  • 雖然 Symbol 是強大的工具,但它的使用情景通常是高級或框架級別的需求,對於普通應用,謹慎使用即可。

圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言