简单的JavaScript部分:对象属性描述符

智能甄选 2018-02-12 13:27:24

在这篇文章中,您将学习如何创建只读属性,不可数属性,不可配置属性以及如何确定属性是否不可读。

在JavaScript中,您可以创建一个对象字面值,如下所示:

var cat = { name: 'foo', age: 9};

乍一看,它看起来像对象猫有两个字符串和数字值的属性。然而,这不仅仅是JavaScript解释器。在ES5中,介绍了属性描述符的概念。在我们继续讨论属性描述符之前,让我们试着回答几个问题:

如何创建只读属性?

我如何做一个不可估量的财产?

我如何使财产不可配置?

我如何确定一个属性是否是只读的?

当你理解属性描述符时,你可以回答所有这些问题。

我们来考虑下面的代码:

var cat = {    name: 'foo',    age: 9};var a = Object.getOwnPropertyDescriptor(cat, 'name');console.log(a)

在这里,你的输出将如下所示:

正如你在这里看到的,一个属性有四个特征:

该值保存属性的数据,而可写,可枚举和可配置则描述属性的其他特征。让我们仔细看看这篇文章其余部分的每一个特征。

可写

是否可以改变财产的价值是由可写性决定的。如果writable设置为false,那么属性的值不能被改变,JavaScript将忽略属性值的任何改变。考虑下面的代码:

var cat = {    name: 'foo',    age: 9};Object.defineProperty(cat, 'name', { writable: false });console.log(cat.name); // foo cat.name = "koo"; // JavaScript will ignore it as writable is set to false console.log(cat.name); // foo

您可以使用Object.defineProperty更改可写,可配置和可枚举特征的值。我们稍后会在这篇文章中详细讨论Object.defineProperty,但正如你在上面的代码片段中看到的那样,我们已经将可写属性设置为false,从而改变了name属性的值。JavaScript将忽略重新分配,name属性的值将保持为foo。

如果以严格模式运行代码,那么为了重新分配可写入设置为false的属性值,JavaScript将引发异常。考虑下面的代码:

'use strict';var cat = {    name: 'foo',    age: 9};Object.defineProperty(cat, 'name', { writable: false });console.log(cat.name); // foo cat.name = "koo"; // error

在这里,JavaScript以严格模式运行,因此,当您重新分配name属性的值时,JavaScript将抛出一个异常,如下所示:

这里的错误消息说,你不能指定一个只读的属性。这里,如果属性的可写特性设置为false,则属性将充当只读属性。

配置

无论是酒店的其它特性可以配置或不依赖于价值配置。如果可配置属性设置为false,则不能更改可写和可枚举的值。考虑下面的代码:

var cat = {    name: 'foo',    age: 9};Object.defineProperty(cat, 'name', { configurable: false });Object.defineProperty(cat, 'name', { enumerable: false });

在这里,我们将name属性的可配置设置为false。之后,我们将enumerable设置为false。正如所讨论的,一旦可配置设置为false属性,你不能改变另一个特征。

对于上面的代码,JavaScript会抛出一个TypeError异常,如下图所示。你会得到一个无法重新定义属性名称错误:

在使用可配置的时候,你需要记住,改变可配置的值只能做一次。如果将属性配置为false,则不能重新分配它; 您无法撤消可配置的更改。我们来考虑以下几点:

var cat = {    name: 'foo',    age: 9};Object.defineProperty(cat, 'name', { configurable: false });Object.defineProperty(cat, 'name', { configurable: true });

我们正在重新分配name属性的可配置,但是,JavaScript会为上述操作抛出一个TypeError,如下图所示。正如你所看到的,一旦可配置被设置为false,那个改变就不能被撤消。

另一个重要的事情是,即使可配置设置为false,可写也可以从true更改为false - 但反之亦然。考虑下面的代码:

var cat = {    name: 'foo',    age: 9};Object.defineProperty(cat, 'name', { configurable: false });Object.defineProperty(cat, 'name', { writable: false });cat.name = 'koo';console.log(cat.name); // foo

如果不是在严格模式下,上面的代码不会抛出任何异常。正如我们前面所讨论的,即使可配置为false,可写也可以从true变为false,反之亦然。另一个需要牢记的重要事项是,您无法删除可配置设置为false的属性。

var cat = {    name: 'foo',    age: 9};Object.defineProperty(cat, 'name', { configurable: false });delete cat.name; // wont delete as configurable is false console.log(cat.name); // foo delete (cat.age); // will be deletedconsole.log(cat.age); // undefined

在上面的代码中,你会发现JavaScript不会删除name属性,因为它的可配置设置为false。

枚举

对于一个属性,如果你设置了enumerable:false,那么这个属性将不会出现在枚举中,因此它不能用在诸如for ... in循环的语句  中。

考虑这里的代码:

var cat = {    name: 'foo',    age: 9};Object.defineProperty(cat, 'name', { enumerable: false });for (let f in cat) {    console.log(f); // will print only age }

在这里,你只能得到年龄,因为名字的枚举被设置为false。这是需要记住的另一个重要注意事项:通过设置enumerable:false,唯一的属性将不可用于枚举。我们来看下面的代码:

var cat = {    name: 'foo',    age: 9};Object.defineProperty(cat, 'name', { enumerable: false });console.log(cat.name); // foo console.log('name' in cat); // true

在这里,名称属性enumerable设置为false,但可以访问它。在检查名称是否属于猫的属性时,你也会看到真实的。

有时,您可能需要检查某个特定属性enumerable是否设置为false或true。你可以通过使用propertyIsEnumerable方法来做到这一点:

var cat = {    name: 'foo',    age: 9};Object.defineProperty(cat, 'name', { enumerable: false });console.log(cat.propertyIsEnumerable("name")); // false结论

作为一名专业的JavaScript开发人员,您必须对JavaScript对象属性描述符有一个很好的理解,我希望您能从这篇文章中得到这些信息!请继续关注我们的下一篇文章,您将在这里学习JavaScript中更重要的概念。

0 阅读:1
智能甄选

智能甄选

技术交流、资源共享,是程序员的网上乐园。