码迷,mamicode.com
首页 > 编程语言 > 详细

javascript高级知识分析——上下文

时间:2014-10-30 20:50:21      阅读:223      评论:0      收藏:0      [点我收藏+]

标签:style   blog   io   color   os   ar   java   for   sp   

如果函数是一个对象的属性,那么它可以?

var katana = { 
  isSharp: true, 
  use: function(){ 
    this.isSharp = !this.isSharp; 
  } 
}; 
katana.use(); 
console.log( katana.isSharp );//false;

在javascript中,函数的内部,this默认指向调用它的对象。本例katana.use(),函数use被对象katana调用,所以在函数内部,this.isSharp可以操作katana.isSharp。

函数通过this引用的对象,就是上下文。

上下文到底代表什么?

function katana(){ 
  this.isSharp = true; 
} 
katana(); 
console.log( isSharp === true, "特殊情况,全局变量的简写方式,this可以引用window对象的属性," ); 
 
var shuriken = { 
  toss: function(){ 
    this.isSharp = true; 
  } 
}; 
shuriken.toss(); 
console.log( shuriken.isSharp === true, "函数this引用调用它的对象" );

katana()=window.katana(),这个例子很明确的显示函数内部的this指向调用它的对象,这就是上下文。

函数的上下文是否可以改变?

var object = {}; 
function fn(){ 
  return this; 
} 
console.log( fn() == this, "上下文是全局对象" ); //true
console.log( fn.call(object) == object, "上下文被改为指定对象" ); //true

call的用法,修改函数的上下文this为第一个参数。

改变上下文的不同方法:

function add(a, b){ 
  return a + b; 
} 
console.log( add.call(this, 1, 2) == 3, ".call() 参数为多个" ); //true
console.log( add.apply(this, [1, 2]) == 3, ".apply() 参数为一个数组" ); //true

call和apply经常用来修改上下文,它们功能完全一样,只有一个区别:一个接收多个独立参数,一个接收单个数组作参数。

习题:补足代码,在回调函数里完成数组遍历

function loop(array, fn){ 
  for ( var i = 0; i < array.length; i++ ) { 
    // 补足代码
  } 
} 
var num = 0; 
loop([0, 1, 2], function(value){ 
  console.log(value == num++, "确保上下文为我们希望的."); 
  console.log(this instanceof Array, "上下文是数组实例"); 
});

解决数组遍历的一个方法

function loop(array, fn){ 
  for ( var i = 0; i < array.length; i++ ) { 
    fn.call( array, array[i], i ); 
  } 
} 
var num = 0; 
loop([0, 1, 2], function(value){ 
  console.log(value == num++, "确保上下文为我们希望的."); 
  console.log(this instanceof Array, "上下文是数组实例"); 
});

 

javascript高级知识分析——上下文

标签:style   blog   io   color   os   ar   java   for   sp   

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

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!