js对象的key到底加不加引号？

这是大冰块2021年第12篇原创文章，和大冰块一起在前端领域努力吧！！！💪

写在前面

前两天看到一个同事的代码，他写对象的时候会把key值都会加上""，于是我又重新复习了一下关于对象中的key值加不加""的知识点。

那么加不加""有什么区别呢？首先要复习一下标识符原则：

1、首字母必须是字母、下划线（_）或美元符号（$），不能是数字。

2、除首字母外，其他字符可以是字母、数字、下划线或美元符号（$）。

3、普通标识符（用作变量名、函数名和循环语句中用于跳转的标记）不能是保留字符或关键字。

4、在严格模式下，arguments和eval不能用作变量名，函数名或者参数名。

所以这里要分符合标识符情况和不符合标识符情况来说一下。

符合标识符情况

key加不加""，都一样，读取key对应的value有两种方式：obj["key"]和obj.key都可以。

代码如下：

let obj1 = {
    name: "小明",
    $age: 18,
    _like: "爱好广泛"
}
let obj2 = {
    "name": "小红",
    "$age": 16,
    "_like": "爱好很少"
}

console.log(obj1) 
// {name: "小明", age: 18, _like: "爱好广泛"}
console.log(obj1.name, obj1.$age, obj1._like) 
// 小明 18 爱好广泛
console.log(obj1['name'], obj1['$age'], obj1['_like']) 
// 小明 18 爱好广泛

console.log(obj2) 
// {name: "小红", $age: 16, _like: "爱好很少"}
console.log(obj2.name, obj2.$age, obj2._like) 
// 小红 16 爱好很少
console.log(obj2['name'], obj2['$age'], obj2['_like']) 
// 小红 16 爱好很少

不符合标识符情况

key必须加""，读取key对应的value只能是obj["key"]。

代码如下：

let obj = {
    "0": "小明",
    "0name": "小明明", // 这里会报错：Invalid or unexpected token（无效标记意外字符）
    "": 18,
    "￥": "哈哈",
    "  ": "爱好广泛"
}
console.log(obj) // {0: "小明", 0name: "小明明", "": 18, ￥: "哈哈", "  ": "爱好广泛"}
console.log(obj.0, obj.0name) // 报错
console.log(obj['0'], obj['0name'], obj[''], obj['￥'], obj['  ']) // 小明 小明明 18 哈哈 爱好广泛

另外Symbol类型的值也不符合标识符，需要这种写法：obj["key"]。

关于Symbol类型的学习，可以参考我这篇文章：《看完就懂系列》答应我，看完就开始用Symbol好吗？

如果你看完觉得意犹未尽，可以看看大冰块《看完就懂系列》的文章，《看完就懂系列》旨在把一些常见的概念或方法以通俗易懂的方式呈现出来。欢迎大家点击一起讨论学习：

原创不易，如有错误，欢迎指正。

如果有帮助到你，请给大冰块悄悄点赞关注，你的点赞关注就是我写下去的动力。

让我们一起在前端的路上进步吧~🤭