3-11 面向对象（一）.mp4_20171120_192744.579_看图王.jpg
-
类的声明类的声明有两种方式:一种是用传统的构造函数来模拟一个类的方式,第二种是ES6中对class的声明
function Animail() { this.name = "name" } /*ES6 class声明类*/ class Animail2 { constructor() { this.name = name; } }
-
如何通过类来实例化一个对象
/*实例化*/ console.log(new Animail(),new Animail2()) 如何实现继承
在一个对象上找不到这个属性,会通过原型链一级一级网上找,这完全可以理解为继承关系
实现继承的原理就是通过原型链,继承的本质就是原型链
-
JS有哪几种继承方式,每种形式有什么缺点,又有什么优点
- 借助构造函数实现
/*借助构造函数实现*/ function Parent1() { this.name = "parent1" } Parent1.prototype.say = function() {console.log("HELLO")}; function Child() { Parent1.call(this); //把父级构造函数在子类元素中执行,修改了父级函数this的指向 this.type = "child1" } console.log(new Child1()) //name:'parent1';type:'child1' //原理:将父级构造函数的this指向子构造函数的实例上去,这样子类元素就拥有了父级的属性 //缺点:不会继承父类原型对象上的方法,只能继承构造函数里面的属性和方法- 借助原型链实现
/*借助原型链实现*/ function Parent2() { this.name = "parent2"; this.play = [1,2,3] } function Child2() { this.type = "child2" } Child2.prototype = new Parent2(); //让构造函数的实例能访问到它原型对象上的属性方法 //prototype 直接拿的是父类的实例,它没有自己的constructor,它的constructor 指向父类 console.log(new Child2()); //new Child2().__proto__.name<"Parent2";new Child2().name<"Parent2" //缺点 var s1 = new Child2(); var s2 = new Child2(); console.log(s1.play,s2.play);// 都是[1,2,3] s1.play.push(4); console.log(s1.play,s2.play);// 结果都输出[1,2,3,4] //改第一个实例对象s1上的属性play,第二个实例对象s2上的属性也跟着改变了 //造成的原因是:原型链中的原型对象是共用的 s1.__proto__ === s2.__proto__ <ture ;他俩引用的是同一个对象(父类的实例对象),push属性是在实例对象上- 组合继承方式
/*组合方式*/ function Parent3() { this.name = "parent3"; this.play = [1,2,3] } function Child3() { Parent3.call(this); this.type = "child3" } Child3.prototype = new Parent3(); var s3 = new Child3(); var s4 = new Child3(); s3.play.push(4); console.log(s3.play,s4.play); //缺点:父类构造函数执行了两次,call的时候执行了一次,new 一个实例的时候又执行了一次- 组合继承优化方式一
/*组合方式优化方式一*/ function Parent4() { this.name = "parent4"; this.play = [1,2,3] } function Child4() { Parent4.call(this); this.type = "child4"; //this.constructor = Child5;//不能这么写,因为父类和子类是共用一个原型对象的,将子类的constructor修改了,父类的不也跟着修改了嘛 } Child4.prototype = Parent4.prototype; //将子类的原型对象和父类的原型对象引用同一个原型对象 var s5 = new Child4(); var s6 = new Child4(); s5.play.push(4); console.log(s5.play,s6.play); //缺点:无法区分实例是由父类创造的还是由子类创造的 console.log(s5.constructor); // parent4- 组合继承优化方式二
function Parent5() { this.name = "parent5"; this.play = [1,2,3] } function Child5() { Parent5.call(this); this.type = "child5" } Child5.prototype = Object.create(Parent5.prototype);// Object.create方法创建的对象它的原型就是里面的参数 Child5.prototype.constructor = Child5; var s7 = new Child5(); //console.log(s7.prototype); //不行的,只有构造函数才有prototype属性 console.log(s7.__proto__); //Parent5
