js中的this和var里面的文章
来源:互联网 发布:java中类和对象的概念 编辑:程序博客网 时间:2024/06/06 04:53
在面向对象编程语言中,对于this关键字我们是非常熟悉的。比如C++、C#和Java等都提供了这个关键字,虽然在开始学习的时候觉得比较难,但只要理解了,用起来是非常方便和意义确定的。JavaScript也提供了这个this关键字,不过用起来就比经典OO语言中要"混乱"的多了。
下面就来看看,在JavaScript中各种this的使用方法有什么混乱之处?
1、在HTML元素事件属性中inline方式使用this关键字:
// 可以在里面使用this
">division element</div>
我们一般比较常用的方法是在此使用:javascirpt: EventHandler(this),这样的形式。不过这里其实可以写任何合法的JavaScript语句,要是高兴在此定义个类也可以(不过将会是个内部类)。这里的原理是脚本引擎生成了一个div实例对象的匿名成员方法,而onclick指向这个方法。
2、用DOM方式在事件处理函数中使用this关键字:
<scriptlanguage="javascript">
var div= document.getElementById('elmtDiv');
div.attachEvent('onclick', EventHandler);
function EventHandler()
{
// 在此使用this
}
</script>
这时的EventHandler()方法中的this关键字,指示的对象是IE的window对象。这是因为EventHandler只是一个普通的函数,对于attachEvent后,脚本引擎对它的调用和div对象本身没有任何的关系。同时你可以再看看EventHandler的caller属性,它是等于null的。如果我们要在这个方法中获得div对象引用,应该使用:this.event.srcElement。
3、用DHTML方式在事件处理函数中使用this关键字:
<scriptlanguage="javascript">
var div= document.getElementById('elmtDiv');
div.onclick=function()
{
// 在此使用this
};
</script>
这里的this关键字指示的内容是div元素对象实例,在脚本中使用DHTML方式直接为div.onclick赋值一个EventHandler的方法,等于为div对象实例添加一个成员方法。这种方式和第一种方法的区别是,第一种方法是使用HTML方式,而这里是DHTML方式,后者脚本解析引擎不会再生成匿名方法。
4、类定义中使用this关键字:
{
var myName= 'jsclass';
this.m_Name= 'JSClass';
}
JSClass.prototype.ToString= function()
{
alert(myName+ ', ' + this.m_Name);
};
var jc= new JSClass();
jc.ToString();
这是JavaScript模拟类定义中对this的使用,这个和其它的OO语言中的情况非常的相识。但是这里要求成员属性和方法必须使用this关键字来引用,运行上面的程序会被告知myName未定义。
5、为脚本引擎内部对象添加原形方法中的this关键字:
{
var fnName= this.toString();
fnName= fnName.substr(0, fnName.indexOf('('));
fnName= fnName.replace(/^function/, '');
return fnName.replace(/(^/s+)|(/s+$)/g, '');
}
function foo(){}
alert(foo.GetName());
这里的this指代的是被添加原形的类的实例,和4中类定义有些相似,没有什么太特别的地方。
6、结合2&4,说一个比较迷惑的this关键字使用:
{
this.m_Text= 'division element';
this.m_Element= document.createElement('DIV');
this.m_Element.innerHTML= this.m_Text;
this.m_Element.attachEvent('onclick',this.ToString);
}
JSClass.prototype.Render= function()
{
document.body.appendChild(this.m_Element);
}
JSClass.prototype.ToString= function()
{
alert(this.m_Text);
};
var jc= new JSClass();
jc.Render();
jc.ToString();
我就说说结果,页面运行后会显示:"division element",确定后点击文字"division element",将会显示:"undefined"。
7、CSS的expression表达式中使用this关键字:
<tr>
<td>
<divstyle="width: expression(this.parentElement.width);
height: expression(this.parentElement.height);">
division element</div>
</td>
</tr>
</table>
这里的this看作和1中的一样就可以了,它也是指代div元素对象实例本身。
8、函数中的内部函数中使用this关键字:
{
this.Name= 'Outer Name';
function InnerFoo()
{
var Name= 'Inner Name';
alert(Name+ ', ' + this.Name);
}
return InnerFoo;
}
OuterFoo()();
运行结果显示是:"Inner Name, Outer Name"。按我们在2中的讲解,这里的结果如果是"Inner Name, undefined"似乎更合理些吧?但是正确的结果确实是前者,这是由于JavaScript变量作用域的问题决定的,详细了解推荐参看"原来JScript中的关键字'var'还是有文章的"一文及回复。
说了这么多JavaScript中this的用法,其实this最根本的特性还是和OO语言中的定义相吻合的。之所以有这么多看似混乱的使用方式,是因为JavaScript语言(解释器和语言本身的内容)本身在实现上是遵循OO的(Object-based),连它的所有数据类型都是对象,也有Object这样一个super Object。但是这个语言在运行上(runtime),就没有遵循完备的OO特点,所以就出现了this的指代混乱。
- js中的this和var里面的文章
- js 里面的this
- JS中的var self=this【转】
- js中的let和var
- Jquery中的$(this)和JS中的this的差别
- js中的this & var, function & object, prototype & apply
- js中的this和函数的调用
- jquery里面的$(this) 和this区别
- js中的this指向和改变this指向的方法
- js怎么调用 var a=function (){ }()里面的方法
- JS var self =this
- 【JS】var _this = this;
- this在js里面的含义
- js常见的var that = this的用法
- JS全局变量VAR和THIS--在函数内部,加var是局部变量,不加是全局变量
- js中var self=this的解释
- js中var self=this的解释
- js中var self=this的解释
- fwrite oxoa和oxod oxoa的问题
- 数据输出语句
- android Button的应用
- VC++ 常见调试错误:fatal error LNK1561: entry point must be defined
- 生活随笔:态度需要端正
- js中的this和var里面的文章
- C#如何使用转义字符来正确的表示双引号、单引号等字符串 asp.net
- arm 映像文件存储器映射调整 android ld link script
- 数组、链表、哈希……Qt中丰富的容器类
- android 设置Activity标题
- Qt 程序在 windows 下的发布
- android拨打电话
- scanf函数
- 终于狠下心来买了本书