javascript高级知识点——函数原型

代码信息来自于http://ejohn.org/apps/learn/。

向函数的原型中添加方法

function Ninja(){} 
 
Ninja.prototype.swingSword = function(){ 
  return true; 
}; 
 
var ninjaB = new Ninja(); 
console.log( ninjaB.swingSword(), "Method exists and is callable." );

通过实例化对象可以访问,因为构造函数实例化的对象拥有__proto__属性这个属性的值是构造函数的原型,如果实例化对象本身没有这个方法,它自动去访问__proto__,所以可以调用原型里的方法。

调用顺序

function Ninja(){ 
  this.swingSword = function(){ 
    return true; 
  }; 
} 
 
// Should return false, but will be overridden 
Ninja.prototype.swingSword = function(){ 
  return false; 
}; 
 
var ninja = new Ninja(); 
console.log( ninja.swingSword(), "调用的是实例化对象方法,而非原型的" );

这个例子可以很好的说明调用顺序:先访问实例化对象自身,如果没有才访问其函数原型中的。

原型的改变影响所有继承它的实例化对象

function Ninja(){ 
  this.swung = true; 
} 
 
var ninjaA = new Ninja(); 
var ninjaB = new Ninja(); 
 
Ninja.prototype.swingSword = function(){ 
  return this.swung; 
}; 
 
console.log( ninjaA.swingSword(), "即使在定义之后,方法仍然存在" ); 
console.log( ninjaB.swingSword(), "同样的情况" );

正如先前所说,实例化对象本身没有的属性,它就去函数的原型里寻找。如果原型修改,它寻找的结果也不一样。

问题:构建可以链式调用的方法

function Ninja(){ 
  this.swung = true; 
} 
 
var ninjaA = new Ninja(); 
var ninjaB = new Ninja(); 
 
//在原型里增加一个方法,返回调用者,并修改swung的值
 
console.log( ninjaA.swing().swung ); 
console.log( ninjaB.swing().swung );

通过返回this实现

function Ninja(){ 
  this.swung = true; 
} 
 
var ninjaA = new Ninja(); 
 
Ninja.prototype.swing= function(){
    this.swung = false;
    return this;
} 
console.log( ninjaA.swing().swung ); 

this指向调用它的对象,在方法中返回this,函数执行完毕时,仍然是调用它的对象。

原文地址:https://www.cnblogs.com/winderby/p/4073948.html