浅谈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 假如说你想复制一个简单变量.很简单: ...
随机推荐
- PAT B1022 D进制的A+B (20 分)
输入两个非负 10 进制整数 A 和 B (≤),输出 A+B 的 D (1)进制数. 输入格式: 输入在一行中依次给出 3 个整数 A.B 和 D. 输出格式: 输出 A+B 的 D 进制数. 输入 ...
- flask 入门(二)
Windows(提前安好virtualenv:pip install virtualenv) 一.准备: 1.启动pycharm 2.创建flask项目 二.基本库安装和设置 1.创建沙盒virt ...
- Android动态的全屏和退出全屏
转自:http://chroya.iteye.com/blog/974031 让程序全屏的方法,大家都知道,那是静态的,程序运行之初就申明了.但是如果有这样的需求:要在程序运行的过程中,执行了某个操作 ...
- tarjan - 强连通
如果两个点可以互相到达,则称为强连通.如果有向图G每个点都可以互相到达,则称为强连通图.其中G中的极大强连通子图,则称为强连通分量.现求强连通分量是多少,且哪些点属于同一个强连通分量 tarjan由d ...
- DRUPAL7 : 安装中文版本时遇到的问题
http://yeenav.com是基于Drupal 7+汉化资源 搭建. 期间遇到一些麻烦, 做个记录. 首先把语言包drupal-7.0.zh-hans.po 放在htdocs/drupal-7. ...
- 树形DP 复习
树形DP 树形DP:建立在树上的动态规划 一般有两种传递方式:根→叶或叶→根 前者出现在换根DP中,一般操作是求出某一个点的最优解,再通过这一个点推知其他点的最优解. 后者是树形DP的常见形式,一般树 ...
- 【Qt】QLabel实现的圆形图像
本篇只描述圆形图像的两种实现方式,动态阴影边框如下: [Qt]QLabel之动态阴影边框 目前实现的效果如下: 左右两边实现的方式不同: 右边比较简单 min-width: 100px; max-wi ...
- 01-BAT算法特训班
- 【第三课】Centos 7.x系统安装和网络配置以及远程密钥登录
目录 一.安装CentOS 7.3 二.配置网络 1.使用dhclient命令自动获取ip地址 2.使用ip addr或ifconfig命令查看网卡信息 3.使用route命令查看路由信息 4.通过修 ...
- banner 跟随鼠标呈现视差效果
参考 Element 官网,利用 js / jq 和 css3, 实现某图片随着鼠标移动呈现的视差效果. <!DOCTYPE html> <html> <head> ...