JavaScript 对象方法
通用方法
// 将源对象中的属性复制到目标对象
Object.assign(target, source)
// 从现有对象创建对象
Object.create(object)
// 返回对象中键值对的数组
Object.entries(object)
// 从键值对列表创建对象
Object.fromEntries()
// 返回对象中键的数组
Object.keys(object)
// 返回对象中属性值的数组
Object.values(object)
// 根据函数对对象元素进行分组
Object.groupBy(object, callback)
JavaScript Object.assign()
The Object.assign() 方法将一个或多个源对象中的属性复制到目标对象。
示例
// 创建目标对象
const person1 = {
firstName: "John",
lastName: "Doe",
age: 50,
eyeColor: "blue"
};
// 创建源对象
const person2 = {firstName: "Anne",lastName: "Smith"};
// 将源对象分配给目标对象
Object.assign(person1, person2);
自己尝试 »
JavaScript Object.entries()
ECMAScript 2017 为对象添加了 Object.entries() 方法。
Object.entries() 返回对象中键值对的数组
示例
const person = {
firstName : "John",
lastName : "Doe",
age : 50,
eyeColor : "blue"
};
let text = Object.entries(person);
自己尝试 »
Object.entries() 使在循环中使用对象变得简单
示例
const fruits = {Bananas:300, Oranges:200, Apples:500};
let text = "";
for (let [fruit, value] of Object.entries(fruits)) {
text += fruit + ": " + value + "<br>";
}
自己尝试 »
Object.entries() 也使将对象转换为映射变得简单
示例
const fruits = {Bananas:300, Oranges:200, Apples:500};
const myMap = new Map(Object.entries(fruits));
自己尝试 »
Object.entries() 从 2017 年 3 月起在所有现代浏览器中都支持
JavaScript Object.fromEntries()
The fromEntries() 方法从键值对列表创建对象。
示例
const fruits = [
["apples", 300],
["pears", 900],
["bananas", 500]
];
const myObj = Object.fromEntries(fruits);
自己尝试 »
JavaScript Object.values()
Object.values() 与 Object.entries() 类似，但返回对象值的单维数组
示例
const person = {
firstName : "John",
lastName : "Doe",
age : 50,
eyeColor : "blue"
};
let text = Object.values(person);
自己尝试 »
Object.values() 从 2017 年 3 月起在所有现代浏览器中都支持
JavaScript Object.groupBy()
ES2024 为 JavaScript 添加了 Object.groupBy() 方法。
The Object.groupBy() 方法根据回调函数返回的字符串值对对象的元素进行分组。
The Object.groupBy() 方法不会更改原始对象。
示例
// 创建一个数组
const fruits = [
{name:"apples", quantity:300},
{name:"bananas", quantity:500},
{name:"oranges", quantity:200},
{name:"kiwi", quantity:150}
];
// 用于分组元素的回调函数
function myCallback({ quantity }) {
return quantity > 200 ? "ok" : "low";
}
// 按数量分组
const result = Object.groupBy(fruits, myCallback);
自己尝试 »
浏览器支持
Object.groupBy() 是 ES2024 的一个特性。
从 2024 年 3 月开始，它在新的浏览器中得到支持
| Chrome 117 | Edge 117 | Firefox 119 | Safari 17.4 | Opera 103 |
| 2023 年 9 月 | 2023 年 9 月 | 2023 年 10 月 | 2024 年 10 月 | 2023 年 5 月 |
警告
ES2024 功能比较新。
较旧的浏览器可能需要使用替代代码（Polyfill）
Object.groupBy() 与 Map.groupBy()
Object.groupBy() 和 Map.groupBy() 之间的区别是
Object.groupBy() 将元素分组到 JavaScript 对象中。
Map.groupBy() 将元素分组到 Map 对象中。
JavaScript Object.keys()
Object.keys() 方法返回一个包含对象键的数组。
示例
// 创建一个对象
const person = {
firstName: "John",
lastName: "Doe",
age: 50,
eyeColor: "blue"
};
// 获取键
const keys = Object.keys(person);
自己尝试 »
JavaScript for...in 循环
JavaScript 的 for...in 语句循环遍历对象的属性。
语法
for (let variable in object) {
// 要执行的代码
}
位于 for...in 循环内的代码块将为每个属性执行一次。
循环遍历对象的属性
示例
const person = {
fname:" John",
lname:" Doe",
age: 25
};
for (let x in person) {
txt += person[x];
}
自己尝试 »
