javascript继承

Javascript没有提供继承的机制，但是提供了方法使其可以做到继承一个类，具体做法是：

//Shape - superclass
function Shape() {
  this.x = 0;
  this.y = 0;
}

Shape.prototype.move = function(x, y) {
    this.x += x;
    this.y += y;
    console.info("Shape moved.");
};

// Rectangle - subclass
function Rectangle() {
  Shape.call(this); //call super constructor.
}

// 下面将父类的prototype拷贝一份给自己，否则子类进行prototype的修改时，其实就是在修改父类的prototype，这就不是继承了
Rectangle.prototype = Object.create(Shape.prototype);
Rectangle.prototype.constructor = Rectangle; // 不设置的话会指向Shape

var rect = new Rectangle();

rect instanceof Rectangle //true.
rect instanceof Shape //true.

rect.move(1, 1); //Outputs, "Shape moved."

 

 参考网址：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/create

 

需要指出的是：Shape.call(this);确保用new创建对象时，父类Shape的构造函数得以执行，而Rectangle.prototype = Object.create(Shape.prototype);是将父类Shape的prototype复制一份给子类Rectangle，使用这种方法以后，如果后面的代码修改了父类，则不会影响到子类了。如果希望父类子类公用同一套代码和数据，可以写成：Rectangle.prototype = Shape.prototype; 但是要注意的是，这样一来，子类做的任何修改都会影响到父类，这就不是继承了，所以，应该采用Object.create的方法，使得子类继承了父类的方法，并且能够对子类的prototype的各种方法进行添加和修改。

另外就是要设置子类的prototype.constructor 等于子类，否则这个值就是父类了。

设置constructor并不影响javascript对象的任何行为，这个constructor其实是一个历史遗留的副产品，没有多大用处。见如下描述：

写道

constructor属性不影响任何JavaScript的内部属性。instanceof检测对象的原型链，通常你是无法修改的（不过某些引擎通过私有的__proto__属性暴露出来）。
constructor其实没有什么用处，只是JavaScript语言设计的历史遗留物。由于constructor属性是可以变更的，所以未必真的指向对象的构造函数，只是一个提示。不过，从编程习惯上，我们应该尽量让对象的constructor指向其构造函数，以维持这个惯例。
作者：贺师俊
链接：https://www.zhihu.com/question/19951896/answer/13457869
来源：知乎
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

 

 但又有说constructor有用处的，比如下面的描述：

constructor 写道

var a,b;
(function(){
function A (arg1,arg2) {
this.a = 1;
this.b=2;
}

A.prototype.log = function () {
console.log(this.a);
}
a = new A();
b = new A();
})()
a.log();
// 1
b.log();
// 1
通过以上代码我们可以得到两个对象，a,b，他们同为类A的实例。因为A在闭包里，所以现在我们是不能直接访问A的，那如果我想给类A增加新方法怎么办？
// a.constructor.prototype 在chrome,firefox中可以通过 a.__proto__ 直接访问
a.constructor.prototype.log2 = function () {
console.log(this.b)
}

a.log2();
// 2
b.log2();
// 2
通过访问constructor就可以了。
或者我想知道a的构造函数有几个参数？
a.constructor.length
或者再复杂点，我想知道a的构造函数的参数名是什么(angular的依赖注入就是通过此方法实现的据说)
a.constructor
.toString()
.match(/\(.*\)/)
.pop().slice(1,-1)
.split(',');
// ["arg1", "arg2"]

作者：小鱼二
链接：https://www.zhihu.com/question/19951896/answer/67551712
来源：知乎
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

 

 不过这么怪异的用法使得我实在不想这样编程。对于面向对象的编程来说，修改类的行为，为什么要通过一个对象去改变。为什么要将类闭包呢。

另一方面来说，编程为了严谨，则要设置子类的constructor指向子类，否则看起来，子类就有数据不一致的情况了。毕竟通过对象的constructor，访问到父类，是不对的。

举个使用对象修改了类的例子：

function base() {
}
base.prototype.show = function(){
    alert("OK")
}

function Child (){
    this.cname = "UUUU";
    base.call(this);
}
Child.prototype = Object.create(base.prototype);
Child.prototype.constructor = Child;

var c = new Child();
c.constructor.prototype.display = function(){
    alert(this.cname);
}

var d = new Child();
d.display();