JavaScript中字符串属性访问器的差异及两种对象定义的区别

嘿，这个问题问得很实用！其实你给出的obj和obj2在绝大多数日常场景下完全没有区别——它们创建的对象属性是完全一致的，访问方式也没有差异。不过在一些特殊场景里，两种写法会有本质区别，我给你详细拆解：

一、无差异的常规场景 #

当属性名是合法的JavaScript标识符时，带不带引号都一样：

• 合法标识符的规则：以字母、下划线_或美元符号$开头，后面可以跟字母、数字、下划线或美元符号；同时不能是JavaScript的关键字/保留字（比如let、class这类）。

像你例子里的id和name都符合这个规则，所以：

let obj = {"id": 134, "name": "objectsname"};
let obj2 = {id: 134, name: "objectsname"};

这两个对象的属性名本质都是字符串"id"和"name"，不管用.访问（obj.name、obj2.name）还是方括号[]访问（obj["name"]、obj2["name"]），结果都完全相同。

二、必须用引号的特殊场景 #

只有当属性名不符合合法标识符规则时，才必须用引号（单引号或双引号都可以）包裹，否则会触发语法错误：

• 属性名包含空格、特殊字符（比如-、@、#等）：

  // 正确写法
  let user = { "user-name": "张三", "email address": "zhangsan@example.com" };
  // 错误写法（语法报错）
  // let user = { user-name: "张三", email address: "zhangsan@example.com" };
  // 访问时只能用方括号
  console.log(user["user-name"]); // 输出"张三"
  

• 属性名是JavaScript关键字/保留字：
  虽然ES6之后允许直接用关键字作为属性名（比如{ let: 123 }），但在旧版JS引擎里会报错，加引号能兼容所有环境：

  let specialObj = { "let": "变量", "class": "类" };
  

• 属性名以数字开头或包含非标识符字符的数字组合：

  // 正确写法
  let numObj = { "123abc": "测试值", "001-id": "001" };
  // 错误写法（语法报错）
  // let numObj = { 123abc: "测试值", 001-id: "001" };
  

总结 #

回到你的例子，obj和obj2是完全等价的，没有任何区别——你代码里两次写console.log(obj.name)应该是笔误，换成console.log(obj2.name)结果也会是"objectsname"。只有当属性名不符合标识符规则时，才需要用引号包裹属性名。

内容的提问来源于stack exchange，提问作者hellzone