”工欲善其事,必先利其器。“—孔子《论语.录灵公》
首页 > 编程 > 了解 JavaScript 中的关键对象方法

了解 JavaScript 中的关键对象方法

发布于2024-11-04
浏览:482

Understanding Key Object Methods in JavaScript

JavaScript 的 Object 包含许多有用的方法,可以帮助开发人员轻松操作对象。让我们通过简短的解释和示例来了解一些最重要的内容

  1. Object.create()
  2. Object.assign()
  3. Object.keys()
  4. Object.values()
  5. Object.entries()
  6. Object.freeze()
  7. Object.seal()
  8. Object.preventExtensions()
  9. Object.getPrototypeOf()
  10. Object.setPrototypeOf()
  11. Object.defineProperty()
  12. Object.defineProperties()
  13. Object.getOwnPropertyDescriptor()
  14. Object.getOwnPropertyDescriptors()
  15. Object.getOwnPropertyNames()
  16. Object.is()
  17. Object.isFrozen()
  18. Object.isSealed()
  19. Object.isExtensible()
  20. Object.fromEntries()
  21. Object.hasOwnProperty()
  22. Object.hasOwn()
  23. Object.groupBy()(建议的功能,可能不完全可用)

Object.create()
Object.create() 是 JavaScript 中的一个方法,用于创建具有指定原型对象和可选属性的新对象。与使用对象文字或构造函数相比,它允许对对象的原型和属性进行更细粒度的控制。

const personPrototype = {
  greet() {
    console.log(`Hello, my name is ${this.name}`);
  }
};

const john = Object.create(personPrototype);
john.name = "John";
john.greet();  // Output: Hello, my name is John

Object.assign()
Object.assign() 是一种内置 JavaScript 方法,用于将所有可枚举自身属性的值从一个或多个源对象复制到目标对象。它执行浅复制并返回修改后的目标对象。

const target = { a: 1 };
const source = { b: 2, c: 3 };
const result = Object.assign(target, source);
console.log(result);  // Output: { a: 1, b: 2, c: 3 }
console.log(target);  // Output: { a: 1, b: 2, c: 3 } (target is also modified)

Object.keys()
返回对象自己的可枚举属性名称(键)的数组

const obj = { a: 1, b: 2, c: 3 };
console.log(Object.keys(obj));  // Output: ['a', 'b', 'c']

Object.values()
返回对象自身可枚举属性值的数组

const obj = { a: 1, b: 2, c: 3 };
console.log(Object.values(obj));  // Output: [1, 2, 3]

Object.entries()
返回对象自身可枚举属性[key, value]对
的数组

const obj = { a: 1, b: 2, c: 3 };
console.log(Object.entries(obj));  // Output: [['a', 1], ['b', 2], ['c', 3]]

Object.freeze()
冻结对象,防止添加新属性或更改或删除现有属性

const obj = { a: 1 };
Object.freeze(obj);
obj.a = 2;  // No effect, because the object is frozen
console.log(obj.a);  // Output: 1

Object.seal()
密封对象,防止添加新属性,但允许修改现有属性。

const obj = { a: 1 };
Object.seal(obj);
obj.a = 2;  // Allowed
delete obj.a;  // Not allowed
console.log(obj.a);  // Output: 2

Object.preventExtensions()
防止将任何新属性添加到对象,但允许修改和删除现有属性

const obj = { a: 1 };
Object.preventExtensions(obj);
obj.b = 2;  // Not allowed
console.log(obj.b);  // Output: undefined

Object.getPrototypeOf()
返回指定对象的原型(即内部[[Prototype]])

const obj = {};
const proto = Object.getPrototypeOf(obj);
console.log(proto);  // Output: {} (the default Object prototype)

Object.setPrototypeOf()
设置指定对象的原型。

const proto = { greet() { console.log('Hello!'); } };
const obj = {};
Object.setPrototypeOf(obj, proto);
obj.greet();  // Output: 'Hello!'

Object.defineProperty()
在对象上定义一个新属性或修改现有属性,并使用属性描述符的附加选项(例如,可写、可配置)。

const obj = {};
Object.defineProperty(obj, 'a', {
  value: 42,
  writable: false,  // Cannot modify the value
});
obj.a = 100;  // No effect because writable is false
console.log(obj.a);  // Output: 42

Object.defineProperties()
使用属性描述符在对象上定义多个属性。

const obj = {};
Object.defineProperties(obj, {
  a: { value: 42, writable: false },
  b: { value: 100, writable: true }
});
console.log(obj.a);  // Output: 42
console.log(obj.b);  // Output: 100

Object.getOwnPropertyDescriptor()
返回对象属性的描述符。

const obj = { a: 1 };
const descriptor = Object.getOwnPropertyDescriptor(obj, 'a');
console.log(descriptor);  
// Output: { value: 1, writable: true, enumerable: true, configurable: true }

Object.getOwnPropertyDescriptors()
返回一个对象,其中包含对象自身属性的所有属性描述符

const obj = { a: 1 };
const descriptors = Object.getOwnPropertyDescriptors(obj);
console.log(descriptors);
// Output: { a: { value: 1, writable: true, enumerable: true, configurable: true } }

Object.getOwnPropertyNames()
返回直接在对象上找到的所有属性(包括不可枚举的属性)的数组。

const obj = { a: 1 };
Object.defineProperty(obj, 'b', { value: 2, enumerable: false });
console.log(Object.getOwnPropertyNames(obj));  // Output: ['a', 'b']

Object.is()
比较两个值是否相同(如 === 但处理 NaN 等特殊情况)

console.log(Object.is(NaN, NaN));  // Output: true
console.log(Object.is( 0, -0));    // Output: false

Object.isFrozen()
检查对象是否被冻结

const obj = Object.freeze({ a: 1 });
console.log(Object.isFrozen(obj));  // Output: true

Object.isSealed()
检查物体是否被密封。

const obj = Object.seal({ a: 1 });
console.log(Object.isSealed(obj));  // Output: true

Object.isExtensible()
检查是否可以将新属性添加到对象。

const obj = { a: 1 };
Object.preventExtensions(obj);
console.log(Object.isExtensible(obj));  // Output: false

Object.fromEntries()
将键值对数组转换为对象

const entries = [['a', 1], ['b', 2]];
const obj = Object.fromEntries(entries);
console.log(obj);  // Output: { a: 1, b: 2 }

Object.hasOwnProperty()
检查对象是否拥有指定的属性(不是继承的)

const obj = { a: 1 };
console.log(obj.hasOwnProperty('a'));  // Output: true

Object.hasOwn()
Object.hasOwn() 是 ES2022 中引入的较新方法,作为 Object.hasOwnProperty() 的替代方法。它检查对象是否具有带有指定键的直接(自己)属性,而无需查找原型链。

const obj = {
  name: 'Alice',
  age: 25
};

console.log(Object.hasOwn(obj, 'name'));  // true
console.log(Object.hasOwn(obj, 'gender'));  // false

Object.groupBy
Object.groupBy 是 ECMAScript 2024 中为 JavaScript 提出的一个相对较新的功能,允许您根据通用标准对对象进行分组。它尚未在所有环境中广泛使用,因此在完全实现之前,它可能无法在许多浏览器或 JavaScript 引擎中工作。

const array = [
  { name: 'Alice', age: 25 },
  { name: 'Bob', age: 30 },
  { name: 'Charlie', age: 25 },
  { name: 'David', age: 30 },
];

// Group objects by age
const groupedByAge = Object.groupBy(array, item => item.age);

console.log(groupedByAge);

/*
Expected Output:
{
  25: [
    { name: 'Alice', age: 25 },
    { name: 'Charlie', age: 25 }
  ],
  30: [
    { name: 'Bob', age: 30 },
    { name: 'David', age: 30 }
  ]
}
*/

版本声明 本文转载于:https://dev.to/muthuraja_r/javascript-object-methods-33n1?1如有侵犯,请联系[email protected]删除
最新教程 更多>
  • 除了“if”语句之外:还有哪些地方可以在不进行强制转换的情况下使用具有显式“bool”转换的类型?
    除了“if”语句之外:还有哪些地方可以在不进行强制转换的情况下使用具有显式“bool”转换的类型?
    无需强制转换即可上下文转换为 bool您的类定义了对 bool 的显式转换,使您能够在条件语句中直接使用其实例“t”。然而,这种显式转换提出了一个问题:“t”在哪里可以在不进行强制转换的情况下用作 bool?上下文转换场景C 标准指定了四种值可以根据上下文转换为 bool 的主要场景:语句:if、w...
    编程 发布于2024-11-16
  • 如何在整个 MySQL 数据库中执行全局查找和替换?
    如何在整个 MySQL 数据库中执行全局查找和替换?
    查找和替换整个 MySQL 数据库目标是在整个 MySQL 数据库中执行全局查找和替换操作。该问题建议更改以下语法:update [table_name] set [field_name] = replace([field_name],'[string_to_find]','[string_to_r...
    编程 发布于2024-11-16
  • 如何在 C++ 中将字符串转换为双精度数:使用 `std::istringstream` 和 `std::stod` 的简单指南
    如何在 C++ 中将字符串转换为双精度数:使用 `std::istringstream` 和 `std::stod` 的简单指南
    在 C 中将字符串转换为双精度型 在 C 中,可以使用 std::istringstream 和 std::stod 函数将字符串转换为双精度型。#include <sstream> double string_to_double(const std::string& s) { ...
    编程 发布于2024-11-16
  • 如何在 PHP 中组合两个关联数组,同时保留唯一 ID 并处理重复名称?
    如何在 PHP 中组合两个关联数组,同时保留唯一 ID 并处理重复名称?
    在 PHP 中组合关联数组在 PHP 中,将两个关联数组组合成一个数组是一项常见任务。考虑以下请求:问题描述:提供的代码定义了两个关联数组,$array1和$array2。目标是创建一个新数组 $array3,它合并两个数组中的所有键值对。 此外,提供的数组具有唯一的 ID,而名称可能重合。要求是构...
    编程 发布于2024-11-16
  • 如何使用 MySQL 查找今天生日的用户?
    如何使用 MySQL 查找今天生日的用户?
    如何使用 MySQL 识别今天生日的用户使用 MySQL 确定今天是否是用户的生日涉及查找生日匹配的所有行今天的日期。这可以通过一个简单的 MySQL 查询来实现,该查询将存储为 UNIX 时间戳的生日与今天的日期进行比较。以下 SQL 查询将获取今天有生日的所有用户: FROM USERS ...
    编程 发布于2024-11-16
  • 大批
    大批
    方法是可以在对象上调用的 fns 数组是对象,因此它们在 JS 中也有方法。 slice(begin):将数组的一部分提取到新数组中,而不改变原始数组。 let arr = ['a','b','c','d','e']; // Usecase: Extract till index p...
    编程 发布于2024-11-16
  • 为什么 Lambda 比 C++ 中的普通函数更可优化?
    为什么 Lambda 比 C++ 中的普通函数更可优化?
    与普通函数相比,为什么 Lambda 允许增强编译器优化Nicolai Josuttis 的 C 标准库(第二版)断言 lambda 可以与普通函数相比,编译器可以更有效地优化。这一优势源于 lambda 作为函数对象的本质。当 lambda 传递给函数模板时,它会被实例化为专门针对该对象定制的新函...
    编程 发布于2024-11-16
  • Bootstrap 4 Beta 中的列偏移发生了什么?
    Bootstrap 4 Beta 中的列偏移发生了什么?
    Bootstrap 4 Beta:列偏移的删除和恢复Bootstrap 4 在其 Beta 1 版本中引入了重大更改柱子偏移了。然而,随着 Beta 2 的后续发布,这些变化已经逆转。从 offset-md-* 到 ml-auto在 Bootstrap 4 Beta 1 中, offset-md-*...
    编程 发布于2024-11-16
  • 如何有效地从 JavaScript 中的对象数组中删除属性?
    如何有效地从 JavaScript 中的对象数组中删除属性?
    从对象数组中高效删除属性处理包含多个对象的数组时,需要从每个对象中删除特定属性。虽然使用 for 循环的简单方法就足够了,但探索利用 ES6 功能和原型操作的替代方法可以带来更高效的实现。ES6 对象解构One这种技术就是 ES6 中引入的对象解构。它可以从对象中提取特定属性并进一步分配给新变量。在...
    编程 发布于2024-11-16
  • Nonce 如何保护 Web 请求免受重放攻击?
    Nonce 如何保护 Web 请求免受重放攻击?
    如何使用 Nonces 保护 Web 请求问题用户找到了一种利用网站评分系统的请求验证系统的方法:复制高价值的 HTTP 请求。这会损害系统的完整性和可靠性。解决方案:实现 Nonce 系统Nonce(使用一次的数字)是通过确保特定请求不被执行来防止请求重放攻击的值。之前做的。这是实现随机数系统的常...
    编程 发布于2024-11-16
  • 在 Go 中使用 WebSocket 进行实时通信
    在 Go 中使用 WebSocket 进行实时通信
    构建需要实时更新的应用程序(例如聊天应用程序、实时通知或协作工具)需要一种比传统 HTTP 更快、更具交互性的通信方法。这就是 WebSockets 发挥作用的地方!今天,我们将探讨如何在 Go 中使用 WebSocket,以便您可以向应用程序添加实时功能。 在这篇文章中,我们将介绍: WebSoc...
    编程 发布于2024-11-16
  • 如何有效控制JVM内存消耗?
    如何有效控制JVM内存消耗?
    控制 JVM 内存消耗为了分配适当的资源以获得最佳应用程序性能,设置 JVM 的最大内存至关重要JVM(Java虚拟机)可以利用。这不仅包括堆内存,还包括正在运行的进程的整个内存消耗。为了实现这一点,JVM 提供了两个关键的命令行参数:- Xms:: 此参数指定启动时分配给 JVM 的最小内存量。-...
    编程 发布于2024-11-16
  • 互动角斗士战斗模拟|角斗士之战.com
    互动角斗士战斗模拟|角斗士之战.com
    通过这个交互式角斗士战斗模拟进入竞技场!控制两个强大的角斗士,每个角斗士都有独特的动作,如攻击、防御和闪避,并配有动态动画和实时战斗日志。这款模拟由 GladiatorsBattle.com 提供支持,非常适合古罗马和战术游戏的粉丝。加入战斗,体验斗兽场的快感! ...
    编程 发布于2024-11-16
  • 如何正确设置Java URLConnection中的User-Agent?
    如何正确设置Java URLConnection中的User-Agent?
    设置 Java URLConnection 的用户代理尝试使用 Java 和 URLConnection 解析网页并将用户代理设置为指定的值时,可以在末尾附加一个额外的“Java/1.5.0_19”。这是由于旧版本 Java 的限制所致。解决方案(Java 1.6.30 及更高版本)在 Java 1...
    编程 发布于2024-11-16
  • 读取文件时如何删除文本换行符?
    读取文件时如何删除文本换行符?
    消除文本中的换行符在提供的代码片段中,您遇到了一个问题,即无意中向每行添加了换行符读取文件时。要纠正此问题,您可以采用以下策略:选项 1:删除最后一个字符使用切片从读取行中删除最后一个字符:read_line = read_line[:len(read_line)-1]选项 2:利用字符串库利用字符...
    编程 发布于2024-11-16

免责声明: 提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请说明详细缘由并提供版权或权益证明然后发到邮箱:[email protected] 我们会第一时间内为您处理。

Copyright© 2022 湘ICP备2022001581号-3