? ? ? ? ? ?構(gòu)造函數(shù)綁定實(shí)現(xiàn)繼承
<!-- 在子類的內(nèi)部調(diào)用父類的方法
? ? 通過(guò)call()或apply()方法 -->
? // function Person(){
? ? ? ? // ? ? this.foot = 2
? ? ? ? // }
? ? ? ? // function Student(color,price){
? ? ? ? // ? ? Person.call(this)
? ? ? ? // }
? ? ? ? // console.log( new Student('白色','100w') );
? ? ? ? /*
? ? ? ? ? ? 父類 Car lunzi 4個(gè)
? ? ? ? ? ? 子類 name price 是通過(guò)傳參獲得實(shí)際的值
? ? ? ? ? ? 方法 打印出 ?例如 : 奔馳 100w 有 4 個(gè)輪子(從父類繼承)
? ? ? ? ? ? 使用call 來(lái)實(shí)現(xiàn)繼承
? ? ? ? */
? ? ? ?/* 父類 gang (幾缸 例如:3缸 4缸 gang需要傳參)
? ? ? ?bsx(變速箱 例如:at變速箱 cvt變速箱 雙離合變速箱 bsx需要傳參) */
? ? ? ?/* 在子類print中 打印出 汽車名--價(jià)格--幾個(gè)輪子--幾缸發(fā)動(dòng)機(jī)--什么變速箱 */
? ? ? ?/* 兩種方式 分別使用call 和 apply */
? ? ? ?function Car(gang,bsx){
? ? ? ? ? ?this.lunzi = 4;
? ? ? ? ? ?this.gang = gang;
? ? ? ? ? ?this.bsx = bsx;
? ? ? ?}
? ? ? ?function Bc(name,price,gang,bsx){
? ? ? ? ? ?/* 把子類的this傳給父類
? ? ? ? ? ?使用call來(lái)改變this指向陷虎,把父類中的this指向子類 */
? ? ? ? // ? ?Car.call(this,gang,bsx);
? ? ? ? ? ?Car.apply(this,[gang,bsx])
? ? ? ? ? ?this.name = name;
? ? ? ? ? ?this.price = price;
? ? ? ? ? ?this.print = function (){
? ? ? ? ? ? ? ? document.write(`
? ? ? ? ? ? ? ? ? ? ${this.name}--${this.price}--${this.lunzi}個(gè)輪子--${this.gang}--${this.bsx}
? ? ? ? ? ? ? ? `);
? ? ? ? ? ?}
? ? ? ?}
? ? ? ?let bc1 = new Bc('奔馳E300','55W','4缸','9AT變速箱');
? ? ? ?bc1.print();
? ? ? ?console.log(bc1);
利用空對(duì)象作為中介
?/**
? ? ? ? ?* @param 子類
? ? ? ? ?* @param 父類
? ? ? ? ?* */
? ? ? ? function extend(child, parent) {
? ? ? ? ? ? function f() { }
? ? ? ? ? ? f.prototype = parent.prototype;
? ? ? ? ? ? child.prototype = new f();
? ? ? ? ? ? child.prototype.constructor = child;
? ? ? ? }
? ? ? ? // Object.prototype.foot = 2;
? ? ? ? /*
? ? ? ? ? ? 空對(duì)象蒜田,幾乎不占內(nèi)存
? ? ? ? ? ? 修改Student的prototype對(duì)象泡态,不會(huì)影響到Person的prototype對(duì)象
? ? ? ? */
? ? ? ? /* 父類 */
? ? ? ? function Person() { }
? ? ? ? Person.prototype.head = 1;
? ? ? ? Person.prototype.foot = 2;
? ? ? ? /* 子類想繼承父類的屬性 */
? ? ? ? function Student() { }
? ? ? ? /* 新建一個(gè)空對(duì)象 */
? ? ? ? // ? ?function f(){}
? ? ? ? // ? ?/* 把父類的原型直接賦值給空對(duì)象的原型上 */
? ? ? ? // ? ?f.prototype = Person.prototype;
? ? ? ? // ? ?/* 把空對(duì)象的實(shí)例化對(duì)象 給到子類的原型上 ?*/
? ? ? ? // ? ?Student.prototype = new f();
? ? ? ? // ? ?/* ★constructor構(gòu)造器都是指向自己的 */
? ? ? ? // ? ?Student.prototype.constructor = Student;
? ? ? ? extend(Student, Person)
? ? ? ? let stu1 = new Student();
? ? ? ? console.log(stu1.foot);
? ? ? ? console.log(stu1);
? ? ? ? /* 不會(huì)影響到Person的prototype對(duì)象 */
? ? ? ? // Student.prototype.age = 30;
? ? ? ? // ? ?let p = new Person();
? ? ? ? // ? ?console.log(p);
? ? ? ? /* 原型鏈就是一層一層向上找的過(guò)程 ?*/
? ? ? ? /* 原型鏈繼承就是利用了上面這種特性 */
? ? ? ? /* 寫(xiě)一個(gè)類 Car color price 屬性 */
? ? ? ? /* 類 Bmw 繼承Car的所有屬性 并實(shí)例化Bmw這個(gè)類
? ? ? ? 寫(xiě)個(gè)方法可以把 color 和 price 打印到頁(yè)面上 */
? ? ? ? function Car() {
? ? ? ? }
? ? ? ? Car.prototype.color = '白色'
? ? ? ? Car.prototype.price = '100w'
? ? ? ? // function f(){}
? ? ? ? // f.prototype = Car.prototype;
? ? ? ? // Bmw.prototype = new f();
? ? ? ? // Bmw.prototype.constructor = Bmw;
? ? ? ? extend(Bmw, Car)
? ? ? ? function Bmw() {
? ? ? ? ? ? this.print = function () {
? ? ? ? ? ? ? ? document.write(`${this.color}--${this.price}`);
? ? ? ? ? ? }
? ? ? ? }
? ? ? ? let b1 = new Bmw();
? ? ? ? b1.print();