JS高级学习笔记（7）- 通俗易懂来解释——继承

参考：

Javascript继承机制的设计思想

我的笔记

JavaScript之继承

JavaScript 之原型及原型链

继承

JS没有“子类”和“父类”的概念，靠“原型链”（prototype chain）实现继承，这就不是很好理解了。

JS原来是为了验证表单而设计的，不用像java、C++一样面向对象，如果引入“类”的概念，js就是一门完整的面向对象的语言了。在JS中，所有数据类型都是对象，这和java非常相似。

在C++ 和 java中，创建对象时，使用new关键字，都会调用“类”的构造函数（constructor），在js中，直接在new后面跟着构造函数。

如下：

function DOG(name) {
    this.name = name;    
}
var dagA = new DOG('大毛')；
alert(dogA.name); // 大毛 注意：this指向实例

new运算符的缺点

使用构造函数生成实例对象，有一个缺点，那就是无法共享数据。

比如，在DOG对象的构造函数中，设置一个实例对象的公有属性species。

function DOG(name){
    this.name = name;
    this.species = '犬科';
}
// 如果生成俩个实例对象
var dogA = new DOG('大毛');
var dogB = new DOG('二毛');

这俩个对象的species属性是独立的，修改其中一个，不会影响到另一个。

dogA.species = '猫科';
alert(dogB.species); // 显示"犬科"，不受dogA的影响

每一个实例对象，都有自己的属性和方法的副本。这不仅无法做到数据共享，也是极大的资源浪费。

prototype属性的引入

prototype是构造函数的一个属性，所有实例对象需要共享的属性和方法，都放在这个对象里面，那些不需要的共享的属性和方法，就放在构造函数里面。

实例对象一旦创建，将自动引用prototype对象的属性和方法。也就是说，实例对象的属性和方法，分为俩种，一种是本地的，另一种是引用过来的。

demo1：

function DOG(name){
    this.name = name;
}
DOG.prototype = { species : '犬科' };

var dogA = new DOG('大毛');
var dogB = new DOG('二毛');

alert(dogA.species); // 犬科
alert(dogB.species); // 犬科

现在，将species放在prototype对象里，只要修改了prototype对象，就会同时影响到俩个实例对象

DOG.prototype.species = '猫科';
alert(dogA.species); // 猫科
alert(dogB.species); // 猫科

总结

prototype对象是实例对象的原型，而实例对象则"继承"了prototype对象。