JavaScript，对象的属性名如何使用一个变量来表示？

我们相信：世界是美好的，你是我也是。平行空间的世界里面，不同版本的生活也在继续...

JavaScript里面一个很基础的问题，对象的属性名称如何使用一个变量来表示？就是说对象的属性名是什么？未决，不由其自身决定。而是由外部代码决定其属性名称。

苏南大叔的“程序如此灵动”博客，记录苏南大叔的编程经验文章。测试环境：chrome@131.0.6778.70，nodejs@20.18.0。

基本情况

let obj = {
  name: "苏南大叔",
  attr: "无法变化的属性名",
};
console.log(obj);            // {name: '苏南大叔', attr: '无法变化的属性名'}
console.log(obj.attr);       // 无法变化的属性名
// console.log(obj[attr]);   // Uncaught ReferenceError: attr is not defined
console.log(obj["attr"]);    // 无法变化的属性名

解决方案：使用中括号

let attr = "test";
let obj2 = {
  name: "sunan大叔",
  [attr]: "自定义属性名",
};
console.log(obj2);        // {name: 'sunan大叔', test: '自定义属性名'}
console.log(obj2.attr);   // undefined
console.log(obj2[attr]);  // 自定义属性名

支持中文属性

let attr_cn = "中文";
let obj3 = {
  name: "sunan大叔",
  [attr_cn]: "自定义中文属性名",
};
console.log(obj3);           // {name: 'sunan大叔', 中文: '自定义属性名'}
console.log(obj3.attr_cn);   // undefined
console.log(obj3[attr_cn]);  // 自定义中文属性名

结语

很多时候，属性和数组是属于傻傻不清楚的情况。所以，如果属性行不通，换做数组来看看。更多文章，参考链接：

• https://newsn.net/tag/js/

如果本文对您有帮助，或者节约了您的时间，欢迎打赏瓶饮料，建立下友谊关系。
本博客不欢迎：各种镜像采集行为。请尊重原创文章内容，转载请保留作者链接。