场景复现
在后台管理系统的项目开发中，对于后端接口返回的数据进行处理是一件很重要的事情。有时候返回的值是json格式的数据，这个时候我们就需要通过键来获取值，因此本期文章以此为主线，详细介绍三种方法获取数组对象里面的键(key)和值(value) 对象键值。
方法一： 使用 () 方法获取 javascript 对象的键
方法二：使用 (obj) 方法获取 javascript 对象的键
方法三：使用for 循环获取 javascript 对象的 key
三种方法获取数组对象里的键值
javascript 对象是键值对的集合。我们需要一个键来从 javascript 对象中获取它的值。键值对广泛用于客户端-服务器通信和 JavaScript 编程。我们知道从 JSON 对象中检索一个值，只要我们有它的键。但是如果我们没有 key 名称怎么办？
1、()
() 函数返回一个包含 javascript 对象键的数组。
我们将 javascript 对象作为参数传递给 () 函数。
输出数组包含的键的顺序与它们在原始 javascript 对象中的顺序相同。
如果我们将数组传递给 ()，它将返回数组索引作为输出。
并且参数对象带有索引，那么 () 将返回这些索引的数组。
-
var fruitsArr1 = ["Apple", "Orange", "Mango", "Banana"];
-
var fruitsObj2 = { 0: "Apple", 4: "Orange", 2: "Mango", 3: "Banana"};
-
var fruitsObj3 = { "id": "1", "name": "mango", "color": "yellow"};
-
(Object.keys(fruitsArr1));
-
(Object.keys(fruitsObj2));
-
(Object.keys(fruitsObj3));
-
["0", "1", "2", "3"]
-
["0", "2", "3", "4"]
-
["id", "name", "color"]
如果键是数字，() 函数将按排序顺序返回数字键的数组。
fruitsObj2 具有编号为 0、4、2、3 的键。但是当我们应用 () 函数时，它返回的键是 [“0”, “2”, “3”, “4”]，按排序顺序排列。键值仍将保持与原始 javascript 对象相同的值映射。
例如，fruitsObj2 包含 4: “Orange” 和 2: “Mango”，但 (fruitsObj2) 将它们的顺序返回为 “2”, “4”。
如果我们是 他们在键 2 和 4 上的值，我们会得到正确的值作为输出。
因此，该函数没有修改实际键值映射中的任何内容，即使 按排序顺序返回数组或对象的数字键。
-
(fruitsObj2[2]);
-
(fruitsObj2[4]);
-
Mango
-
Orange
2、(obj)
(obj) 方法多种多样，比 () 函数更灵活。
它将整个对象拆分为小数组。每个数组由 [key, value] 形式的键值对组成。
使用 ()，我们只得到一个对象的键，但是使用 (obj)，我们可以得到一个对象中的所有条目，包括 keys 和它们的 values.
(obj) 不是常用的方法。在大多数情况下，我们需要从对象中获取键。借助 keys可以轻松获得相应的值。
语法：(object)
参数：与 () 方法相同，(obj) 接受javascript object作为参数。
返回值：
(obj) 返回析构为数组的键值对。
返回类型将是一个数组数组，每个子数组包含两个元素：键和值。
类似于 [[key1, value1], [key2, value2], [key3, value3] … ]。该函数保留对象属性的顺序。在幕后的实现中，键值对是通过迭代对象属性形成的。我们使用 () 来获取函数输出值的可读字符串版本。
-
var fruitsObj3 = { "id": "1", "name": "mango", "color": "yellow"};
-
console.log(JSON.stringify(Object.entries(fruitsObj3)));
我们可以以另一种方式使用 ()。遍历 javascript 对象并记录属性键及其值。
-
for (const [key, value] of Object.entries(fruitsObj3)) {
-
console.log(`${key}: ${value}`);
-
}
3、for 循环【常用】
我们可以像使用 for-in 组合遍历数组一样遍历任何 javascript 对象。它遍历每个参数，其中i（迭代器）保存对象的 key，而 object[i] 保存与对象中的 key 对应的值。
-
var obj = { "id": "1", "name": "mango", "color": "green"};
-
for(let i in obj) {
-
console.log(i); // key
-
console.log(obj[i]); // value against the key
-
}
-
var a = { "id": "1", "name": "mango", "color": {"name": "yellow", "appearance": "bright"}};
-
for(let i in a){
-
console.log(i);
-
console.log(a[i]);
-
}