当前位置:首页 > JavaScript

js实现symbol

2026-04-05 22:36:26JavaScript

Symbol 基本概念

Symbol 是 JavaScript 中的一种原始数据类型,表示唯一且不可变的值,通常用作对象属性的键。每个 Symbol 值都是唯一的,即使它们具有相同的描述。

创建 Symbol

通过 Symbol() 函数创建 Symbol,可以传入一个可选的描述字符串:

const sym1 = Symbol();
const sym2 = Symbol('description');

Symbol 的特性

Symbol 值是唯一的,即使描述相同:

Symbol('foo') === Symbol('foo'); // false

全局 Symbol 注册表

使用 Symbol.for() 可以在全局注册表中创建或获取 Symbol。相同的 key 会返回相同的 Symbol:

const globalSym = Symbol.for('global');
Symbol.for('global') === globalSym; // true

常用 Symbol 方法

  • Symbol.keyFor(sym):返回全局 Symbol 的 key
    const globalSym = Symbol.for('global');
    Symbol.keyFor(globalSym); // 'global'

Symbol 作为对象属性

Symbol 可以作为对象的唯一键,避免属性名冲突:

const obj = {};
const sym = Symbol('key');
obj[sym] = 'value';
console.log(obj[sym]); // 'value'

内置 Symbol

JavaScript 提供了一些内置 Symbol,用于自定义对象行为:

  • Symbol.iterator:定义对象的默认迭代器
  • Symbol.toStringTag:自定义对象的 toString 行为
    const obj = {
    };
    console.log(obj.toString()); // [object MyObject]

Symbol 的注意事项

  • Symbol 不能使用 new 操作符
  • Symbol 不会被 for...inObject.keys() 枚举
  • 可以通过 Object.getOwnPropertySymbols() 获取对象的 Symbol 属性

实际应用示例

实现一个简单的迭代器:

js实现symbol

const iterableObj = {
  [Symbol.iterator]: function* () {
    yield 1;
    yield 2;
    yield 3;
  }
};
for (const item of iterableObj) {
  console.log(item); // 1, 2, 3
}

标签: jssymbol
分享给朋友:

相关文章

js实现继承

js实现继承

原型链继承 通过将子类的原型指向父类的实例实现继承。子类实例可以访问父类原型上的属性和方法。 function Parent() { this.name = 'parent'; } Parent…

js实现日历

js实现日历

实现日历的基本思路 使用JavaScript实现日历的核心是动态生成日期表格,并处理月份切换逻辑。需要计算当前月的天数、起始星期几,并动态渲染到页面上。 获取当前日期信息 通过Date对象获取当前年…

js实现列表

js实现列表

使用 JavaScript 实现列表 JavaScript 提供了多种方式来实现列表功能,包括数组操作、DOM 元素动态生成等。以下是几种常见的实现方法: 使用数组存储列表数据 数组是 JavaSc…

js实现二叉树

js实现二叉树

二叉树的基本概念 二叉树是一种树形数据结构,每个节点最多有两个子节点,分别称为左子节点和右子节点。二叉树的常见操作包括插入、删除、遍历等。 二叉树的节点定义 在JavaScript中,二叉树的节点可…

js钟表实现

js钟表实现

实现JavaScript钟表的基本方法 创建一个简单的JavaScript钟表可以通过以下步骤完成,涵盖数字和模拟两种形式。 数字钟表实现 HTML结构只需一个显示时间的容器: <div i…

js实现代码雨

js实现代码雨

实现代码雨效果 使用HTML5 Canvas和JavaScript可以轻松实现经典的代码雨效果。以下是完整的实现代码和说明: HTML结构 <!DOCTYPE html> <…