当前位置：首页 > news >正文

2025第2周 | JavaScript中的Symbol

news 来源：原创 2025/5/14 12:22:41

2025一个转身就已到来，对于时间太快，总会有种惶恐感。每每回首过去，总会发现想要做的事情没有完成，学习的内容少之又少，读的有用的书籍更是可以忽略不计。对于内在的超越，内在的修行也是没有始终践行，知行合一，实践、认识、再实践、再认识…

2025年第2周：2025.01.06 ~ 2025.01.12 ，8号星期三

目标：了解 JavaScript中的Symbol，掌握以下几点：

Symbol是个什么东东？
为什么需要Symbol？
怎么使用Symbol？

1. Symbol是个什么东东？

Symbol是什么呢？Symbol是ES6中新增的一个基本数据类型。

每个从 Symbol() 返回的 symbol 值都是唯一的。
一个 symbol 值能作为对象属性的标识符，这是该数据类型仅有的目的。
该类型具有静态属性和静态方法。
不支持语法：“new Symbol()”

1.1 语法

Symbol([description])
description：可选的，字符串类型。对 symbol 的描述，可用于调试但不是访问 symbol 本身。

直接使用Symbol()创建新的 symbol 类型，并用一个可选的字符串作为其描述。

const s1 = Symbol();
const s2 = Symbol();
const s3 = Symbol("qtz");
console.log(s1 === s2); // false

2. 为什么需要Symbol?

在ES6之前，对象的属性名key都是字符串形式（无论你加不加引号），那么很容易造成属性名的冲突。比如原来有一个对象person，我们希望在其中添加一个新的属性和值，但是我们在不确定它原来内部有什么内容的情况下很容易造成冲突，从而覆盖掉它内部的某个属性。

var person = {name: '小明',age: 18,"sex": "男"
}
console.log(Object.keys(person))    // ["name", "age", "sex"]// 在不知person内部有什么属性的时候，很容易造成冲突，从而覆盖掉它内部的某个属性。
person.name = "李四"

Symbol就是为了解决上面的问题，用来生成一个独一无二的值。在ES6中，对象的属性名可以使用字符串，也可以使用Symbol值。

3. 怎么使用Symbol?

Symbol 类型主要用于对象属性key中。

3.1 定义对象字面量

底下案例，定义了对象obj，且对象有两个key的类型为Symbol的属性。
需要注意的是：获取其值的时候，不能通过点语法obj.s1获取（因为这样会把s1当成为字符串去获取），而需要通过 obj[s1] 来获取。

const s1 = Symbol();
const s2 = Symbol();const obj = {[s1]: 'foo',[s2]: 'bar'
}
console.log(obj[s1])

3.2 新增对象属性

下面案例中，已存在了obj对象，然后给obj对象新增一个Symbol属性

const s1 = Symbol();
const obj = {}
obj[s1] = "qtz";

3.3 使用 Object.defineProperty方式

和字符串属性一样，我们可以使用 Object.defineProperty的方式来定义某个对象的Symbol类型属性。

const s1 = Symbol();
const obj = {}
Object.defineProperty(obj, s1, {value: 'qtz',writable: true,enumerable: true,configurable: true
})
// 获取
console.log(obj[s1])	// qtz

3.4 遍历

使用Symbol作为对象key的属性名，使用 0bject.keys、Object.getOwnPropertyNames 中是获取不到这些symbol值的，需要使用 Object.getOwnPropertySymbols 获取所有 Symbol 类型的键名 key。

const s1 = Symbol();
const obj = {}
Object.defineProperty(obj, s1, {value: 'qtz',writable: true,enumerable: true,configurable: true
})
console.log(Object.keys(obj))   // []
console.log(Object.getOwnPropertyNames(obj))    // []
console.log(Object.getOwnPropertySymbols(obj))  // [ Symbol() ] 获取所有 Symbol 类型的键名 
const sKeys = Object.getOwnPropertySymbols(obj) 
for (let sKey of sKeys) {console.log(obj[sKey])    // qtz
}

4. 静态方法

4.1 Symbol.for(key)

Symbol.for(key) 方法会根据给定的键 key，来从运行时的 symbol 注册表中找到对应的 symbol，如果找到了，则返回它，否则，新建一个与该键关联的 symbol，并放入全局 symbol 注册表中。

和 Symbol() 不同的是，用 Symbol.for() 方法创建的 symbol 会被放入一个全局 symbol 注册表中。Symbol.for() 并不是每次都会创建一个新的 symbol，它会首先检查给定的 key 是否已经在注册表中了。假如是，则会直接返回上次存储的那个。否则，它会再新建一个。

4.2 Symbol.keyFor(symbol)

如果全局注册表中查找到该 symbol，则返回该 symbol 的 key 值，返回值为字符串类型。否则返回 undefined.

const s1 = Symbol.for("qtz");
const s2 = Symbol.for("qtz");
console.log(s1 === s2); // trueconst key = Symbol.keyFor(s1);
console.log(key);   // qtz
const s3 = Symbol.for(key);
console.log(s1 === s3); // true

END !

目录