ES5 和 ES6 对象的操作方法

在 JavaScript 中,对象是非常重要的数据结构,提供了许多方法来进行操作。以下是对 ES5 和 ES6 中对象的常用操作方法的详细介绍。

目录

一、ES5 对象方法

1. 创建对象

2. 访问和修改属性

3. 遍历对象的属性

二、ES6 对象方法

1. 对象字面量简写

2. 对象解构赋值

3. 扩展运算符

4. Object.assign()

5. Object.is()

6. Object.setPrototypeOf()

7. Object.getPrototypeOf()

8. Object.freeze()

9. Object.seal()


一、ES5 对象方法

1. 创建对象
  • 对象字面量

    var person = {
      name: 'Alice',
      age: 25
    };
    
  • 使用 new Object()

    var person = new Object();
    person.name = 'Alice';
    person.age = 25;
    
2. 访问和修改属性
  • 访问属性

    var name = person.name; // 'Alice'
    var age = person['age']; // 25
    
  • 修改属性

    person.age = 30; // 修改年龄
    person['name'] = 'Bob'; // 更改名字
    
  • 添加新属性

    person.gender = 'female'; // 添加性别属性
    
  • 删除属性

    delete person.age; // 删除年龄属性
    
3. 遍历对象的属性
  • for...in 循环:用于遍历对象的可枚举属性。

    for (var key in person) {
      console.log(key + ': ' + person[key]);
    }
    
  • Object.keys(obj):返回一个包含对象所有可枚举属性名称的数组。

    var keys = Object.keys(person); // ['name', 'gender']
    
  • Object.values(obj):返回一个包含对象所有可枚举属性值的数组。

    var values = Object.values(person); // ['Bob', 'female']
    
  • Object.entries(obj):返回一个数组,其中每个元素是一个由对象自身可枚举属性的键值对数组。

    var entries = Object.entries(person); // [['name', 'Bob'], ['gender', 'female']]
    

二、ES6 对象方法

ES6 引入了一些新的语法和方法,增强了对对象的操作。

1. 对象字面量简写
  • 属性和方法的简写
    var name = 'Alice';
    var age = 25;
    
    var person = {
      name,
      age,
      greet() {
        console.log('Hello, ' + this.name);
      }
    };
    
2. 对象解构赋值
  • 解构赋值
    var person = { name: 'Alice', age: 25 };
    
    // 使用解构赋值提取属性
    var { name, age } = person;
    console.log(name); // 'Alice'
    
3. 扩展运算符
  • 对象合并
    var person = { name: 'Alice' };
    var age = { age: 25 };
    var user = { ...person, ...age }; // { name: 'Alice', age: 25 }
    
4. Object.assign()
  • 对象合并和克隆
    var target = { a: 1 };
    var source = { b: 2, c: 3 };
    
    Object.assign(target, source); // target 变为 { a: 1, b: 2, c: 3 }
    
5. Object.is()
  • 比较两个值是否相同
    Object.is(NaN, NaN); // true
    Object.is('foo', 'foo'); // true
    
6. Object.setPrototypeOf()
  • 设置对象的原型
    var proto = { greet: function() { console.log('Hello!'); } };
    var obj = {};
    Object.setPrototypeOf(obj, proto);
    obj.greet(); // 'Hello!'
    
7. Object.getPrototypeOf()
  • 获取对象的原型
    var proto = {};
    var obj = Object.create(proto);
    console.log(Object.getPrototypeOf(obj) === proto); // true
    
8. Object.freeze()
  • 冻结对象,防止其被修改
    var obj = { name: 'Alice' };
    Object.freeze(obj);
    obj.name = 'Bob'; // 无效:无法修改
    
9. Object.seal()
  • 密封对象,防止添加新属性
    var obj = { name: 'Alice' };
    Object.seal(obj);
    obj.age = 25; // 无效:无法添加新属性
    

总结

在 ES5 和 ES6 中,JavaScript 提供了丰富的方法来创建、访问、修改和操作对象。掌握这些方法可以帮助你更有效地管理和处理数据。如果你有具体方法的使用问题,欢迎随时询问!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/914587.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

minio 分布式

方案设计 需要5台服务器,一台nginx用作分发请求,4台minio服务器,每个minio服务器上至少2个盘。在这个方法中,我使用了lvm的缓存,在同种固态盘的情况下,可以使读性能提高数倍到十倍,使写性能提高…

kettle开发-Day43-数据对比

前言: 随着数字化的深入,各种系统及烟囱的建立,各系统之间的架构和数据存储方式不同,导致做数据仓库或数据湖时发现,因自建的系统或者非标准化的系统经常存在物理删除而不是软删除。这就延伸出一个问题,经常…

vscode中执行git合并操作需要输入合并commit信息,打开的nano小型文本编辑器说明-

1.前提: VScode中的git组件执行任何合并动作的时候需要提交远程合并的commit信息,然后编辑器自动打开的是nano文本编辑器 2.nano编辑器说明: 1.保存文件:按 Ctrl O,然后按 Enter 来保存文件。 2.退出编辑器&#xf…

Android音视频直播低延迟探究之:WLAN低延迟模式

Android WLAN低延迟模式 Android WLAN低延迟模式是 Android 10 引入的一种功能,允许对延迟敏感的应用将 Wi-Fi 配置为低延迟模式,以减少网络延迟,启动条件如下: Wi-Fi 已启用且设备可以访问互联网。应用已创建并获得 Wi-Fi 锁&a…

如何详细查询全球药品研发的进度信息?

药品的研发进展对于医药研发人员来说,不仅是知识和技能的积累,更是职业精神和价值观的塑造。通过了解药品的研发进展,研发人员可以更好地提高自己的专业知识和技能,激发创新思维,保持专业竞争力,提高研发效…

摄像机视频分析软件下载LiteAIServer视频智能分析软件抖动检测的技术实现

在现代社会中,视频监控系统扮演着至关重要的角色,其可靠性和有效性在很大程度上取决于视频质量。然而,由于多种因素,如摄像机安装不当、外部环境振动或视频信号传输的不稳定,视频画面常常出现抖动问题,这不…

Jmeter中的监听器(一)

监听器 1--查看结果树 用途 调试测试计划:查看每个请求的详细信息,帮助调试和修正测试计划。分析响应数据:查看服务器返回的响应数据,验证请求是否成功。检查错误:识别和分析请求失败的原因。 配置步骤 添加查看结果…

PaaS云原生:分布式集群中如何构建自动化压测工具

场景 测试环境中,压测常常依赖环境中的各种工具获取基础信息,而这些工具可能集中在某个中控机上,此时想打造的自动化工具的运行模式是: 通过中控机工具获取压测所需的基本信息在中控机部署压测工具,实际压测任务分发…

数据结构-递归函数的调用栈过程

这道题考察的是递归函数的调用栈过程。 逐步分析程序的执行过程: main() 函数首先被调用,此时栈底是 main() 的信息。main() 函数调用 S(1),此时 S(1) 的信息被压入栈中,位于 main() 之上。S(1) 函数内部调用 S(0),因…

华为OD机试 - 芯片资源限制(Python/JS/C/C++ 2024 C卷 100分)

华为OD机试 2024E卷题库疯狂收录中,刷题点这里 专栏导读 本专栏收录于《华为OD机试真题(Python/JS/C/C)》。 刷的越多,抽中的概率越大,私信哪吒,备注华为OD,加入华为OD刷题交流群,…

基于 Python 的 Django 框架开发的电影推荐系统

项目简介:本项目是基于 Python 的 Django 框架开发的电影推荐系统,主要功能包括: 电影信息爬取:获取并更新电影数据。数据展示:提供电影数据的列表展示。推荐系统:基于协同过滤算法实现个性化推荐。用户系…

使用 Web Search 插件扩展 GitHub Copilot 问答

GitHub Copilot 是一个由 GitHub 和 OpenAI 合作开发的人工智能代码提示工具。它可以根据上下文提示代码,还可以回答各种技术相关的问题。但是 Copilot 本身不能回答非技术类型的问题。为了扩展 Copilot 的功能,微软发布了一个名为 Web Search 的插件&am…

Sorting 排序

Goto Data Grid 数据网格 Sorting 排序 Sort Data 对数据进行排序 默认情况下,最终用户可以按任何列对数据进行排序,但具有 MemoExEdit、ImageEdit 和 PictureEdit 就地编辑器的列除外。在运行时,单击列标题一次可对数据进行升序排序。后续…

【笔记】Springboo项目启动失败

application run failed org.springframework.beans.factory.BeanDefinitionStoreException: Invalid bean definition with name adviceMapper defined in file 原因是mybatisplus和springboot的版本不匹配 修改后: springboot mybatisplus 成功

力扣 LeetCode 242. 有效的字母异位词(Day3:哈希表)

解题思路: 哈希表三种数据结构的选择 1. 数组:适用于数据量小的情况 2. set:适用于数据量大的情况 3. map:适用于key-value 什么时候用哈希表? 给你一个元素,判断该元素在这个集合里是否出现过 本题使…

项目财务管理软件有哪些优势?8款工具解析

本文分享的8款项目财务管理工具包括:1.PingCode;2.Worktile;3.用友U8;4.金蝶K3;5.泛微e-cology;6.明源云;7.Microsoft Project;8.QuickBooks。 在众多项目财务管理工具中挑选合适的一款&#xf…

sqoop import将Oracle数据加载至hive,数据量变少,只能导入一个mapper的数据量

sqoop脚本如下: sqoop import -D mapred.job.queue.namehighway \ -D mapreduce.map.memory.mb4096 \ -D mapreduce.map.java.opts-Xmx3072m \ --connect "jdbc:oracle:thin://1.2.3.4.5:61521/LZY2" \ --username root \ --password 123456 \ --query &…

k8clone二进制工具迁移k8s中的无状态应用

1 概述 k8clone是一个简便的Kubernetes元数据克隆工具,它可以将Kubernetes元数据(对象)保存为本地压缩包,在恢复时可将这些元数据恢复到目标集群中(已存在的资源不会被覆盖)。它不依赖远程存储&#xff0c…

100+SCI科研绘图系列教程(R和python)

科研绘图系列:箱线图加百分比点图展示组间差异-CSDN博客科研绘图系列:箱线图加蜜蜂图展示组间数据分布-CSDN博客科研绘图系列:小提琴图和双侧小提琴图展示组间差异-CSDN博客科研绘图系列:组间差异的STAMP图的ggplot2实现-CSDN博客…

小程序如何完成订阅

小程序如何完成订阅 参考相关文档实践问题处理授权弹窗不再触发引导用户重新授权 参考相关文档 微信小程序实现订阅消息推送的实现步骤 发送订阅消息 小程序订阅消息(用户通过弹窗订阅)开发指南 实践 我们需要先选这一个模板,具体流程参考…