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

时间：2014-11-04 17:17:26 阅读：182 评论：0 收藏：0 [点我收藏+]

标签：style blog http io color ar java sp div

代码信息来自于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,函数执行完毕时，仍然是调用它的对象。

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

标签：style blog http io color ar java sp div

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

踩

(0)

评论一句话评论（0）

分享档案

更多>

2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)

周排行