了解 JavaScript 中的关键对象方法
来源:dev.to
时间:2024-10-19 16:06:51 414浏览 收藏
一分耕耘,一分收获!既然都打开这篇《了解 JavaScript 中的关键对象方法》,就坚持看下去,学下去吧!本文主要会给大家讲到等等知识点,如果大家对本文有好的建议或者看到有不足之处,非常欢迎大家积极提出!在后续文章我会继续更新文章相关的内容,希望对大家都有所帮助!
javascript 的对象包含许多有用的方法,可以帮助开发人员轻松操作对象。让我们通过简短的解释和示例来了解一些最重要的内容
- object.create()
- object.assign()
- object.keys()
- object.values()
- object.entries()
- object.freeze()
- object.seal()
- object.preventextensions()
- object.getprototypeof()
- object.setprototypeof()
- object.defineproperty()
- object.defineproperties()
- object.getownpropertydescriptor()
- object.getownpropertydescriptors()
- object.getownpropertynames()
- object.is()
- object.isfrozen()
- object.issealed()
- object.isextensible()
- object.fromentries()
- object.hasownproperty()
- object.hasown()
- 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 } ] } */
今天带大家了解了的相关知识,希望对你有所帮助;关于文章的技术知识我们会一点点深入介绍,欢迎大家关注golang学习网公众号,一起学习编程~
-
501 收藏
-
501 收藏
-
501 收藏
-
501 收藏
-
501 收藏
-
143 收藏
-
184 收藏
-
407 收藏
-
273 收藏
-
334 收藏
-
353 收藏
-
311 收藏
-
315 收藏
-
151 收藏
-
238 收藏
-
420 收藏
-
472 收藏
-
- 前端进阶之JavaScript设计模式
- 设计模式是开发人员在软件开发过程中面临一般问题时的解决方案,代表了最佳的实践。本课程的主打内容包括JS常见设计模式以及具体应用场景,打造一站式知识长龙服务,适合有JS基础的同学学习。
- 立即学习 542次学习
-
- GO语言核心编程课程
- 本课程采用真实案例,全面具体可落地,从理论到实践,一步一步将GO核心编程技术、编程思想、底层实现融会贯通,使学习者贴近时代脉搏,做IT互联网时代的弄潮儿。
- 立即学习 508次学习
-
- 简单聊聊mysql8与网络通信
- 如有问题加微信:Le-studyg;在课程中,我们将首先介绍MySQL8的新特性,包括性能优化、安全增强、新数据类型等,帮助学生快速熟悉MySQL8的最新功能。接着,我们将深入解析MySQL的网络通信机制,包括协议、连接管理、数据传输等,让
- 立即学习 497次学习
-
- JavaScript正则表达式基础与实战
- 在任何一门编程语言中,正则表达式,都是一项重要的知识,它提供了高效的字符串匹配与捕获机制,可以极大的简化程序设计。
- 立即学习 487次学习
-
- 从零制作响应式网站—Grid布局
- 本系列教程将展示从零制作一个假想的网络科技公司官网,分为导航,轮播,关于我们,成功案例,服务流程,团队介绍,数据部分,公司动态,底部信息等内容区块。网站整体采用CSSGrid布局,支持响应式,有流畅过渡和展现动画。
- 立即学习 484次学习