JavaScript的self和this使用小结

JavaScript的self和this使用小结

本文摘自:/article/6235176.html

一、self

　　这个非常简单。我们知道，打开任何一个网页，浏览器会首先创建一个窗口，这个窗口就是一个window对象，也是js运行所依附的全局环境对象和全局作用域对象。self 指窗口本身，它返回的对象跟window对象是一模一样的。
也正因为如此，window对象的常用方法和函数都可以用self代替window。举个例子，常见的写法如“self.close();”，把它放
在<a>标记中：“<a
href="javascript:self.close();">关闭窗口</a>”，单击“关闭窗口”链接，当前页面关闭。

二、this关键字

　　在讲this之前，看下面的一段代码：

代码

　　本来的目的是想在body中添加一个span元素，对于这个span元素，制定了它的字体颜色，悬浮在它上面的鼠标样式和单击触发事件。问题就
出现在它的单击事件上（弹出"单击我:undefined"）。也许有人会说你丫傻呀，写这么多sb代码还不就是为了实现下面这个东东吗？

<span style='cursor:pointer;color:blue;' onclick="alert(this.innerHTML)">this的dom测试</span>

你看多简单直观，而且还不容易出错？！kao，我晕。我正要讲的是您正在使用的this.innerHTML中的this呀。
1、this到底指什么？
我们熟悉的c#有this关键字，它的主要作用就是指代当前对象实例（参数传递和索引器都要用到this）。在javascript中，this通常指向的是我们正在执行的函数本身，或者是指向该函数所属的对象（运行时）。
2、常见使用方式
（1）、直接在dom元素中使用

<input id="btnTest" type="button" value="提交" onclick="alert(this.value))" />

分析：对于dom元素的一个onclick（或其他如onblur等）属性，它为所属的html元素所拥有，直接在它触发的函数里写this，this应该指向该html元素。
（2）、给dom元素注册js函数
a、不正确的方式

代码

其弹出的结果是：

代码
正像注释写的那样，要注册dom元素事件，用EventUtil.addEvent(dom元素,事件名称,事件触发的函数名)即可， 移除时可以这样写：EventUtil.removeEvent(dom元素,事件名称,事件触发的函数名)。这是题外话，不说了。
(3)、类定义中使用this关键字
这个其实再常见不过，看示例：

代码

总结：到这里，对于开篇中的span弹出undefined的问题你是不是已经豁然开朗？如果你还在懵懂中，给个可有可无的提示：当前的这个span元素有没有textValue属性啊！？
三、void
1、定义
javascript中void是一个操作符，该操作符指定要计算一个表达式但是不返回值。
2、语法
void 操作符用法格式如下：
（1）. javascript:void (expression)
（2）. javascript:void expression
注意：expression是一个要计算的js标准的表达式。表达式外侧的圆括号是可选的，但是写上去你可以一眼就知道括弧内的是一个表达式（这和typeof后面的表达式语法是一样的）。
3、实例代码

function voidTest() {

void (alert("it is a void test")); //执行函数

var oTestNum = 1;
void (oTestNum++); //整数自加
alert(oTestNum);

oTestNum = 1;
void (oTestNum += " void test"); //整数加字符串
alert(oTestNum);
}
voidTest();

4、在a元素下使用void(0)
（1）适用情况
在网页中，我们经常看到html里的a标签不需要它导航到某一个页面时，href属性设置的写法：

<a href="#">link1</a>
<a href="javascript:void(0);">link2</a>

注意：第一种“#”的写法（其实#可以是多个，通常都是1个），当a元素所在的链接在浏览器一屏以下时，会导致页面回滚到顶部；所以当我们需要a标签不导航到其他页面，不需要网页位置的回滚，都会采取void(0)那种写法。
（2）ie6下void(0)造成的诡异问题
这个问题网上有很多讨论，个人认为“落叶满长沙”总结的很有代表性，这里就不再赘述了。