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

ES6中对象新增了哪些扩展?

一、属性的简写

当对象字面量的属性名与变量名相同时,可以省略属性名,直接使用变量名作为属性名。

const x = 10;
const y = 20;// ES6之前
const obj1 = { x: x, y: y };// ES6属性简写
const obj2 = { x, y };

注意:简写的对象方法不能用作构造函数,否则会报错

二、方法简写

在对象字面量中定义方法时,可以省略冒号和 function 关键字。

// ES6之前
const obj1 = {method: function() {// 方法内容}
};// ES6方法简写
const obj2 = {method() {// 方法内容}
};

三、计算属性名

在对象字面量中,可以使用计算表达式来定义属性名。

const prefix = "foo";
const obj = {[prefix + "Bar"]: 42
};console.log(obj.fooBar); // 输出 42

四、对象解构赋值

可以从对象中提取属性并赋值给变量。

const obj = { x: 10, y: 20 };const { x, y } = obj;console.log(x, y); // 输出 10 20

五、Object.assign 方法

用于将一个或多个源对象的属性复制到目标对象。

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

六、Object.keys、Object.values 和 Object.entries

这些静态方法用于获取对象的键、值和键值对的数组。

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

ES6中属性的遍历

ES6 一共有 5 种方法可以遍历对象的属性。

  • for…in:循环遍历对象自身的和继承的可枚举属性(不含 Symbol 属性)

  • Object.keys(obj):返回一个数组,包括对象自身的(不含继承的)所有可枚举属性(不含 Symbol 属性)的键名

  • Object.getOwnPropertyNames(obj):回一个数组,包含对象自身的所有属性(不含 Symbol 属性,但是包括不可枚举属性)的键名

  • Object.getOwnPropertySymbols(obj):返回一个数组,包含对象自身的所有 Symbol 属性的键名

  • Reflect.ownKeys(obj):返回一个数组,包含对象自身的(不含继承的)所有键名,不管键名是 Symbol 或字符串,也不管是否可枚举

上述遍历,都遵守同样的属性遍历的次序规则:

  • 首先遍历所有数值键,按照数值升序排列
  • 其次遍历所有字符串键,按照加入时间升序排列
  • 最后遍历所有 Symbol 键,按照加入时间升序排

对象新增的方法

  1. Object.assign(target, …sources):该方法用于将一个或多个源对象的属性复制到目标对象中,并返回目标对象。如果有相同的属性名,后续的源对象会覆盖前面的源对象的属性值。
const target = { a: 1 };
const source = { b: 2, c: 3 };const result = Object.assign(target, source);
console.log(result);
// 输出:{ a: 1, b: 2, c: 3 }
  1. Object.keys(obj):该方法返回一个由目标对象的可枚举属性的键组成的数组。
const obj = { a: 1, b: 2, c: 3 };
const keys = Object.keys(obj);console.log(keys);
// 输出:['a', 'b', 'c']
  1. Object.values(obj):该方法返回一个由目标对象的可枚举属性的值组成的数组。
const obj = { a: 1, b: 2, c: 3 };
const values = Object.values(obj);console.log(values);
// 输出:[1, 2, 3]
  1. Object.entries(obj):该方法返回一个由目标对象的可枚举属性的键值对组成的数组(二维数组)。
const obj = { a: 1, b: 2, c: 3 };
const entries = Object.entries(obj);console.log(entries);
// 输出:[['a', 1], ['b', 2], ['c', 3]]
  1. Object.fromEntries(entries):该方法将一个由键值对组成的数组(二维数组)转换为一个对象。
const entries = [['a', 1], ['b', 2], ['c', 3]];
const obj = Object.fromEntries(entries);console.log(obj);
// 输出:{ a: 1, b: 2, c: 3 }
  1. Object.create(proto, propertiesObject):该方法创建一个新对象,使用现有的对象作为新对象的原型,并可以可选地传入属性描述符来定义新对象的属性。可以实现对象的继承。
const parent = {sayHello() {console.log('Hello');}
};const child = Object.create(parent, {name: {value: 'Alice',writable: true,enumerable: true,configurable: true}
});console.log(child.name);
child.sayHello(); // 输出:Hello
http://www.lryc.cn/news/177540.html

相关文章:

  • 蓝桥杯每日一题2023.9.22
  • vscode左键无法跳转到定义的文件
  • c、c++排序的相关知识(归并排序、计数排序、稳定性等)
  • oracle定时任务的使用
  • VSCode 配置 Lua 开发环境(清晰明了)
  • JS合并2个远程pdf
  • TikTok的伦理挑战:虚拟世界与现实世界的交汇
  • C# 获取磁盘空间大小的方法
  • JVM机制理解与调优方案
  • Django的设计模式及模板层
  • 写代码生成流程图
  • python reportlab生成pdf
  • 第一次作业题解
  • 美篇作文网教学资源源码-自带作文数据
  • 电脑软件:Duplicate Cleaner Pro 5.16 重复文件清理软件(附下载)
  • 支持笔记本电脑直插直充,TOWE 65W智能快充PDU超级插座
  • 部署Kafka
  • Open3D 进阶(11)使用GMM-Tree算法对点云配准
  • 算法刷题注意事项
  • 搭建自己的pypi服务器
  • ndoe.js、npm相关笔记
  • 如何使用ArcGIS Pro制作标准地图样式国界
  • 基于数学模型水动力模拟、水质建模、复杂河网构建技术在环境影响评价、入河排污口论证及防洪评价中的应用
  • 每天学习3个小时能不能考上浙大MBA项目?
  • NVM的下载安装和使用
  • iOS 视频压缩 mov转mp4 码率
  • 基于Esp32-cam在无外部 PIR 传感器情况下实现运动检测(一)
  • 安卓recovery流程分析(编译、界面、图片)
  • 唤醒手腕 2023年 B 站课程 Golang 语言详细教程笔记(更新中)
  • Qt获取屏幕(桌面)的大小或分辨率