obeject.key与object[key]的区别

本文探讨了JavaScript中对象属性的不同访问方式,包括使用点符号和中括号符号的区别。重点介绍了在属性名包含特殊字符或空格时,如何利用中括号语法进行有效访问。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

https://segmentfault.com/q/1010000004225321

data[key]适用于动态取key、key为特殊字符。

data.key访问的是data对象下的key。
data[key]访问的是data数组的下标为key的值(对象是可以以数组形式来访问的)。

data.key这里的key必须是引用值。

data[key]这里的key必须是字面量。

当你的属性名包含了空格时,必须采用中括号的写法。

var obj = {}; 
obj['first name'] = 'mike';

以上情形,只有通过[]语法才能获取'first name',因为其中有空格,用.语法怎么也取不到。 

### JavaScript `Object.keys` 方法使用说明 `Object.keys` 是 JavaScript 中用于获取对象自身所有可枚举属性的键名数组的方法。它的语法如下: ```javascript Object.keys(obj) ``` - **参数**:`obj` 表示要返回其枚举自身属性的对象。 - **返回值**:一个包含给定对象所有可枚举属性的字符串数组[^3]。 #### 1. 基本用法 当处理一个普通对象时,`Object.keys` 会返回该对象的所有可枚举属性名组成的数组。 ```javascript let person = { name: "zhangs", city: "xian", fav: "sing" }; console.log(Object.keys(person)); // ["name", "city", "fav"] ``` #### 2. 处理数组 如果将数组作为参数传递给 `Object.keys`,它会返回数组索引的字符串形式组成的数组。 ```javascript let arr = [1, 32, 2, 23, 1]; console.log(Object.keys(arr)); // ["0", "1", "2", "3", "4"] ``` #### 3. 处理字符串 当传入一个字符串时,`Object.keys` 将字符串视为对象,并返回其索引值组成的数组。 ```javascript let str = "strings"; console.log(Object.keys(str)); // ["0", "1", "2", "3", "4", "5", "6"] ``` #### 4. 应用场景 `Object.keys` 常其他方法结合使用,例如 `map` 或 `forEach`,以对对象的属性进行迭代操作。 ```javascript let person = { name: "zhangs", city: "xian", fav: "sing" }; // 使用 map 获取对象的值 Object.keys(person).map((key) => { console.log(`${key}: ${person[key]}`); // 输出每个键值对 }); // 使用 forEach 遍历键 Object.keys(person).forEach((key) => { console.log(key); // 输出每个键 }); ``` #### 5. 注意事项 - `Object.keys` 只返回对象自身的可枚举属性,不会包括继承的属性或不可枚举的属性[^1]。 - 如果需要获取对象的所有键(包括不可枚举和继承的属性),可以使用 `Reflect.ownKeys` 或 `Object.getOwnPropertyNames`[^4]。 ```javascript const obj = Object.create({ inheritKey: 'inheritValue' }, { nonEnumerableKey: { value: 'nonEnumerableValue', enumerable: false }, }); console.log(Object.keys(obj)); // [] console.log(Reflect.ownKeys(obj)); // ['nonEnumerableKey'] console.log(Object.getOwnPropertyNames(obj)); // ['nonEnumerableKey'] ``` #### 6. `Object.values` 的对比 `Object.keys` 返回的是对象的键名数组,而 `Object.values` 返回的是对象的键值数组。两者是互补的关系。 ```javascript let obj = { a: 1, b: 2, c: 3 }; console.log(Object.keys(obj)); // ["a", "b", "c"] console.log(Object.values(obj)); // [1, 2, 3] ``` ### 示例代码 以下是一个综合示例,展示如何结合 `Object.keys` 和其他方法解决问题: ```javascript const book = { title: "JavaScript 指南", price: 99, }; // 使用 for...of 遍历键值对 for (const key of Object.keys(book)) { console.log(`${key}: ${book[key]}`); } // 使用 forEach 遍历键值对 Object.keys(book).forEach((key) => { console.log(`${key} -> ${book[key]}`); }); ```
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值