js的原型，构造函数，继承理解

js的构造函数

js有以下几种构造函数：

1.普通构造函数。

2.原型构造函数。

3.组合构造函数。

4.寄生构造函数。

5.稳妥构造函数。

 

1.普通构造函数

普通的构造函数通过手写字母大写的函数来进行声明。里面的实例属性，全部绑定到this上.

使用时，只需要new一个实例

然后就可以通过实例来拿到我们的函数内部的变量和函数了，从这里我们可以看出，当我们new一个实例的时候，会发生这样一个过程：new运算符会通过函数构造器构造一个实例对象出来，该对象会绑定this，所以我们可以拿到this上的值。

2.原型构造函数 

何为原型，每一个函数对象都会存在一个原型。我们可以通过我们的实例来访问到原型的属性。每一个普通对象都会存在一个__proto__属性，我们访问构造函数内部的属性和方法时，如果没有，就会顺着原型链来查找相关的变量，即this上没有的的就会查找构造函数的prototype属性，

如果peototype上也没有的话，就会去查找原型的__proto__属性上是否存在，然后查找__proto__.__proto__，一直到顶层object.prototype.__proto__，也就是null的时候，会返回undefined。

原型构造函数属性声明在prototype属性上:

如图，我们声明了一个简单的原型构造函数。我们可以通过实例拿到其中的变量。所以我们发现通过构造函数new出的实例又可以连接原型。

3.组合构造函数

组合构造函数就是两者的组合，即存在普通的构造函数，又存在原型的构造函数。

我们可以通过实例去拿到this和prototype上的属性和方法，为此，我们发现，一个实例他会做这几个事情：

1.绑定this，

2.连接原型.

我们再来看看寄生构造函数

4. 寄生构造函数

寄生构造函数的意思是我们现在的所有的属性和方法我们都不声明在构造函数上，而是在内部声明一个新的狗仔函数或者一个对象，然后我们把属性和方法声明在他们身上。最后返回我们的实例。

我们来看看实例;

这就是一个寄生构造函数，我们发现现在没有了this.没有了原型，所以现在我们new出的实例他是访问不到this和prototype的，我们的实例现在是直接与我们返回的实例相绑定的。

5.稳妥构造函数

所谓的稳妥构造函数与寄生构造函数看起来差不多，但是稳妥构造函数是不需要进行new运算符的。所以我们把它当成一个普通的函数来运行。

 

所以综上所诉，你可以根据自己的需求来选择构造函数。

我们老来看看怎么实现一个继承。

继承

js的继承大致有以下几种:

1.对象冒充

2.原型继承

3.组合继承

4.寄生继承

5.寄生组合

 

先看第一种

对象冒充

通过js的call函数我们来更改我们的this指向，从而让我们的this指向我们要继承函数的this。我们现在可以拿到父级的this属性方法，但是我们并不能去拿到原型。所以我们可以通过原型继承来拿到原型

原型继承

我们发现通过原型继承我们拿到了对应的原型数据，但是又有一个问题，现在我们的父级是没有参数的，如果有参数的话，我们又怎么办了。

那么我们该试试组合继承了。

组合继承

通过组合继承我们现在看起老很完整了，我们可以继承父级的this,和原型了，还解决了传入参数的问题。但我们发现父级构造函数被执行了两次，这样也不太好.。

那我们来看看寄生继承

 

通过在子级内部重新声明一个新的构造函数然后把A的原型给新函数的原型，并把新函数的实例赋值给当前构造函数的原型，就可以了。但我们发现并不能继承this，所以我们来看看寄生组合继承

我们再来看看寄生组合

我们用一个新的函数来连接父级的原型，并把新函数的实例赋值个子级原型，这样，我们子集就继承了父级的原型，并且不影响父级的原型，然后在调用call继承this指向,现在我们的父级也没有执行两次了，我们可以来封装成一个函数

extend函数必须写在B的原型申明之前，因为在后面的话会覆盖B的原型申明.

 

 

 

 

转载于:https://my.oschina.net/u/3589917/blog/3095176