当前位置: 首页 > news >正文

了解一些常用的Javascript对象方法

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

  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 }]
}
*/

相关文章:

了解一些常用的Javascript对象方法

javascript 的对象包含许多有用的方法,可以帮助开发人员轻松操作对象。让我们通过简短的解释和示例来了解一些最重要的内容 object.create()object.assign()object.keys()object.values()object.entries()object.freeze()object.seal()object.preventextensions()o…...

【知识科普】GraphQL一个强大的API查询语言

文章目录 概述📚 GraphQL 的类型系统是如何工作的?🔍 能否举例说明 GraphQL 的类型系统在实际应用中是如何工作的?位置步骤 1: 定义类型步骤 2: 实现解析器步骤 3: 客户端查询步骤 4: 执行查询 🛠️ 在实际开发中&…...

Spring Boot 整合达梦

Maven 依赖 <dependency><groupId>com.dameng</groupId><artifactId>DmJdbcDriver18</artifactId><version>8.1.2.192</version></dependency> yml配置 datasource:master:url: jdbc:dm://192.168.211.113:30236username: WE…...

Vue.js 组件开发基本步骤

Vue.js 是一个构建用户界面的渐进式框架&#xff0c;它被设计为能够轻松地被集成进项目的部分功能&#xff0c;或者用于构建完整的前端应用。组件化是 Vue.js 的核心概念之一&#xff0c;它允许开发者将界面拆分成独立、可复用的组件&#xff0c;每个组件负责应用中的一小部分功…...

博客搭建之路:hexo使用next主题渲染流程图

文章目录 hexo使用next主题渲染流程图 hexo使用next主题渲染流程图 hexo版本5.0.2 npm版本6.14.7 next版本7.8.0 next主题的配置文件中搜索找到mermaid&#xff0c;把enable配置改为true mermaid:enable: true# Available themes: default | dark | forest | neutraltheme: de…...

【数据结构与算法】线性表顺序存储结构

文章目录 一.顺序表的存储结构定义1.1定义1.2 图示1.3结构代码*C语言的内存动态分配 二.顺序表基本运算*参数传递2.1建立2.2初始化(InitList(&L))2.3销毁(DestroyList(&L))2.4判断线性表是否为空表(ListEmpty(L))2.5求线性表的长度(ListLength(L))2.6输出线性表(DispLi…...

Unix Standardization and Implementations

Unix标准化 在Unix未制定较为完备的标准时&#xff0c;各个平台的系统调用方式各异&#xff0c;所开发出的应用程序存在可移植性差的特点&#xff0c;因此人们呼吁指定一套Unix标准来规范接口&#xff0c;增加应用程序的可移植性。所谓Unix标准即适用于Unix环境下的一系列函数…...

Windows 与 Java 环境下的 Redis 利用分析

1 前言 在最近的一次攻防演练中&#xff0c;遇到了两个未授权访问的 Redis 实例。起初以为可以直接利用&#xff0c;但后来发现竟然是Windows Java (Tomcat)。因为网上没有看到相关的利用文章&#xff0c;所以在经过摸索&#xff0c;成功解决之后决定简单写一写。 本文介绍了…...

机器视觉系统硬件组成之工业相机篇

工业相机是一种非常重要的机器视觉器件&#xff0c;它能够将被采集的图像信息通过电路转换成电信号&#xff0c;再通过模数转换器&#xff08;ADC&#xff09;将其转化为数字信号&#xff0c;最后以标准的视频信号输出。工业相机在机器视觉领域得到了广泛应用&#xff0c;包括质…...

离线安装bitnami-gitlab8.8.4+汉化

注意&#xff1a; 常规安装gitlab需要联网&#xff0c;而按装bitnami-gitlab无需联网(bitnami-gitlab用于内网环境无法联网时安装gitlab&#xff0c;两者是一个东西只是名字不一样)bitnami-gitlab-8.8.4版本可以汉化成功新用户注册账户无需激活也可以直接登录&#xff0c;因为…...

亚马逊日本站推出AI日语listing功能,Listing一键发布,轻松无忧!

随着大数据与人工智能技术的成熟&#xff0c;AI在电商的应用也越来越多&#xff0c;各大电商平台都在陆续引进AI人工智能&#xff0c;有客服方面的&#xff0c;也有发布Listing方面的。 10月17日消息&#xff0c;亚马逊日本站近日宣布推出一项支持日语的人工智能listing功能&am…...

Golang | Leetcode Golang题解之第475题供暖器

题目&#xff1a; 题解&#xff1a; func findRadius(houses, heaters []int) (ans int) {sort.Ints(houses)sort.Ints(heaters)j : 0for _, house : range houses {dis : abs(house - heaters[j])for j1 < len(heaters) && abs(house-heaters[j]) > abs(house-…...

【Vue】Vue3.0 (十二)、watchEffect 和watch的区别及使用

上篇文章&#xff1a; 【Vue】Vue3.0 &#xff08;十二&#xff09;、watch对ref定义的基本类型、对象类型&#xff1b;reactive定义的对象类型的监视使用 &#x1f3e1;作者主页&#xff1a;点击&#xff01; &#x1f916;Vue专栏&#xff1a;点击&#xff01; ⏰️创作时间&…...

PHP-laravel框架

laravel框架 laravel 搭建与路由基础 基本路由与视图路由 视图使用控制器模板分配变量...

永恒之蓝漏洞

MS17-010是微软于2017年3月发布的一个安全补丁&#xff0c;旨在修复Windows操作系统中的一个严重漏洞&#xff0c;该漏洞被称为“永恒之蓝”&#xff08;EternalBlue&#xff09;。这个漏洞影响了Windows的Server Message Block&#xff08;SMB&#xff09;协议&#xff0c;允许…...

Eking管理易 Html5Upload 前台任意文件上传漏洞复现

0x01 产品描述&#xff1a; ‌Eking管理易是一款专为广告制品制作企业量身定制的管理软件产品&#xff0c;旨在帮助企业实现规范化、科学化管理&#xff0c;提升运营效率和降低运营成本。‌ 该软件由广州易凯软件技术有限公司开发&#xff0c;基于JAVA企业版技术研发&#xff0…...

spring boot itext7 修改生成文档的作者、制作者、标题,并且读取相关的信息。

1、官方的example文件&#xff1a;iText GitHub itext-java-7.2.5\kernel\src\test\java\com\itextpdf\kernel\pdf\PdfStampingTest.java 2、修改代码&#xff1a; Testpublic void stamping1() throws IOException {String filename1 destinationFolder "stamping1_…...

LeetCode题练习与总结:灯泡开关--319

一、题目描述 初始时有 n 个灯泡处于关闭状态。第一轮&#xff0c;你将会打开所有灯泡。接下来的第二轮&#xff0c;你将会每两个灯泡关闭第二个。 第三轮&#xff0c;你每三个灯泡就切换第三个灯泡的开关&#xff08;即&#xff0c;打开变关闭&#xff0c;关闭变打开&#x…...

ClickFix攻击活动升级:可通过虚假谷歌会议画面传播恶意软件

最近&#xff0c;研究人员报告了一种新的 ClickFix 攻击活动&#xff0c;主要通过诱骗用户访问显示虚假连接错误的欺诈性 谷歌会议的页面&#xff0c;继而借此传播信息窃取恶意软件&#xff0c;主要针对 Windows 和 macOS 操作系统。 ClickFix是网络安全公司Proofpoint在5月份…...

迷茫!能走出迷茫?

我今年40有余&#xff0c;因资质平庸&#xff0c;及特殊的个人经历&#xff0c;仍奋斗在一线。上班近二十年&#xff0c;两件事对我人生走向影响最大&#xff0c;编程和炒股。 下个月要去一家新公司上班。今天算是在现公司工作交接的最后时段。在这家公司干了接近一年&#xff…...

【网络】每天掌握一个Linux命令 - iftop

在Linux系统中&#xff0c;iftop是网络管理的得力助手&#xff0c;能实时监控网络流量、连接情况等&#xff0c;帮助排查网络异常。接下来从多方面详细介绍它。 目录 【网络】每天掌握一个Linux命令 - iftop工具概述安装方式核心功能基础用法进阶操作实战案例面试题场景生产场景…...

Lombok 的 @Data 注解失效,未生成 getter/setter 方法引发的HTTP 406 错误

HTTP 状态码 406 (Not Acceptable) 和 500 (Internal Server Error) 是两类完全不同的错误&#xff0c;它们的含义、原因和解决方法都有显著区别。以下是详细对比&#xff1a; 1. HTTP 406 (Not Acceptable) 含义&#xff1a; 客户端请求的内容类型与服务器支持的内容类型不匹…...

深入理解JavaScript设计模式之单例模式

目录 什么是单例模式为什么需要单例模式常见应用场景包括 单例模式实现透明单例模式实现不透明单例模式用代理实现单例模式javaScript中的单例模式使用命名空间使用闭包封装私有变量 惰性单例通用的惰性单例 结语 什么是单例模式 单例模式&#xff08;Singleton Pattern&#…...

04-初识css

一、css样式引入 1.1.内部样式 <div style"width: 100px;"></div>1.2.外部样式 1.2.1.外部样式1 <style>.aa {width: 100px;} </style> <div class"aa"></div>1.2.2.外部样式2 <!-- rel内表面引入的是style样…...

华为云Flexus+DeepSeek征文|DeepSeek-V3/R1 商用服务开通全流程与本地部署搭建

华为云FlexusDeepSeek征文&#xff5c;DeepSeek-V3/R1 商用服务开通全流程与本地部署搭建 前言 如今大模型其性能出色&#xff0c;华为云 ModelArts Studio_MaaS大模型即服务平台华为云内置了大模型&#xff0c;能助力我们轻松驾驭 DeepSeek-V3/R1&#xff0c;本文中将分享如何…...

selenium学习实战【Python爬虫】

selenium学习实战【Python爬虫】 文章目录 selenium学习实战【Python爬虫】一、声明二、学习目标三、安装依赖3.1 安装selenium库3.2 安装浏览器驱动3.2.1 查看Edge版本3.2.2 驱动安装 四、代码讲解4.1 配置浏览器4.2 加载更多4.3 寻找内容4.4 完整代码 五、报告文件爬取5.1 提…...

如何在最短时间内提升打ctf(web)的水平?

刚刚刷完2遍 bugku 的 web 题&#xff0c;前来答题。 每个人对刷题理解是不同&#xff0c;有的人是看了writeup就等于刷了&#xff0c;有的人是收藏了writeup就等于刷了&#xff0c;有的人是跟着writeup做了一遍就等于刷了&#xff0c;还有的人是独立思考做了一遍就等于刷了。…...

基于Springboot+Vue的办公管理系统

角色&#xff1a; 管理员、员工 技术&#xff1a; 后端: SpringBoot, Vue2, MySQL, Mybatis-Plus 前端: Vue2, Element-UI, Axios, Echarts, Vue-Router 核心功能&#xff1a; 该办公管理系统是一个综合性的企业内部管理平台&#xff0c;旨在提升企业运营效率和员工管理水…...

[ACTF2020 新生赛]Include 1(php://filter伪协议)

题目 做法 启动靶机&#xff0c;点进去 点进去 查看URL&#xff0c;有 ?fileflag.php说明存在文件包含&#xff0c;原理是php://filter 协议 当它与包含函数结合时&#xff0c;php://filter流会被当作php文件执行。 用php://filter加编码&#xff0c;能让PHP把文件内容…...

C语言中提供的第三方库之哈希表实现

一. 简介 前面一篇文章简单学习了C语言中第三方库&#xff08;uthash库&#xff09;提供对哈希表的操作&#xff0c;文章如下&#xff1a; C语言中提供的第三方库uthash常用接口-CSDN博客 本文简单学习一下第三方库 uthash库对哈希表的操作。 二. uthash库哈希表操作示例 u…...