JavaScript的语言特性 — 上下文对象
在JavaScript中，代码总是有一个上下文对象（context）。上下文对象通过this变量体现，这个变量永远指向当前代码所处的对象中。即使在全局上下文中，this变量也指向一个对象 -- window对象。[code lang="as3"]
var obj = {
yes: function(){
// this == obj
this.val = true;
},
no: function(){
this.val = false;
}
};
// 'obj' 对象没有 val 属性
alert( obj.val == null );
// 执行了 yes 函数之后，将 val 属性与 obj 对象关联起来
obj.yes();
alert( obj.val == true );
// 现在把 window.no 指向 obj.no 并执行
window.no = obj.no;
window.no();
// 结果是 obj 对象的 val 不变
// 因为 no 的上下文已经改编为 window 对象了
alert( obj.val == true );
// 而 window 的 val 属性被更新了
alert( window.val == false );
[/code]
上面的示例中把obj.no变量的上下文对象切换为window对象时，代码变得不好理解了。JavaScript通过一些方法来让这个过程变得更好理解和实现。
[code lang="js"]
// 一个设置上下文对象颜色样式的简单函数
function changeColor( color ) {
this.style.color = color;
}
// 在 window 对象中调用此函数会失败
// 因为 window 对象没有 style 属性
changeColor( "white" );
// 找出 id 为 main 的元素
var main = document.getElementById("main");
// 使用 call 将它的颜色置为黑色
// call 方法将上下文对象设置为第一个对象
// 并将其它参数作为原函数的参数
changeColor.call( main, "black" );
// 设置 body 元素颜色的函数
function setBodyColor() {
// apply 方法将上下文对象设置为第一个参数指定的 body 元素
// 第二参数是传给函数的所有参数的数组
changeColor.apply( document.body, arguments );
}
// 将 body 的背景色设置为黑色
setBodyColor( "black" );
[/code]
<img src="http://www.everyinch.net/wp-content/uploads/2013/11/js10-620x372.jpg" alt="js10" width="620" height="372" class="alignnone size-medium wp-image-3520" />
查看完整版本： JavaScript的语言特性 — 上下文对象
Tags: