js对象小结

时间 2019-11-29

原文原文链接

前奏

对象是js的基本数据类型，准确来讲除了字符串，数字，boolean值，null与undifine以外，js中的值都是对象。js中的对象是一种复合值，他将不少值（原始值或其余对象）聚合在一块儿，能够经过名字来访问这些值，其实看上去就像是一个属性的无序集合，每一个属性都是一个名/值对。属性名是字符串，能够把对象当作是从字符串到值得映射。这种现象就像咱们平时知道的“关联数组”，“数据字典”等等（只是叫法不一样而已）。除了这种映射关系外，最主要的核心就是js的对象能够经过“原型继承”来继承属性与方法。另外因为对象时可变的，咱们是经过引用而非值来操做对象。html

首先咱们先来讲一下对象的属性，对象的属性包括属性名与属性值。其中属性名是一个包含空字符在内的任意字符串（关于属性名加不加双引号的问题，规范是要加的，可是在没有特殊字符，或是按照的json的数据格式来就须要加了，这样避免特殊字符或是数据传输出错）。属性值可使js的任意值。除了名字之外每一个属性还有一些和他相关的性质，被叫作“属性特性”：

可写：是否能够设置该属性的值

可枚举：代表是否可使用for/in循环遍历属性的值。

可配置：是否能够删除或修改该属性。

其次除了包含属性以外，每一个对象还包含三个相关的对象特质：

一、对象的原型（prototype）指向另一个对象，本对象的属性继承自这个原型对象。

二、对象的类(class)是一个标示对象类型的字符串

三、对象的扩展标记（extensible flag）指明了（在ECMAScript 5中）是否能够向该对象添加新的属性

最后咱们使用下面的术语来对咱们经常使用的三类js对象与两类属性作区分：

一、内置对象（native object）使用ECMAScript 规范的对象或类，例如数组，函数，日期和正则表达式都是内置对象

二、宿主对象（host object）是由js解释器所嵌入的宿主环境定义的。客户端js中标示网页结构的HTMLElement对象均是宿主对象，在这种环境下宿主对象至关因而内置对象

三、自定义对象（user defined object）是又运行中的js代码建立的对象

四、自由属性（own property）是直接在对象中定义的属性

五、继承属性（inherited property）是在对象的原型上定义的属性

对象的建立

说了这么多咱们尚未聊到怎么建立最简单的对象。接下来就是怎么建立对象了。

建立对象的方式有三中：经过对象直接量（对象字面量），经过关键字new和（ECMAScript 5中）经过Object.create()来建立对象。

一、建立对象最简单的方式就是在js中使用对象直接量。

对象直接量是由若干的名/值对组成的映射表，名/值之间使用冒号分隔，名/值对之间使用逗号分隔，整个映射表用花括号扩起来。关于属性名前面已经提及。

var empty = {};   //  定义一个空对象
var ob1 = {x:1,y:2};   //  定义两个属性的对象
var ob2 = {           // 定义复杂的对象
          "main title" : "three object",    
          "main-t" : 123,               //   特殊字符要加引号
          "for" : {x:"123",y:123}，   //  for是保留字必须用引号
 }；

对象直接量是一个表达式，这个表达式的每次运算都会建立并初始化一个新的对象。若是在循环表达式里使用对象直接量，他将会建立不少对象的。

二、经过new来建立对象.

用new关键字来建立一个对象，new后跟一个函数调用，这里的函数称为构造函数（constructor），构造函数用以初始化一个新建立的对象，js语言核心中的原始类型都包含内置的构造函数。除了这些内置的构造函数外，咱们最经常使用的就是咱们自定义的构造函数了。例如：

var arr = new Array();      //   使用内置构造函数建立一个新的数组对象，至关于var arr = [];
var obg = new Object();      //  使用内置构造函数建立一个新的数组对象，至关于var arr = {};
function UserDefineObj (x,y) {        //  自定义的构造函数
                   this.x = x;
                    this.y = y;
               }   
var user = new UserDefineObj(1,2);    //  使用自定义的构造函数建立一个对象

三、使用Object.create()方法

ECMAScript 5定义了一个名为Object.create()方法来建立一个新对象，这个方法的第一个参数是这个对象的原型，Object.create()提供的第二个可选参数是用来对对象的属性做进一步的描述。

Object.create()是一个静态函数，而不是提供给某一个对象的方法，使用他的方法很简单只须要传入一个原型对象便可：例如

var ob1 = Object.create ( {x : 1, y : 2 } );     //  使用后面的参数（对象直接量）做为ob1对象的原型。

若是想建立一个空对象（好比经过{ }或newObject()建立的对象）可使用Object.prototype做为这个方法的参数。例如：正则表达式

var ob2 = Object.create ( { } ) ;     //  建立一个空对象

若是传入参数为null，将会建立一个没有任何原型的空对象，但这个对象没有任何继承的方法，甚至不包括基础的方法，如toString()等。json

var ob3 = Object.create (null);      //  ob3不继承任何属性和方法

对象的继承

说到js的继承咱们不得不提的就是js的核心特色：基于原型（prototype）继承。

原型：

首先来看一下原型。每个js对象（除了null）都有一个对象与其相关联，这个相关联的对象就是咱们所说的原型对象。每个对象都从原型继承属性。

全部经过对象直接量建立的对象都具备同一个原型，并经过js代码Object.prototype得到对原型对象的引用。也就是说经过直接量建立的对象的原型就是Object.prototype引用的一个对象。

经过new关键字与构造函数建立的对象的原型就是构造函数的prototype的属性的值。所以，不管是用对象直接量建立的对象，仍是经过new Object()建立的对象同时都继承自Object.prototype。同时new Array（）建立的对象的原型就是Array.Prototype，使用new Date()建立的对象的原型就是Date.prototype.

没有原型的对象为数很少，其中Object.prototype就是其中一个，他不继承任何属性。其余的对象的原型对象都是普通的对象。另外全部的内置函数以及大部分自定义的函数（上面说过一个ob3对象没有原型）都有一个继承自Object.prototype的原型。所以new Date()既继承自Date.prototy同时也继承自Object.prototype。这一系列相互关联的原型对象也就构成了所谓的原型链（prototyp chain）。

例如：

function UserDefineObj (x,y) {        //  自定义的构造函数
                   this.x = x;
                    this.y = y;
               }
var user = new UserDefineObj(1,2);    //  使用自定义的构造函数建立一个对象
console.log(user.toString());           //   toString这个方法就是继承自Object.prototype

关于原型与原型链推荐博客：http://www.cnblogs.com/TomXu/archive/2012/01/05/2305453.html数组

继承：

js对象具备自定义的属性，也有一些事继承自原型对象的属性。下面咱们将用实例来讨论js的继承关系。

function UserDefineObj (x,y) {        //  自定义的构造函数
                   this.x = x;               //   声明自定义属性x，也成为自有属性
                    this.y = y;               //   声明自定义属性y
               }
UserDefineObj.prototype.allx = 123;      //   给构造函数的原型对象添加属性allx 
var user = new UserDefineObj(1,2);    //  使用自定义的构造函数建立一个对象
console.log(user.x);              //  输出：1
console.log(user.allx);           //   输出：123

因为js是一种弱类型的语言，在不声明变量的状况下，解析器会自动的再运行的时候建立这个变量（全局变量）。函数

  function UserDefineObj (x,y) {        //  自定义的构造函数
                   this.x = x;               //   声明自定义属性x，也成为自有属性
                    this.y = y;               //   声明自定义属性y
               }
               UserDefineObj.prototype.allx = 123;      //   给构造函数的原型对象添加属性allx
               var user = new UserDefineObj(1,2);    //  使用自定义的构造函数建立一个对象
               var ob = new UserDefineObj(4,5);
               console.log(user.x);              //  输出：1
               console.log(ob.x);       //  输出：4
               console.log(user.allx);    //  输出：123
               console.log(ob.allx);      //   输出：123
               user.allx = 110;            //  更改user对象的属性，对ob对象没有影响
               console.log(user.allx);      //   输出：110
               console.log(ob.allx);        //   输出：123

从上面程序的输出能够看出user对象和ob对象建立了两个不一样的对象，这两个对象同时共同继承自原型对象UserDefineObj.prototype。因为是不一样的对象，因此对属性的值得改变，对其余的对象没有影响。this