先从一个例子说起

var sound = 'Roar';
function myOrneryBeast()
{
this.style.color='green';//window 方法被调用时所属的对象
alert(sound);
}
// this 的环境可以随着函数被赋值给不同的对象而改变
function initPage()
{
var example=ADS.$('example');
//使用事件属性方法
example.onlick=myOrneryBeast;
//或者使用ADS.addEvent方法
ADS.addEvent(example,'mouseover',myOrneryBeast);
}
ADS.addEvent(window,'load',initPage);

通过call()和apply()重新定义执行环境,同样我们通过一个例子看一下

function doubleCheck()
{
this.message='Are you sure you want to leave?';
} doubleCheck.prototype.sayGoodbye=function()
{
return confirm(this.message)
}
initPage()
{
var clickedLink=new doubleCheck();
var links=document.getElementsByTagName('a');
for (var i = 0;i<links.length ;i++ )
{
ADS.addEvent(links[i],'click',clickedLink.sayGoodbye);
}
}
//这部分我一开始也没看懂,不前面的this 又看了一边,才稍微有点想明白。
//当sayGoodbye方法在<a>这个HTML中执行时,this所引用的就是这个HTML元素,而不是期望的clickedLink对象
ADS.addEvent(window,'load',initPage)

解决办法:用function对象的call() 或者apply()
让方法thisy引用window对象的情况下可以clickedLink.sayGoodbye.call(window);或者clickedLink.sayGoodbye.apply(window);

对于call而言,每个参数都应该位于对象之后比如:

functionReference.call(object,argument1,argument2,....);

对于apply(),则应该将方法参数作为一个数组放在第二个参数位置上传递:

functionReference.apply(object,arguments)//这是call和apply的唯一区别

//下面函数主要是为了给原始函数(有func参数传递)创建一个新的环境。之后虽然原始函数仍然接受同样的参数,但是他却有了不同的环境
//(菜鸟通过实力图,理解稍微好一点。仅仅是稍微)
function bindFunction(obj,func)
{
return function ()
{
func.apply(obj,arguments);
}
}

将此例用在刚刚的doubleCheck()方法中

function doubleCheck()
{
this.message='Are you sure you want to leave?'; }
douleCheck.prototy.sayGoodbye=function()
{
return confirm(this.message);
}
initPage()
{
var clickLink=new doubleCheck();
var links=document.getElementsByTagName('a'); for (var i = 0;i<links.length ;i++ )
{
//已经将刚刚的方法加入ADS库中
ADS.addEvent(links[i],'click',ADS.bindFunction(clickedLink,clickedLink.sayGoodby));
}
}

本节就记录到这儿了,菜鸟接下来还要继续学习js的关于try{}catch{}的相关只是。

JavaScript DOM高级程序设计2.3 this--我要坚持到底!的更多相关文章

  1. JavaScript DOM高级程序设计 3.-DOM2和HTML2--我要坚持到底!

    由一个HTML进行说明,我就不敲了,直接copy <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " ...

  2. JavaScript DOM高级程序设计 2.4-try{}catch{}--我要坚持到底!

    先看一段有异常的语句 var sound = 'Roar!'; function myOrneryBeast() { this.style.color='green';//window没有style属 ...

  3. JavaScript DOM高级程序设计 7.向应用程序加入Ajax--我要坚持到底!

    有时候,或许是因为理解能力,也或许是因为浮躁,看东西总是不入心,而且还老是想跳过本节,或者赶紧看完本节,这样的恶性循环,让我在即没有真正的学习到知识,又打击我的学习信心,还浪费了我很多事件,我想,当遇 ...

  4. JavaScript DOM高级程序设计 4.3控制事件流和注册事件侦听器--我要坚持到底!

    一.事件流 我们通过下面一个实例,进行说明. <body> <h1>Event Flow</h1> <ul id="nav"> &l ...

  5. JavaScript DOM高级程序设计 3.6 实例 将HTML代码转换成DOM代码(附源码)--我要坚持到底!

    作为一名Web开发者,最讨厌的事情就是重复性任务,摆脱乏味的日常重复性事物的一种方法,是借助可重用的对象或者说与你现在建立的ADS库类似的库,另外一种让事情变得有意思,且能够加速开发进程的方式是编写能 ...

  6. JavaScript DOM 高级程序设计读书笔记二

    响应用户操作和事件 事件就是操作检测与脚本执行的组合,或者基于检测到的操作类型在某个对象上调用事件侦听器(事件处理程序). 事件的类型 事件可以分为几种类型:对象事件,鼠标事件,键盘事件(只适用于do ...

  7. JavaScript DOM 高级程序设计读书笔记一

    创建可重用的对象 简而言之,对象就是包含一组变量(称为属性)和函数(称为方法)的集合的实例.对象通常由类派生而来,而类中定义了对象拥有的属性和方法.如果你的脚本中都是对象之间的交互操作,那么就可以称之 ...

  8. JavaScript DOM高级程序设计 5动态修改样式和层叠样式表2--我要坚持到底!

    把样式置于DOM脚本之外 style属性 我们可以这样设置前景色之类的属性: element.style.color='red'; 也可以使用下面的代码设置背景颜色: element.style.ba ...

  9. JavaScript DOM高级程序设计 5动态修改样式和层叠样式表1(源代码)--我要坚持到底!

    W3C DOM2样式规范 现在这边贴出本章要的源代码,注意要结合前面用到的ADS库http://vdisk.weibo.com/s/Dq8NU CSSStyleSheet对象属性: type :始终是 ...

  10. JavaScript DOM高级程序设计2.1创建可重用的对象--我要坚持到底!

    1.对象中包含什么 在javascript中,从函数到字符串实际上都是对象 继承 //创建一个person对象的实例 var penson={}; person.getName=function(){ ...

随机推荐

  1. 【原】EF简单使用

    /// <summary> /// 数据上下文对象 /// </summary> static TestEntities te = new TestEntities(); st ...

  2. 为 Web 设计师准备的 25+ 款扁平 UI 工具包

    Flat UI Kit by Riki Tanone (free) Flat UI Kit (PSD) by Devin Schulz (free) Eerste UI Kit (free) Metr ...

  3. mysql之创建外键报150错误的处理方法

    这几天由于在赶项目进度,也就没有及时记录下自己的学习情况 ,在完成项目的这段时间里,碰到了很多问题,在解决问题的过程中学习了不少技巧. 这里就主要介绍一下在mysql数据库中为表之间建立外键时报100 ...

  4. PHP的$_SERVER['HTTP_HOST']获取服务器地址功能详解,$_SERVER['HTTP_X_FORWARDED_HOST']

    uchome的index文件中的二级域名功能判断,使用了php的$_SERVER['HTTP_HOST'],开始对这个不是很了解,所以百度了一下,发现一篇帖子有点意思,转发过来做个记录. 在php中, ...

  5. Win7 64bit 成功安装ArcView3.X

    本人参考 链接 已在Win7 64Bit 笔记本上成功安装ArcView3.3,于是记录以下心得。 Win7 64Bit安装不了ArcView3.X的原因在于: 1,ArcView3.X属于16Bit ...

  6. 如何应用CLR线程池来管理多线程

        class Program     {         static void Main(string[] args)         {             int intWorkerT ...

  7. linux ssh 安装、安全设置

    环境:ubuntu 12.04   一.简单安装设置 1. 安装ssh 服务器 $ sudo apt-get install openssh 2. 查看运行状态 $ service ssh statu ...

  8. 巧用九宫格以减少UI资源量

    UI资源量对资源包大小和内存的影响 UI资源具有以下特点: (1)UI资源几乎都是图片,而图片是最占资源量的资源类型之一. (2)Unity不支持外部压缩,即使在外部将一个10MB的图片压缩到只剩1M ...

  9. Deferred Shading(延迟渲染)

    1.简介      在计算机图形学的词典里,Shading表示“对受光物体的渲染”,这个渲染过程包括下面几步[1]: 1) 计算几何多边形(也就是Mesh).      2) 决定表面材质特性,例如法 ...

  10. SQL SERVER数据导入

    我的博客已好久没有文字方面的记载了,好歹昨天已经结束软件设计师的考试了,今天怎么说也需要锻炼自己的写作能力.不然真怕自己又像上一年一样,一停就一年多了. 想好好学习数据库(SQL SERVER)方面的 ...