博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
JavaScript中的getOwnPropertyDescriptors方法
阅读量:2507 次
发布时间:2019-05-11

本文共 4364 字,大约阅读时间需要 14 分钟。

One of the new feature from the specification for JavaScript is the getOwnPropertyDescriptors method. In a nutshell, this method returns the information for all properties of the given object including the information about getters and setters. It allow us to create copies of objects and clone it while copying all properties, including the getters and setters.

规范JavaScript的新功能之一是getOwnPropertyDescriptors方法。 简而言之,此方法返回给定对象的所有属性的信息,包括有关getter和setter的信息。 它允许我们创建对象的副本并在复制所有属性(包括getter和setter)时克隆它。

In JavaScript, we can create special properties that behave as methods inside the object and behave as a property outside of it. They are called get and set.

在JavaScript中,我们可以创建特殊属性,这些属性充当对象内部的方法,并充当对象外部的属性。 它们称为getset

// object with get and set propertiesconst gator = {  name: 'Ben',  type: 'reptilian',  get fullName(){    return `${this.name}${this.type}`;  },  set gatorName(name){    this.name = name;  }};

If we do console.log(gator) we’ll get only the name and the type. Yet, we still have the access to the getter fullName, despite the fact it’s not visible in the console.

如果我们执行console.log(gator)我们将只获得名称和类型。 但是,尽管它在控制台中不可见,但我们仍然可以访问getter fullName。

console.log(gator)      // {name: 'Ben',  type: 'reptilian',}console.log(gator.fullName) // 'Benreptilian'

Notice we call the getter like it was a usual property, not a method.

注意,我们将getter称为普通属性,而不是方法。

克隆对象 (Cloning Objects)

We use Object.assign() to clone objects in javaScript. If you’re not familiar with the Object.assign method, please read the in JavaScript. The main issue with this method is when we clone objects the result is not exactly as we’re expecting. The method is not working with getters and setters.

我们使用Object.assign()在javaScript中克隆对象。 如果您不熟悉Object.assign方法,请阅读在JavaScript中的 。 这种方法的主要问题是,当我们克隆对象时,结果与我们期望的并不完全相同。 该方法不适用于getter和setter。

const cayman = {Object.assign({}, gator};console.log(cayman)         // {name: 'Ben',  type: 'reptilian', fullName: Benreptilian, gatorName: undefined }

So the getter and setter became usual values. And if getter is a countered value, the setter will be undefined.

因此,getter和setter成为常规值。 如果getter是一个计数器值,则setter将是未定义的。

Let’s clone the object with the getOwnPropertyDescriptors method instead.

让我们使用getOwnPropertyDescriptors方法克隆对象。

const crocodilian = Object.defineProperties({}, Object.getOwnPropertyDescriptors(gator)));

And now let’s compare the descriptors of each object we have:

现在让我们比较一下我们拥有的每个对象的描述符:

console.log(Object.getOwnPropertyDescriptors(gator));/*  name: {value:'Ben', writable: true, enumerable: true, configurable: true},    type: {value:'reptilian', writable: true, enumerable: true, configurable: true},    fullName: {get: f, set: undefined, enumerable: '', configurable: ''},    gatorName: {get: undefined, set: f, enumerable: '', configurable: ''},        */console.log(Object.getOwnPropertyDescriptors(cayman));/*  name: {value:'Ben', writable: true, enumerable: true, configurable: true},    type: {value:'reptilian', writable: true, enumerable: true, configurable: true},    fullName: {value: 'Benreptilian', writable: true, enumerable: '', configurable: ''},    gatorName: {value: undefined, writable: true, enumerable: '', configurable: ''},        */console.log(Object.getOwnPropertyDescriptors(crocodilian));/*  name: {value:'Ben', writable: true, enumerable: true, configurable: true},    type: {value:'reptilian', writable: true, enumerable: true, configurable: true},    fullName: {get: f, set: undefined, enumerable: '', configurable: ''},    gatorName: {get: undefined, set: f, enumerable: '', configurable: ''},        */

gator’s object properties name and type are defined as usual properties, but fullName and gatorName are defined as getter and setter. They have no value field, but have get and set fields. cayman’s object getter and setter are described now as usual values. And with the crocodilian object we manage to save its getters and setters, thanks to getOwnPropertyDescriptors.

gator的对象属性nametype定义为常规属性,而fullName和gatorName定义为getter和setter。 他们没有value字段,但是有getset字段。 cayman的对象获取器和设置器现在作为常规值进行描述。 通过使用getOwnPropertyDescriptors ,我们可以使用crocodilian对象保存其getter和setter。

The getOwnPropertyDescriptors method helps to avoid data loss and with it we can create deep copies of objects without relying on another utility function.

getOwnPropertyDescriptors方法有助于避免数据丢失,有了它,我们可以创建对象的深层副本,而无需依赖其他实用程序功能。

翻译自:

转载地址:http://iihgb.baihongyu.com/

你可能感兴趣的文章
codevs 1163:访问艺术馆
查看>>
冲刺Noip2017模拟赛3 解题报告——五十岚芒果酱
查看>>
并查集
查看>>
sessionStorage
查看>>
代码示例_进程
查看>>
Java中关键词之this,super的使用
查看>>
人工智能暑期课程实践项目——智能家居控制(一)
查看>>
前端数据可视化插件(二)图谱
查看>>
kafka web端管理工具 kafka-manager【转发】
查看>>
获取控制台窗口句柄GetConsoleWindow
查看>>
Linux下Qt+CUDA调试并运行
查看>>
51nod 1197 字符串的数量 V2(矩阵快速幂+数论?)
查看>>
OKMX6Q在ltib生成的rootfs基础上制作带QT库的根文件系统
查看>>
zabbix
查看>>
多线程基础
查看>>
完美解决 error C2220: warning treated as error - no ‘object’ file generated
查看>>
使用SQL*PLUS,构建完美excel或html输出
查看>>
SQL Server数据库笔记
查看>>
X-Forwarded-For伪造及防御
查看>>
android系统平台显示驱动开发简要:LCD驱动调试篇『四』
查看>>