原型链担任是ECMAScript的主要担任方法。其根基思想就是通过原型担任多个引用范例的属性和要领。什么是原型链?每个结构函数城市有一个原型工具,挪用结构函数建设的实例会有一个指针__proto__指向原型工具,这个原型大概是另一个范例的实例,所以内部大概也有一个指针指向另一个原型,然后就这样形成了一条原型链。
代码: function SuperType() { this.property = true; } SuperType.prototype.getSuperValue = function() { return this.property; }; function SubType() { this.subproperty = false; } // 担任SuperType SubType.prototype = new SuperType(); SubType.prototype.getSubValue = function () { //留意 不能通过工具字面量的方法添加新要领,不然上一行无效 return this.subproperty; }; let instance = new SubType(); console.log(instance.getSuperValue()); // true
缺点
1.假如父类实例的属性是引用范例的时候,其实父类的实例属性会成为子类的原型属性,子类建设的所有实例城市共享这些要领,修改一个实例的这个属性,其他实例的属性也会被修改
2.子范例在实例化时不能给父范例的结构函数传参
结构函数担任为了办理原型包括引用值导致的担任问题,呈现了一中'盗用结构函数'的技能风行起来,也被称为'工具伪装'或'经典担任',思路就是在子类结构函
数中挪用父类结构函数。可以利用call() apply()的要领以新建设的工具为上下文执行函数
function SuperType(name) { this.colors = ["red","blue","green"]; this.name = name; } function SubType(name) { SuperType.call(this,name); } let instance1 = new SuperType('小明') let instance2 = new SuperType('小白') instance1.colors .push('yellow') console.log(instance1) //{name:"小明",colors:["red","blue","green","yellow"]...} console.log(instance2) //{name:"小白",colors:["red","blue","green"]...} //可以通报参数 也修复了引用的问题 可以担任多个结构函数属性(call多个)
缺点:
1.只能在结构函数中挪用要领 函数不能重用 就是每次子类生成实例的时候城市生成一次属性和要领
2. 子类无法会见到父类原型上的要领
综合了原型链和结构函数,将两者的利益会合了起来。根基的思路是利用原型链担任原型上的属性和要领,而通过结构函数担任实例属性。这样既可以把要领界说在原型上以实现重用,又可以让每个实例都有本身的属性。
function SuperType(name){ this.name = name; this.colors = ["red","blue","green"]; } SuperType.prototype.sayName = function() { console.log(this.name); }; function SubType(name, age){ // 担任属性 第二次挪用 SuperType.call(this, name); this.age = age; } // 担任要领 第一次挪用 SubType.prototype = new SuperType(); SubType.prototype.sayAge = function() { console.log(this.age); }; let instance1 = new SubType("Nicholas", 29); instance1.colors.push("black"); console.log(instance1.colors); //["red,blue,green,black"] instance1.sayName(); // "Nicholas"; instance1.sayAge(); // 29 let instance2 = new SubType("Greg", 27); console.log(instance2.colors); // ["red,blue,green"] instance2.sayName(); // "Greg"; instance2.sayAge(); // 27 //可以担任父类原型上的属性,可以传参,可复用。 每个新实例引入的结构函数属性是私有的
缺点
挪用了两次父类结构函数 较量耗内存
原型式担任纵然不自界说范例也可以通过原型实现工具之间的信息共享。
function object(person) { function F() {} F.prototype = person return new F() } let person = { name:'小明', colors:['red','blue'] } let person1 = object(person) person1.colors.push('green') let person2 = object(person) person1.colors.push('yellow') console.log(person) //['red','blue','green','yellow']
合用情况: 你有一个工具,想在它的基本上再建设一个新工具。你需要把这个工具先传给object() ,然后再对返回的工具举办适当修改。雷同于 Object.create()只传第一个参数的时候,本质上就是对传入的工具举办了一次浅复制,缺点就是新实例的属性都是后头添加的,无法复用
寄生式担任与原型式担任较量靠近的一种担任方法是寄生式担任,雷同于寄生结构函数和工场模式:建设一个实现担任的函数,以某种方法加强工具,然后返回这个工具。
function object(person) { function F() {} F.prototype = person return new F() } function createAnother(original){ let clone = object(original); // 通过挪用函数建设一个新工具 clone.sayHi = function() { // 以某种方法加强这个工具 console.log("hi"); }; return clone; // 返回这个工具 }