ECMAScript 2017 之 Symbol.for 请求 token，你造吗？-JavaScript中文网-JavaScript教程资源分享门户

在 ECMAScript 2017 中，引入了一个新的全局方法 Symbol.for()，它可以用于创建可重用的全局 Symbol 对象，这是一个非常有用的特性，特别是在前端开发中，我们经常需要共享一些全局的标识符，比如事件名称、命名空间等等，Symbol.for() 可以帮助我们轻松地实现这些功能。

什么是 Symbol？

在介绍 Symbol.for() 之前，我们先来回顾一下 Symbol 的概念。Symbol 是一种新的原始数据类型，在 ES6 中引入，它可以用来创建唯一的标识符，这些标识符可以用于对象属性名、方法名等等。

// javascriptcn.com 代码示例
// 创建一个 Symbol
const mySymbol = Symbol();
console.log(mySymbol); // Symbol()

// 使用 Symbol 作为对象属性名
const obj = {
  [mySymbol]: 'Hello World'
};
console.log(obj[mySymbol]); // 'Hello World'

Symbol 的一个重要特点就是它们是唯一的，即使我们创建了两个相同参数的 Symbol，它们也不相等。

const a = Symbol('foo');
const b = Symbol('foo');
console.log(a === b); // false

Symbol.for() 的使用

Symbol.for() 方法可以用于创建可重用的全局 Symbol 对象，它接受一个字符串作为参数，如果该字符串已经存在对应的 Symbol 对象，则返回该对象，否则创建一个新的 Symbol 对象。

// 创建一个全局 Symbol
const myGlobalSymbol = Symbol.for('myGlobalSymbol');
console.log(myGlobalSymbol); // Symbol(myGlobalSymbol)

// 重复调用 Symbol.for()，返回同一个 Symbol 对象
const myGlobalSymbol2 = Symbol.for('myGlobalSymbol');
console.log(myGlobalSymbol2 === myGlobalSymbol); // true

Symbol.for() 方法创建的 Symbol 对象是全局可见的，它们可以被任意代码访问，因此在使用时需要注意命名冲突的问题。

Symbol.for() 的应用

Symbol.for() 方法的一个常见应用场景是创建全局的命名空间，例如在处理事件时，我们可以为每个事件类型创建一个唯一的 Symbol 对象，用于作为事件名称，这样可以避免事件名称冲突的问题。

// javascriptcn.com 代码示例
const myNamespace = Symbol.for('myNamespace');

// 注册事件
document.addEventListener(myNamespace, function(event) {
  console.log('Event received:', event.detail);
});

// 触发事件
const myEvent = new CustomEvent(myNamespace, { detail: 'Hello World' });
document.dispatchEvent(myEvent);

Symbol.for() 方法还可以用于创建请求 token，例如在异步操作中，我们可以为每个请求生成一个唯一的 Symbol 对象，用于标识该请求的状态和结果。

// javascriptcn.com 代码示例
const myRequestToken = Symbol.for('myRequestToken');

// 发起异步请求
function makeRequest() {
  const token = Symbol.for('myRequestToken');
  const promise = new Promise((resolve, reject) => {
    // 异步操作
    setTimeout(() => {
      resolve('Request completed');
    }, 1000);
  });
  promise[token] = true; // 标记请求状态
  return promise;
}

// 处理异步请求
const myRequest = makeRequest();
myRequest.then((result) => {
  console.log(result);
  console.log(myRequest[myRequestToken]); // true
});

总结

Symbol.for() 是 ECMAScript 2017 中引入的一个非常有用的特性，它可以用于创建可重用的全局 Symbol 对象，特别适用于前端开发中的事件处理、命名空间管理、请求 token 等场景。在使用 Symbol.for() 时需要注意命名冲突的问题，可以通过为每个 Symbol 添加命名空间来避免这个问题。

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/650bbd3895b1f8cacd5d4fd6