深入理解JavaScript中的属性和特性

Posted 2020-08-17

深入理解javascript中的属性和特性？

　　JavaScript中属性和特性是完全不同的两个概念，这里我将根据自己所学，来深入理解JavaScript中的属性和特性。

　　主要内容如下：

• 理解JavaScript中理解对象的本质、理解对象与类的关系、对象与引用类型的关系
• 对象属性如何进行分类
• 属性中特性的理解

 

第一部分：理解JavaScript中理解对象的本质、理解对象与类的关系、对象与引用类型的关系

　　 对象的本质：ECMA-262把对象定义为：无序属性的集合，其属性可以包含基本值、对象或者函数。即对象是一组没有特定顺序的值，对象的每个属性或方法都有一个名字，而这个名字都映射到一个值。故对象的本质是一个散列表：其中是一组名值对，值可以是数据或函数。、

　　 对象和类的关系：在JavaScript中，对象和类没有任何关系。这是因为ECMAScript中根本就没有类的概念，它的对象与其他基于类的语言中的对象是不同的。

　　 对象和引用类型的关系：对象和引用类型并不是等价的，因为每个对象都是基于一个引用类型创建的。

第二部分：对象属性如何进行分类

　　由构造函数或对象字面量方法创建的对象中具有属性和方法（只要提到属性和方法，它们一定是属于对象的；只要提到对象，它一定是具有属性和方法的（自定义除外）），其中属性又可分为数据属性和访问器属性，他们的区别如下：

• 数据属性一般用于存储数据数值，访问器属性不包含数据值
• 访问器属性多用于get/set操作

 

第三部分：属性中特性的理解

　　ECMAScript为了描述对象属性（property）的各种特征，定义了特性（attribute）这个概念。也就是说特性不同于属性，特性是为了描述属性的。下面，我将分别讲解：

• 数据属性及其特性
• 访问器属性及其特性
• 如何利用Object.defineProperties()方法定义多个特性
• 如何利用Object.getOwnPropertyDescripter()方法读取属性的描述符以读取属性的特性

1.数据属性及其特性

　　刚刚我们说过，数据属性是用于存储数据数值的，因此数据属性具有一个数据值的位置，在这个位置可以读取和写入值。数据属性有4个描述其行为的特性，由于ECMAScript规定：在JavaScript中不能直接访问属性的特性（注意：不是不能访问），所以我们把它放在两组方括号中。如下：

• [[Configurable]]:默认值为true，a、表示能否通过delete删除属性从而重新定义属性 b、能否修改属性的特性 c、能够把属性由数据属性修改为访问器属性
• [[Enumerable]]:默认值为true，表示能否通过for-in循环返回该属性(所以：如果为false，那么for-in循环没法枚举它所在的属性)
• [[Writable]]:默认值为true，表示能否修改属性的值，这是与[[Configurable]]不同之处。
• [[Value]]:默认值为undefined，这个值即为属性的属性值，我们可以在这个位置上读取属性值，也可以在这个位置上写入属性值。
• 注意：上述的默认是指通过构造函数或对象字面量创建的对象所自身拥有的属性，而不是下面要介绍的Object.defineProperty()方法

这些特性都具有默认值，但是如果这些默认值不是我们想要的，该怎么办呢？当然就是修改啦！我们可以通过Object.defineProperty()方法来修改属性默认的特性。英文difineProperty即为定义属性的意思。这个方法接收三个参数：属性所在的对象、属性的名字和一个描述符对象。其中第三个参数描述符对象是对象字面量的方法创建的，里面的属性和属性值实际上保存的是要修改的特性和特性值。

下面通过几个例子来深入理解。

a

                var person={};
		Object.defineProperty(person,"name",{
			writable:false,
			value:"zhuzhenwei"
		});
		console.log(person.name);//朱振伟
		person.name="heting";
		console.log(person.name);//朱振伟
    

　　这里我用对象字面量的方法创建了一个对象，但是没有同时创建方法和属性。而是利用了Object.defineProperty()方法来创建了属性和修改了默认值。这里将writable设置为false,于是后面我试图修改person.name时，是无效的。

 

b

                var person={};
		Object.defineProperty(person,"name",{
			value:"zhuzhenwei"
		});
		console.log(person.name);//zhuzhenwei
		person.name="heting";
		console.log(person.name);//zhuzhenwei

　　注意看这个例子，这个例子中我删去了writable:false,为什么还是不能修改呢？这是因为之前我在介绍特性时，前三个默认为ture，是在创建对象并创建属性的情况下得到的。对于通过调用Object.defineProperty()方法创建的属性，其前三个特性的默认值均为false，这里需要注意。