面向对象的 Javascript(6)

作者:mozart0 来源:蓝色经典 时间:2013-07-21 11:57:22 

  上下文

  在JavaScript中,你的代码将总是有着某种形式的上下文(代码在其内部工作的对象)。这也是其它面向对象语言所共有的功能,但它们都不如JavaScript处理得这样极端。
  上下文是通过变量this工作。变量this总是引用代码当前所在的那个对象。记住全局对象实际上是window对象的属性。这意味着即使是在全局上下文里,this变量仍然引用一个对象。上下文可以成为一个强大的工具,是面向对象代码不可或缺的一环。程序2-17展示了一些关于上下文的简单例子。
  
       程序2-17. 在上下文中使用函数然后将其上下文切换到另一个变量的例子

var obj = {
    yes: function(){
        // this == obj
        this.val = true;
    },
    no: function(){
        this.val = false;
    }
};

//我们看到,obj对象没有"val"的属性
alert( obj.val == null );

//我们运行yes函数,它将改变附着在obj对象的val属性
obj.yes();
alert( obj.val == true );

//然而,我们现在让window.no指向obj.no方法,并运行之
window.no = obj.no;
window.no();

//这导致obj对象保持不变(上下文则切换到了window对象),
alert( obj.val == true );
//而window的val属性被更新
alert( window.val == false );


  你可能已经注意到,在程序2-17中,当我们切换obj.no方法的上下文到变量window时,笨重的代码需要切换函数的上下文。幸运的是,JavaScript提供了两种方法使这一过程变得更加易于理解和实现。程序2-18展示了恰能些目的的两种不同方法,call和apply。

  程序2-18. 改变函数上下文的示例

//一个简单的设置其上下文的颜色风格的函数
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元素
    //第一个参数为设置的上下文,
    //第二个参数是一个被作为参数传递给函数的数组
    // of arguments that gets passed to the function
    changeColor.apply( document.body, arguments );
}

//设置body元素的颜色为黑
setBodyColor( "black" );


  上下文的有用性此处可能还没有立即显现。当我们进入下一节"面向对象的JavaScript"时,它会变得更加明显。

标签:面向对象,Javascript
0
投稿

猜你喜欢

  • ASP.NET 2.0中的数据操作之九:跨页面的主/从报表

    2023-07-19 20:28:42
  • MSSQL 基本语法及实例操作语句

    2012-07-11 15:40:09
  • 如何获取当前 select 元素的值

    2010-03-29 13:07:00
  • [js效果] 图片加载进度实时显示

    2007-09-12 19:27:00
  • ASP Recordset 分页显示数据的方法(修正版)

    2011-04-10 10:42:00
  • 提高asp程序访问速度的方法

    2008-10-23 16:37:00
  • php之Aes加密案例讲解

    2023-06-11 12:59:12
  • 兼容IE和FF的收藏本站、设为首页代码

    2009-01-07 14:14:00
  • Linux安装卸载Mysql数据库

    2011-01-29 16:45:00
  • MySQL旧版本升级为新版本

    2009-02-26 15:44:00
  • SQL语句删除2条重复数据一条保留一条

    2012-07-11 15:51:44
  • asp如何实时获知多少人在线?

    2010-05-18 18:34:00
  • js保留两位小数方法总结

    2023-07-18 17:34:35
  • js三维正方体(兼容ie/ff)

    2008-04-12 14:38:00
  • mysql 主从服务器的简单配置

    2009-09-06 12:06:00
  • 标签明晰、有效

    2010-01-18 12:22:00
  • 如何限制表单textarea的文字输入量

    2007-10-06 22:41:00
  • 使用ASP调用C#写的COM组件

    2010-04-03 20:45:00
  • javascript 跨浏览器的事件系统

    2010-07-28 19:34:00
  • 彻底弄懂CSS盒子模式之五(定位强化练习)

    2007-05-11 16:51:00
  • asp之家 网络编程 m.aspxhome.com