javascript类的继承的实现-526互联

首先需要知道两个概念：

构造函数的prototype属性是实例的原型，这个属性的值是一个对象，可以被重新赋值，比如有时候为了简便会把prototype属性重新赋值为一个对象字面量；
每个对象都有一个__proto__内部属性，指向自己的原型，虽然是非标准的，但是各大浏览器都实现了他，在mdn文档中提到的[[Prototype]]就是__proto__。比如实例的__proto__属性就是指向了构造函数的prototype;

下面的代码来自@better-scroll/core实现了类的继承。

// extendStatics函数的作用是实现类静态方法的继承，构造函数原型继承，最终结果是d可以访问b的属性和方法。
var extendStatics = function (d, b) {
    // Object.setPrototypeOf() 方法设置一个指定的对象的原型（即，内部 [[Prototype]] 属性）到另一个对象或 null。是Object.prototype.__proto__ 的替代
    extendStatics = Object.setPrototypeOf ||
        (
            // 这里的逻辑是：如果当前环境支持 __proto__关键字, 就用__proto__修改原型的指向
            {
                __proto__: []
            }
            // instanceof 运算符用于检测构造函数的 prototype 属性是否出现在某个实例对象的原型链上。
            instanceof Array && function (d, b) {
                d.__proto__ = b; // 把d的原型指向b
            }
        ) ||
        /* 如果以上两者修改原型指向的方法都不支持那么手动将b上的属性添加到d上 */
        function (d, b) {
            for (var p in b) {
                // 如果p是对象b自身的属性，那么将属性p添加到对象d上
                if (Object.prototype.hasOwnProperty.call(b, p)) {
                    d[p] = b[p];
                }
            }
        };
    return extendStatics(d, b);
};
function __extends(d, b) {
    extendStatics(d, b);
    // 这里 __ 函数的作用是: 1. 保证d的构造函数指向正确；2.通过 __ 的实例实现继承；
    function __() {
        this.constructor = d;
    }
    __.prototype = b.prototype;
    //Object.create() 方法创建一个新对象，使用现有的对象来提供新创建的对象的 __proto__
    // 如果b不是null, d.prototype = new __(); d.prototype.__proto__ = b.prototype;
    d.prototype = b === null ? Object.create(b) : new __();
}

对于__extends函数中的如下代码：

function __() {
    this.constructor = d;
}
__.prototype = b.prototype;
d.prototype = new __();

其实这段逻辑用Object.create()也能实现，用Object.create()实现后的__extends如下：

function __extends(d, b) {
    extendStatics(d, b);
    d.prototype = Object.create(b.prototype);
    d.prototype.constructor = d;
}