继承

115 阅读3分钟
in(运算符):判断一个对象或变量是属于某一个对象(无论对象是否是原型对象)
hasowenproperty:判断一个对象或变量是属于某一个对象((不包含父级的原型对象)

in.jpg

继承的实现
    所有开发者定义的类都可作为基类(父类)
    
    出于安全原因,本地类和宿主类不能作为基类,这样可以防止公用访问编译过的浏览器级的代码,因为
这些代码可以被用于恶意攻击

    创建的子类将继承超类的所有属性和方法,包括构造函数及方法的实现所有属性和方法都是公用的,因此
子类可直接访问这些方法。子类还可添加超类中没有的新属性和方法,也可以覆盖超类的属性和方法

     var obj = new object();
     obj.color = "blue";
     function sayColor(sPrefix, sSuffix) {
            alert(sPrefix + this.color + sSuffix);
        };
        //sayColor运行时,通过call运行。在运行过程中,sayColor的this会指向父亲对象
        sayColor.call(obj, "The color is ", " a very nice color indeed. ");
        sayColor.apply(obj,new Array("the color is","a very nice color indeed."));
        //apply继承原理与call相同,apply是数组方式

    bind()方法的主要作用就是将函数绑定至某个对象,bind()方法会创建一个函数,函数体内this对象的值
会被绑定到传入bind()函数的值。

function.prototype.bind(thisArg[,arg1[,arg2[,...]]])

实例:
 //bind的用法
    var A = function(name) {
        this.name = name;
    }
    var B = function() {
        A.bind(this,arguments);//在b里使用的this时,本身应该是b的this,但是a.bind里的this代表
//指向a对象,那么就把a的name给b,arguments代表的是函数的参数
    }
    B.prototype.getName = function() {
        return this.name;
    }
    var b = new B("hello");
    console.log(b.getName()); // "hello"

bind,call,apply区别:

共同点:都可以改变函数执行的上下文环境;从而改变this的指向

不同: bind:不立即执行函数,一般用在异步调用和事件; call/apply:立即执行函数。使用语法也不同

构造函数继承:
function classA(sColor) {
        this.color = scolor;
        this.saycolor = function () {
        alert(this.color);
    };
}
function classB( bColor,bName) {
        this.newMethod = classA;
        this.newMethod(bcolor);
        delete this.newMethod ;
        this.name = bName;
        this.sayName = function () {
        alert(this.name) ;
    };
}

构造.png

原型链继承弊端:
    原型链的弊端是不支持多重继承。
    原型链会用另一类型的对象重写类的prototype属性。
    
实例:
/*----原型链写法----*/
/*把classB的prototype属性设置成ClassA的实例*/
function classA() {}
ClassA.prototype.color = "blue";
ClassA.prototype. saycolor = function () {
    alert(this.color);
};
function classB() {}
classB.prototype = new ClassA();//new是建立新对象,并且复制a的所有内容包含原型对象
var objA = new classA();
var objB = new ClassB();
objA.color = "blue";
objB.color = "red";
objA.sayColor();
objB.sayColor();

寄生式继承:
function object(o){
    function F(){}
    F.prototype=o;
    return new F();
};
function createAnother(original){
    var clone = object(original); //通过调用函数创建一个新对象
    clone. sayHi = function(){//以某种方式增强这个对象
        alert( "hi");
    }
    return clone; //返回这个对象
}
    寄生式继承:把原型对象封装到一个方法,并返回新的原型对象return new原型对象,继承时,
调用父对象,并且可以向调用后生成新对象里添加属性和方法(继承原理)

/*_-a -----寄生组合类继承-----*/
function classA( scolor) {
    this.color = sColor;
}
ClassA.prototype. saycolor = function () {
    alert(this.color);
};
function classB(scolor, sName) {
    classA.call(this,scolor);//这里this指的b对象。所以classA.call立即执行的。当a运行时里面
//this.color=scolor;原来指的是a,但是,通过call运行,现在指向b。所以当classA运行完后,
//classB就有color
    this.name = sName;
}
classB.prototype = new classA( );
classB.prototype. sayName = function () {
    alert(this.name ) ;
};

混合.png