创建对象

//使用对象字面量、构造函数或者Object.create()方法来创建对象// 对象字面量
const person = {name: 'John',age: 30,hobbies: ['reading', 'swimming']
};// 构造函数
function Car(make, model) {this.make = make;this.model = model;
}
const myCar = new Car('Toyota', 'Corolla');// Object.create()
const animal = {speak() {console.log(`${this.name} makes a noise.`);}
};
const dog = Object.create(animal);
dog.name = 'Buddy';

 

访问属性

//访问对象属性有两种方式,分别是点号表示法和方括号表示法
console.log(person.name); // 'John'
console.log(person['age']); // 30// 动态访问
const key = 'hobbies';
console.log(person[key]); // ['reading', 'swimming']

 

修改和添加属性

//可以直接通过赋值来修改或添加对象的属性。person.age = 31; // 修改现有属性
person.city = 'New York'; // 添加新属性
person['isStudent'] = false; // 方括号表示法添加属性

 

删除属性

//使用delete操作符能够删除对象的属性。delete person.hobbies; // 删除hobbies属性
console.log(person.hobbies); // undefined

 

检查属性是否存在

//in操作符和hasOwnProperty()方法可以检查对象是否拥有某个属性console.log('name' in person); // true
console.log(person.hasOwnProperty('city')); // true

 

遍历对象

//使用for...in循环、Object.keys()、Object.values()和Object.entries()来遍历对象// for...in循环
for (const key in person) {console.log(key, person[key]);
}// Object.keys() - 获取所有键
console.log(Object.keys(person)); // ['name', 'age', 'city', 'isStudent']// Object.values() - 获取所有值
console.log(Object.values(person)); // ['John', 31, 'New York', false]// Object.entries() - 获取所有键值对
console.log(Object.entries(person)); 
// [['name', 'John'], ['age', 31], ['city', 'New York'], ['isStudent', false]]

  

冻结对象

//Object.freeze()可以阻止修改对象的属性const frozen = Object.freeze({ x: 5 });
frozen.x = 10; // 操作被忽略(严格模式下会报错)
console.log(frozen.x); // 5

 

密封对象

//Object.seal()允许修改现有属性,但不能添加或删除属性。const sealed = Object.seal({ y: 10 });
sealed.y = 20; // 可以修改
sealed.z = 30; // 无效(严格模式下会报错)
delete sealed.y; // 无效

 

嵌套对象

//对于嵌套对象,可以链式访问和修改属性const user = {profile: {address: {city: 'London'}}
};console.log(user.profile.address.city); // 'London'
user.profile.address.zip = 'SW1A 1AA'; // 添加嵌套属性

 

对象方法

//对象的属性值也可以是函数,这样的属性被称为方法const calculator = {add(a, b) {return a + b;},subtract(a, b) {return a - b;}
};console.log(calculator.add(5, 3)); // 8

 

this关键字

//在对象方法内部,this指向调用该方法的对象const person = {name: 'Alice',greet() {console.log(`Hello, ${this.name}!`);}
};person.greet(); // 'Hello, Alice!'

 

对象的键与值

let obj = { "id": "1", "name": "millia", "color": "red"}/* Object.keys() */
/* 返回一个包含 javascript 对象键的数组如果键是数字,Object.keys() 函数将按排序顺序返回数字键的数组,键值仍将保持与原始 javascript 对象相同的值映射*/
console.log(Object.keys(obj))   
//["id", "name", "color"]/* Object.entries() */
/* 将整个对象拆分为小数组。每个数组由 [key, value] 形式的键值对组成*/
console.log(Object.entries(obj))
//0: (2) ['id', '1']
//1: (2) ['name', 'millia']
//2: (2) ['color', 'red']console.log(JSON.stringify(Object.entries(obj)))   
//[["id","1"],["name","millia"],["color","red"]]for (const [key, value] of Object.entries(obj)) {console.log(`${key}: ${value}`);
}
//id: 1
//name: millia
//color: red/*for 循环*/
for(let i in obj) {console.log(i) // 键console.log(obj[i]) //值
}
// id
// 1
// name
// millia
// color
// red/* Object.values() */
/* 静态方法返回一个给定对象的自有可枚举字符串键属性值组成的数组 */
console.log(Object.values(obj))
//['1', 'millia', 'red']

 

对象的合并

/* Object.assign(target,...sources) */
/* target 需要应用源对象属性的目标对象,修改后将作为返回值sources 一个或多个包含要应用的属性的源对象注意target对象有值还是空值{} */
let target = { a: 1, b: 2 }
let source = { b: 4, c: 5 }
console.log(Object.assign({},target, source),target,source)
//{a: 1, b: 4, c: 5} {a: 1, b: 2} {b: 4, c: 5}
console.log(target,Object.assign(target, source))
//{a: 1, b: 4, c: 5} {a: 1, b: 4, c: 5}/* 展开运算符... 解构赋值 */
/* 可以在函数调用/数组构造时,将数组表达式或者 string 在语法层面展开;还可以在构造字面量对象时,将对象表达式按 key-value 的方式展开。(注: 字面量一般指 [1, 2, 3] 或者 {name: "mdn"} 这种简洁的构造方式) 函数调用:myFunction(...iterableObj)字面量数组构造或字符串:[...iterableObj, '4', ...'hello', 6]构造字面量对象,进行克隆或者属性拷贝:let objClone = { ...obj }
*/
const obj1 = { a: 1, b: 2 }
const obj2 = { b: 3, c: 4 }
const obj3 = { ...obj1, ...obj2 }
console.log(obj3)
// { a: 1, b: 3, c: 4 }

 

对象的去重

//基于单个属性去重使用Array.reduce()或者Map来实现
const people = [{ id: 1, name: 'Alice' },{ id: 2, name: 'Bob' },{ id: 1, name: 'Charlie' } // 重复id
];// 使用Map
const uniqueById = [...new Map(people.map(person => [person.id, person])).values()];
console.log(uniqueById); // [{ id: 1, name: 'Alice' }, { id: 2, name: 'Bob' }]// 等效方法(使用reduce)
const uniqueById2 = people.reduce((acc, current) => {const x = acc.find(item => item.id === current.id);if (!x) {return acc.concat([current]);} else {return acc;}
}, []);//深度比较对象去重,当需要比较对象的所有属性是否都相同时,可以使用JSON.stringify()或者自定义比较函数。不过要注意,JSON.stringify()有局限性,比如它无法处理函数、undefined或者循环引用的情况。
const users = [{ id: 1, name: 'Alice' },{ id: 2, name: 'Bob' },{ name: 'Alice', id: 1 } // 属性顺序不同,但内容相同
];// 使用JSON.stringify()(简单但有局限性)
const uniqueByStringify = [...new Set(users.map(user => JSON.stringify(user)))].map(str => JSON.parse(str));
console.log(uniqueByStringify); // 去重成功// 自定义深度比较函数
function isEqual(obj1, obj2) {if (obj1 === obj2) return true;if (typeof obj1 !== 'object' || obj1 === null || typeof obj2 !== 'object' || obj2 === null) return false;const keys1 = Object.keys(obj1);const keys2 = Object.keys(obj2);if (keys1.length !== keys2.length) return false;for (const key of keys1) {if (!obj2.hasOwnProperty(key) || !isEqual(obj1[key], obj2[key])) return false;}return true;
}const uniqueByDeepCompare = users.filter((current, index, self) => self.findIndex(item => isEqual(item, current)) === index
);//处理嵌套对象,如果对象包含嵌套结构,去重会更复杂一些,需要递归比较所有层级的属性。
const items = [{ id: 1, details: { age: 30 } },{ id: 2, details: { age: 25 } },{ id: 1, details: { age: 30 } } // 完全重复
];// 自定义深度比较(支持嵌套对象)
function deepCompare(obj1, obj2) {if (obj1 === obj2) return true;if (typeof obj1 !== 'object' || obj1 === null || typeof obj2 !== 'object' || obj2 === null) return false;const keys1 = Object.keys(obj1);const keys2 = Object.keys(obj2);if (keys1.length !== keys2.length) return false;for (const key of keys1) {if (obj1[key] instanceof Date && obj2[key] instanceof Date) {if (obj1[key].getTime() !== obj2[key].getTime()) return false;} else if (!deepCompare(obj1[key], obj2[key])) {return false;}}return true;
}const uniqueItems = items.filter((current, index, self) => self.findIndex(item => deepCompare(item, current)) === index
);//基于多个属性去重,当需要根据对象的多个属性组合来判断是否重复时,可以这样实现。
const products = [{ name: 'Apple', category: 'Fruit' },{ name: 'Banana', category: 'Fruit' },{ name: 'Apple', category: 'Fruit' } // 重复组合
];const uniqueProducts = products.reduce((acc, current) => {const key = `${current.name}-${current.category}`;const isDuplicate = acc.some(item => `${item.name}-${item.category}` === key);if (!isDuplicate) {acc.push(current);}return acc;
}, []);

去重方法选择建议

  • 基于单个属性去重:推荐使用Map,因为它的时间复杂度是 O (n),效率较高。
  • 深度比较去重:如果对象结构简单,可以使用JSON.stringify();如果对象结构复杂,建议使用自定义比较函数或者 Lodash。
  • 性能考虑:对于大型数组,使用Map或者Set的方法性能更好,因为它们的查找效率比Array.find()更高。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如若转载,请注明出处:http://www.pswp.cn/diannao/89266.shtml
繁体地址,请注明出处:http://hk.pswp.cn/diannao/89266.shtml
英文地址,请注明出处:http://en.pswp.cn/diannao/89266.shtml

如若内容造成侵权/违法违规/事实不符,请联系英文站点网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Java面试宝典:基础一

⚙️ 1. Java跨平台原理(字节码文件与JVM) 核心机制: Java源程序(.java)编译为与平台无关的字节码文件(.class),而非直接生成机器码。字节码由**Java虚拟机(JVM&#xf…

uniapp微信小程序:editor组件placeholder字体样式修改

一、问题描述 微信小程序editor组件的placeholder字体默认为斜体字,官方对此没有属性可以设置它的样式,并且直接在组件上设置样式也是无效的。 二、解决方案 通过审查节点: 可以看到editor的placeholder其实是在一个伪元素上。 在页面或者…

PhoneRescue 4.3绿色版!解决iPhone数据丢失、系统崩溃等场景

目录 一、引言二、软件介绍1. 研发背景与定位2. 兼容性与技术优势 三、功能介绍1. 数据恢复功能(核心痛点解决方案)2. 系统修复功能3. 数据管理辅助 四、软件特色1. 操作极简,零技术门槛2. 安全可靠,零数据风险3. 高效精准&#x…

Vue 快速入门

一、Vue是什么 Vue是一款用于构建用户界面的渐进式的JavaScript框架。 官网:Vue.js - 渐进式 JavaScript 框架 | Vue.js 其核心特性包括: 响应式数据绑定:通过 Vue 的响应式系统,数据变化会自动反映到视图,减少手动 D…

JAVA-JWT

JWT简介 JSON Web Token(JWT)是一个非常轻巧的规范,这个规范允许我们使用 JWT 在用户和服务器之间传递安全可靠的信息。一个 JWT 实际上就是一个字符串,它由三部分组成,头部、载荷与签名。前两部分需要经过 Base64 编…

UI前端大数据处理挑战与对策:保障数据安全与隐私

hello宝子们...我们是艾斯视觉擅长ui设计、前端开发、数字孪生、大数据、三维建模、三维动画10年经验!希望我的分享能帮助到您!如需帮助可以评论关注私信我们一起探讨!致敬感谢感恩! 一、引言:大数据时代的前端安全新挑战 在数字化转型的浪潮中,前端已从…

DTO、VO、POJO与实体类使用方案(结合Mapper.xml)

结合MyBatis的Mapper.xml文件,展示完整的层级数据流转和数据库操作。 1. 实体类优化(Entity) // User.java Data NoArgsConstructor AllArgsConstructor TableName("sys_user") public class User {TableId(type IdType.AUTO)pr…

开源|VDBBench 1.0正式官宣,完全复刻业务场景,支持用户自定义数据集

宣布个好消息,大家期待已久的VDBBench 1.0更新啦。 尝鲜链接: https://github.com/zilliztech/VectorDBBench/releases/tag/v1.0.0 对于这个功能的更新,我们准备了很久,也思考了很多。 因为对我们来说,VDBBench 从来不…

7,FreeRTOS列表与列表项的插入删除

一、实验目标 创建三个动态任务,栈空间大小均为128字。startTask、Task1、Task2。startTask仅运行一次,负责task1、task2任务的创建,startTask任务的删除。Task1负责初始化列表、列表项123,并进行列表项的插入实验与删除实验。Tas…

两款支持3D地图的WebGIS框架对比

前言 在当前的WebGIS技术发展中,3D地形图的可视化已经成为一个非常重要的功能,尤其是在城市规划、环境监测和虚拟旅游等领域中的应用。对于开发者而言,选择一个强大且适合的WebGIS框架是实现这些功能的关键。目前市场上较为流行的支持3D地形…

Github 2025-06-26 Go开源项目日报Top10

根据Github Trendings的统计,今日(2025-06-26统计)共有10个项目上榜。根据开发语言中项目的数量,汇总情况如下: 开发语言项目数量Go项目10PureBasic项目1使用Gitleaks保护和发现机密信息 创建周期:2203 天开发语言:Go协议类型:MIT LicenseStar数量:14645 个Fork数量:13…

C++实现鱿鱼、羊了个羊、扫雷、原神模拟

C++ 鱿鱼游戏模拟实现 鱿鱼游戏中的经典场景可以通过C++模拟实现,例如“红绿灯”游戏。以下是一个简化版本的核心代码框架: #include <iostream> #include <thread> #include <chrono> #include <cstdlib> #include <ctime> #include <ve…

从用户到权限:解密 AWS IAM Identity Center 的授权之道

大家好&#xff0c;今天我们来解决一个非常具体的实战问题&#xff1a;如何让 IAM Identity Center 中创建的用户真正获得 AWS 账户的操作权限&#xff0c;从而取代老旧的 IAM 用户管理模式&#xff1f; 如果我们盯着用户详情页&#xff0c;想找一个“附加角色”的按钮&#x…

在 Spring Boot 中使用 MyBatis-Plus 的详细教程

前言 在现代的 Java Web 开发中&#xff0c;Spring Boot 和 MyBatis 已经成为主流框架组合。为了提升开发效率和简化数据库操作&#xff0c;MyBatis-Plus&#xff08;简称 MP&#xff09;应运而生。它是一个 MyBatis 的增强工具&#xff0c;在 MyBatis 的基础上只做增强不做改…

AI生成内容泛滥时代:从“袋鼠登机“视频看AI鉴伪与游戏智能的未来

近年来&#xff0c;AI生成内容的质量突飞猛进&#xff0c;从文本到图像再到视频&#xff0c;几乎达到了以假乱真的程度。近期一段"人类在飞机上吵架看呆袋鼠"的视频在社交网络疯传&#xff0c;获得数千万次观看后&#xff0c;才被证实是AI生成内容&#xff0c;这一事…

为什么在linux中不能直接使用pip进行安装

您好&#xff0c;这是一个非常深刻且关键的问题&#xff0c;触及了 Linux 系统管理与 Python 开发实践的核心原则。理解了这一点&#xff0c;您就真正开始像一位经验丰富的开发者那样思考了。 简单来说&#xff0c;答案是&#xff1a;为了保护操作系统自身的稳定和完整性。 让…

IDEA相关配置记录

IDEA相关配置记录 参考链接&#xff1a; 参考链接&#xff1a; 1、安装jdk D:\Program Files\Java\jdk-21 https://blog.csdn.net/2302_81410974/article/details/142031416 2、安装maven D:\Java\workspace-maven\apache-maven-3.9.10 . ├── LICENSE ├── NOTICE ├──…

FastGPT私有化部署完整指南

&#x1f680; FastGPT 私有化部署完整指南 &#x1f4cb; 环境要求 硬件要求 最低配置:CPU: 4核内存: 8GB存储: 50GB网络: 稳定互联网连接推荐配置:CPU: 8核内存: 16GB存储: 100GB SSD网络: 10Mbps带宽软件环境 必需软件:- Docker: > 20.10.0- Docker Compose: > 2.…

系统架构设计师论文分享-基于架构的软件设计方法及应用

我的软考历程 摘要 2023年2月&#xff0c;我所在的公司做了开发纱线MES系统的决定&#xff0c;该系统为国内纱线工厂提供SAAS服务&#xff0c;旨在提高纱线工厂的智能化和数字化水平。我在该项目中被任命为系统架构设计师&#xff0c;全面掌管该项目的架构设计工作。本文将结…

团结引擎发布纯鸿蒙应用

大家好&#xff0c;我是阿赵。   这里尝试一下用团结引擎发布纯鸿蒙系统的应用。 一、 安装鸿蒙系统发布需要的组件 在团结引擎的Hub里面找到Add modules: 然后找到OpenHarmony的支持选项&#xff0c;由于我已经安装过了&#xff0c;所以会显示Installed&#xff0c;如果没…