浅谈JavaSript中的this
JavaScript的this对初学者来说一直是一个很头疼的问题,因为它的指向刚刚接触的时候往往觉得有点莫名奇妙,这篇博客用实例来概括一下,this代表什么以及如何改变函数的this.
在<JavaScript高级程序设计>一书中,对this做出了简单的介绍.即"this引用了函数据以执行的环境对象".如何理解这句话呢?先来看看第一个实例:
function testFun1() {
var num = 3;
alert(this.num);
}
function testFun2() {
var num = 4;
testFun1();
}
testFun2();//undefined
上面的代码输出undefined,从这个例子我们可以看出this是不会引用具体的某个函数对象的(虽然在JavaScript中,函数也是对象的一种).那么在上述情况下,this代表什么呢?可以在testFun1()中运行下面代码:
alert(this);
输出的结果如下:

可以得出如下结论:在直接调用函数的时候,this代指window对象!
为了证明上述结论,可以使用下面例子验证:
var num = 10;
function testFun1() {
var num = 3;
alert(this.num);
}
function testFun2() {
var num = 4;
testFun1();
}
testFun2();//
接下来是第二个示例,我们将函数作为一个对象的属性:
var num = 10;
function testFun1() {
var num = 3;
alert(this.num);
}
var o = new Object();
o.num = 2;
o.fun1 = testFun1;
o.fun1();//
可以看出,当通过对象调用函数的时候(这个和Java中的对象调用方法倒挺类似的),则this指向这个对象.那么如果存在多层对象的嵌套呢?看看下面的例子:
var num = 10;
var inObj = new Object();
var outObj = new Object();
outObj.innerObj = inObj;
outObj.num = 10;
inObj.num = 5;
inObj.infun = testFun1;
function testFun1() {
alert(this.num);//
}
outObj.innerObj.infun();
从上面的例子看出来,当存在多层对象的嵌套的时候,则this指向离函数"最近"的对象.
讨论完this之后,我们在讨论下如何改变函数中的this.下面的示例演示了两种改变this的方式:
var num = 3;
function print() {
alert(this.num);
}
var obj = {"num":10};
print.call(window);//
print.call(obj);//
print.call();//
var objPrint = print.bind(obj);
var windowPrint = print.bind(window);
objPrint();//
windowPrint();//
call方法代表执行函数,传入的第一个参数代指函数的执行环境,因此在传入window,则通过call方法执行函数的时候.this指向window.传入对象的时候,this指向该对象.
bind方法则将该函数绑定一个执行环境,并且返回绑定该执行环境的函数对象.可以直接调用.
浅谈JavaSript中的this的更多相关文章
- 浅谈Java中的equals和==(转)
浅谈Java中的equals和== 在初学Java时,可能会经常碰到下面的代码: 1 String str1 = new String("hello"); 2 String str ...
- 浅谈Linux中的信号处理机制(二)
首先谢谢 @小尧弟 这位朋友对我昨天夜里写的一篇<浅谈Linux中的信号处理机制(一)>的指正,之前的题目我用的“浅析”一词,给人一种要剖析内核的感觉.本人自知功力不够,尚且不能对着Lin ...
- 浅谈Java中的对象和引用
浅谈Java中的对象和对象引用 在Java中,有一组名词经常一起出现,它们就是“对象和对象引用”,很多朋友在初学Java的时候可能经常会混淆这2个概念,觉得它们是一回事,事实上则不然.今天我们就来一起 ...
- 浅谈Java中的equals和==
浅谈Java中的equals和== 在初学Java时,可能会经常碰到下面的代码: String str1 = new String("hello"); String str2 = ...
- 转【】浅谈sql中的in与not in,exists与not exists的区别_
浅谈sql中的in与not in,exists与not exists的区别 1.in和exists in是把外表和内表作hash连接,而exists是对外表作loop循环,每次loop循环再对内表 ...
- 浅谈iOS中的userAgent
浅谈iOS中的userAgent User-Agent(用户代理)字符串是Web浏览器用于声明自身型号版本并随HTTP请求发送给Web服务器的字符串,在Web服务器上可以获取到该字符串. 在公司产 ...
- 浅谈JavaScript中的闭包
浅谈JavaScript中的闭包 在JavaScript中,闭包是指这样一个函数:它有权访问另一个函数作用域中的变量. 创建一个闭包的常用的方式:在一个函数内部创建另一个函数. 比如: functio ...
- 浅谈sql中的in与not in,exists与not exists的区别
转 浅谈sql中的in与not in,exists与not exists的区别 12月12日北京OSC源创会 —— 开源技术的年终盛典 » sql exists in 1.in和exists ...
- 浅谈Java中的深拷贝和浅拷贝(转载)
浅谈Java中的深拷贝和浅拷贝(转载) 原文链接: http://blog.csdn.net/tounaobun/article/details/8491392 假如说你想复制一个简单变量.很简单: ...
随机推荐
- Python2.7-bisect
bisect 模块,对已经排好序的序列进行筛选,添加新元素,效率高,不用在插入新元素后重新排序,可以快速找到小于指定值的位置 个人想法:与 heapq 的堆可以较好的结合使用 模块方法:bisect_ ...
- liMarquee – jQuery无缝滚动插件(制作跑马灯效果)
liMarquee 是一款基于 jQuery 的无缝滚动插件,类似于 HTML 的 marquee 标签,但比 marquee 更强大.它可以应用于任何 Web 元素,包括文字.图像.表格.表单等元素 ...
- Leetcode——300. 最长上升子序列
题目描述:题目链接 给定一个无序的整数数组,找到其中最长上升子序列的长度. 示例: 输入: [10,9,2,5,3,7,101,18] 输出: 4 解释: 最长的上升子序列是 [2,3,7,101], ...
- HDU 1285 经典拓扑排序入门题
确定比赛名次 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Total Subm ...
- easyui的datagrid
datagrid数据的绑定方式: 1)data 后跟数据行的json串 2)url 后跟{"total":,"rows":,"foot":} ...
- 【LeetCode234】Palindrome Linked List★
题目描述: 解题思路: 判断一个单向链表是否是回文链表,并且要求O(n)的时间复杂度和O(1)的空间复杂度. 方法有以下几种: 1.遍历整个链表,将链表每个节点的值记录在数组中,再判断数组是不是一个回 ...
- 20155316 《网络对抗》Exp8 Web基础
实验内容 实验1:Web前端HTML 能正常安装.启停Apache.理解HTML,理解表单,理解GET与POST方法,编写一个含有表单的HTML. 1.开启Apache服务 思路:使用service ...
- 《网络对抗》Exp7 网络欺诈防范
20155336<网络对抗>Exp7 网络欺诈防范 实验内容 本实践的目标理解常用网络欺诈背后的原理,以提高防范意识,并提出具体防范方法.具体实践有 简单应用SET工具建立冒名网站 (1分 ...
- Struts2将图片输出到页面
在做CRUD的过程中,添加页面是个表单,表单里面有一项是上传头像文件.这样表单提交后,头像文件上传了. 但这个文件存的地址是本地硬盘的一个文件夹.在编辑页面要做这个头像的回显的话,就需 ...
- 【转】从Shell脚本内部将所有标准输出及标准错误显示在屏幕并同时写入文件的方法
如果全部都要重定向的话每一条命令后面>>并不方便,可以这么做.在开头就声明 exec 1>>$log_file表示将脚本中所有的正确输出全部追加到$log_file,错误信息会 ...