ES6 中 Object.getOwnPropertySymbols() 的详解及使用场景

随着 JavaScript 的不断发展，ES6 引入了许多新的特性，其中一个比较常用但不太为人所知的 API 就是 Object.getOwnPropertySymbols()。本篇文章将详解其作用及使用场景。

什么是 Object.getOwnPropertySymbols()？

ES6 中的 Object.getOwnPropertySymbols() 是一个静态方法，它返回一个给定对象自身的所有 Symbol 属性的数组。这意味着它只返回对象中的 Symbol 属性，而忽略掉其他类型的属性。

Symbol 是 ES6 中引入的一种新的原始数据类型，它可以用来作为对象属性的键值，相比于字符串键值，它具有更多的控制力和安全性。

实际应用场景

避免属性名冲突

在 JavaScript 中，当使用对象作为函数参数时，有时可能会出现属性名冲突的情况。例如：

function doSth(options) {
  // 由于不确定 options 对象中是否有 name 属性，因此需要进行判断
  if (options.name !== undefined) {
    console.log('Hello, ' + options.name);
  }
}
doSth({ name: 'Alice' }); // Hello, Alice
doSth({ title: 'Miss' }); // 没有输出

为了避免冲突，可以使用 Symbol 类型的属性作为键值，例如：

const name = Symbol('name');
function doSth(options) {
  if (options[name] !== undefined) {
    console.log('Hello, ' + options[name]);
  }
}
doSth({ [name]: 'Alice' }); // Hello, Alice
doSth({ title: 'Miss' }); // 没有输出

此时，即使 options 对象中存在名称为 name 的属性，也不会受到影响。

封装对象属性

在 JavaScript 中，很难将对象的属性进行封装。例如：

const obj = {
  prop1: 'val1',
  prop2: 'val2',
  // 将 prop3 改为 _prop3 以封装
  _prop3: 'val3',
  get prop3() {
    return this._prop3;
  },
  set prop3(val) {
    this._prop3 = val;
  }
};
console.log(obj.prop3); // val3
obj.prop3 = 'new val';
console.log(obj.prop3); // new val

使用 Object.getOwnPropertySymbols() 可以将属性封装起来，例如：

const prop3 = Symbol('prop3');
const obj = {
  prop1: 'val1',
  prop2: 'val2',
  [prop3]: 'val3',
  get prop3() {
    return this[prop3];
  },
  set prop3(val) {
    this[prop3] = val;
  }
};
console.log(obj.prop3); // val3
obj.prop3 = 'new val';
console.log(obj.prop3); // new val

这样，外部就无法直接访问和修改对象的 prop3 属性，有效地实现了属性的封装。

示例代码

// 避免属性名冲突
const name = Symbol('name');
function doSth(options) {
  if (options[name] !== undefined) {
    console.log('Hello, ' + options[name]);
  }
}
doSth({ [name]: 'Alice' }); // Hello, Alice
doSth({ title: 'Miss' }); // 没有输出

// 封装对象属性
const prop3 = Symbol('prop3');
const obj = {
  prop1: 'val1',
  prop2: 'val2',
  [prop3]: 'val3',
  get prop3() {
    return this[prop3];
  },
  set prop3(val) {
    this[prop3] = val;
  }
};
console.log(obj.prop3); // val3
obj.prop3 = 'new val';
console.log(obj.prop3); // new val

总结

Object.getOwnPropertySymbols() 是 ES6 中一个比较有用但不太为人所知的 API，它可以用于避免属性名冲突和封装对象属性。值得注意的是，Symbol 属性不会在 for...in 循环和 Object.keys() 中被枚举，因此需要特别注意它的使用场景。

来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/65a4a7baadd4f0e0ffcf8624