前言:

    看文章标题你就知道,这篇文章我只讲一个简单的Javascript的this关键字,说它简单——它又不简单,因为曾几何时我也对this关键字有些困惑,它也确实会让不少程序员感到不解——它像是一个身份多变的“指针”,有时仅看代码都很难分辨出其当前所指向的对象;恰好这两天我突然想到应该写篇关于Javascript方面的博客,也算是为以后的公司技术培训做点儿准备。这篇文章,我可能更倾向于,用代码来直接的体现我要描述的内容。好的文章不在于它的篇幅长、内容丰富,而在于或者说更重要的是——应该用言简意赅的内容让读者快速、没有歧义的明白你所要讲解的内容;而对于技术文章,代码往往就是最好的描述。好了,直接切入正题...

  

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="jquery.js" type="text/javascript"></script>
</head>
<body>
<input id="btnTest" type="button" value="Test" /><br />
<input id="btnTest2" type="button" value="Test2" /><br />
<input id="btnFun" type="button" value="Inner Fun" onclick="this.value=new Date().getSeconds();alert(this);" /><br />
<script type="text/javascript">
//#region 全局this对象,即可以通过this访问到当前页面中的所有(标签或jquery等)对象,此this没有什么实际意义,也很少会这样使用
this.$.trim();
alert(this.btnFun);
alert(this.window.location);
//#endregion $("#btnTest").click(function () {
alert(this.value); //此this是btnTest标签对象,输出:Test
$("#btnTest2").click(function () {
alert(this.value); //此this是btnTest2标签对象,输出:Test2
});
});
</script> <script type="text/javascript">
function UserInfo(name, age) {
var _mySecret = "Can't tell you!";
this.Name = name;
this.Age = age; this.GetMySecret = function () {
/// <summary>获取我的秘密</summary>
alert(_mySecret);
} this.IntroduceMySelf = function () {
/// <summary>自我介绍</summary>
alert("Hello,My Name is:" + this.Name + ", Age is:" + this.Age);
}
} var userObj = new UserInfo("Tom", 23);
userObj.GetMySecret();
userObj.IntroduceMySelf();
</script>
<br />
</body>
</html>

  

上面的代码,就是我们常见的this关键字的使用,也在其中添加了必要的代码注释,以说明其当前所指代的对象。

  this关键字:可以理解为是对象的指针,其具体所指向(对应)的对象要看其(使用)所处的(上下文)环境。其常见的使用场景,所代表的对象大致可以分为以下两类:

  1.html标签(元素)对象:即在html标签绑定的事件(onclick,onmouseover...)中,this关键字表示当前标签的Dom对象,通过this即可完全控制、操纵此html标签,如:设置其样式或绑定其它事件等。

  2.function(类)对象:首先,你可能会有疑问——为什么叫做function(类)对象?众所周知,javascript不存在类(class)的概念,但它所具有的特性却可以比较好的实现"模拟类",如上面的代码中的:function UserInfo(name, age)方法。在此对象中this关键字可以很自然的理解为当前的function(类)对象,其作用和用法跟面向对象编程语言(如:C#)里的this关键字很类似,所以,UserInfo这个方法(类),如果转换为C#代码,想必你会能更直观的理解。代码如下: 

     public class UserInfo
{
string _mySecret = "Can't tell you!"; public string Name { get; set; }
public int Age { get; set; } public UserInfo(string name, int age)
{
this.Name = name;
this.Age = age;
} public string GetMySecret()
{
return _mySecret;
} public string IntroduceMySelf()
{
return ("Hello,My Name is:" + this.Name + ", Age is:" + this.Age);
}
}

   本文就到此结束,如果还是有疑问的地方,或文中有“误人子弟”的描述,希望大家能留言提出!

谈谈Javascript的this关键字(this is not this)的更多相关文章

  1. 谈谈javaScript

    谈谈javaScript  (杰我学习) 一. 什么是JavaScript       人们通常所说的JavaScript,其正式名称为ECMAScript.这个标准由ECMA组织发展和维护.ECMA ...

  2. 谈谈javascript中的prototype与继承

    谈谈javascript中的prototype与继承 今天想谈谈javascript中的prototype. 通常来说,javascript中的对象就是一个指向prototype的指针和一个自身的属性 ...

  3. 浅谈JavaScript的New关键字

    原型和闭包算是JavaScript中最常见,最难以理解,最容易被当做问题的两个部分,当然还有它们的延伸,如作用域链,继承等等吧,我最近也是各种看,各种翻,记录点自己的心得,写写总会让自己的理解更深一些 ...

  4. [No000069]Javascript中this关键字详解

    Quiz 请看下面的代码,最后alert出来的是什么呢?(chrome下按F12,选择Console直接复制粘贴运行) var name = "Bob"; var nameObj ...

  5. 深入解析Javascript中this关键字的使用

    深入解析Javascript中面向对象编程中的this关键字 在Javascript中this关键字代表函数运行时,自动生成的一个内部对象,只能在函数内部使用.比如: function TestFun ...

  6. 正确理解javascript的this关键字

    javascript有this关键字,它和javascript的执行上下文有着密切的关系,就是说this具体指代什么要根据它的上下文来判断. 一.this和对象的关系    var Person={ ...

  7. 深入理解Javascript之this关键字

    深入理解Javascript之this关键字 作者: Laruence(   ) 本文地址: http://www.laruence.com/2009/09/08/1076.html 转载请注明出处 ...

  8. JavaScript中this关键字的使用比较

    JavaScript中this关键字的使用比较 this关键字在JavaScript中,用的不能说比较多,而是非常多.那么熟悉this关键字的各种用法则显得非常关键. this有时候就是我们经常说的上 ...

  9. JavaScript控制流及关键字与C语言之比较

    学习JavaScript控制流及关键字概念前,对有过C语言学习经验的同学来说,那么关键字,控制语句概念并不陌生.我们先来看看C语言吧: C语言的32个关键字和9种控制语句 9种控制语句: if.if- ...

随机推荐

  1. linux----------纯净的centos7.0上安装lnmp环境的步骤

    1.先看下screen -S lnmp 命令是否存在,不存在则安装.这个是个什么东东呢?百度一下( GNU Screen是一款由GNU计划开发的用于命令行终端切换的自由软件.用户可以通过该软件同时连接 ...

  2. spring使用elasticsearch 5.x

    elasticsearch客户端选择 这里使用transport建立elasticsearch客户端 applicationContext.xml配置,属性可以采用读取属性文件的方式.参考类Prope ...

  3. -XX:PermSize -XX:MaxPermSize 永久区参数设置

    -XX:PermSize  -XX:MaxPermSize   –设置永久区的初始空间和最大空间 -XX:PermSize 设置持久代(perm gen)初始值,物理内存的1/64 -XX:MaxPe ...

  4. android的listview的详细用法

    listview是android开发中的一个极其重要的控件.所以,要学会android,如果这个不会,基本是不会android的. 这里按照几个步骤介绍这个控件的使用. 1. 使用API中ArrayA ...

  5. mysql常用命令(2)

    1.连接Mysql 格式: mysql -h主机地址 -u用户名 -p用户密码 1.连接到本机上的MYSQL.首先打开DOS窗口,然后进入目录mysql\bin,再键入命令mysql -u root ...

  6. vs2005水晶报表无法运行在X64机器上

    要下载补丁:CRRedist2005_X64.msi http://download.csdn.net/download/gcy007/7106933

  7. yii2框架原生的结合框架使用的图片上传

    首先我们要从model层开始写起,主要是为了创建验证规则,还有图片上传的路径以及图片的命名规则(UploadForm.php) 接下来我们要在控制器层写好业务逻辑,就是什么情况下直接在调用model层 ...

  8. androidService总结

    2.服务 2-1:启动服务 2-1-1:创建服务 extends Service 2-1-2:注册 <service android:name="com.firefly.style_s ...

  9. map函数

    概述 map() 方法返回一个由原数组中的每个元素调用一个指定方法后的返回值组成的新数组. 语法 array.map(callback[, thisArg]) 参数 callback 原数组中的元素经 ...

  10. C#读取XML文件中有乱码的处理办法

    1.以文本的方式读取出xml内容 2.如果xml加载文本失败,替换掉乱码的内容 private static void loadxml(XmlDocument doc, string str) { t ...