javascript this 的工作原理
JavaScript 有一套完全不同于其它语言的对 this 的处理机制。 在五种不同的情况下 ,this 指向的各不相同。
1.全局范围内
当在全部范围内使用 this,它将会指向全局对象。
2.函数调用
foo(); 这里的this,也指向全局对象。
3.方法调用
var test = {};
test.foo = function(){
console.log( this === test ); // true
}
test.foo(); // 这里this指的是test
4.调用构造函数
var Foo = function(name){
this.name = name; //这里的this指的是通过new关键字创建的实例对象
}
var foo = new Foo("Mr.枫");
console.log(foo.name); //Mr.枫
5.显式的设置 this
var bar = {};
function foo(a, b, c) {
console.log(this === bar); // true
}
foo.call(bar, 1, 2, 3);
foo.apply(bar, [1, 2, 3]);
当使用 Function.prototype 上的 call 或者 apply 方法时,函数内的 this将会被 显式设置为函数调用的第一个参数。
注意:
在对象的字面声明语法中,this 不能用来指向对象本身。
eg:
var obj = {
me : this
}
这里的 obj.me 不会指向 obj 指向的是这段代码的当前作用域下的this,若在浏览器中运行,指向的是window对象。
常见误解:
1.第二个规则,也就是直接调用函数时,this 指向全局对象,被认为是JavaScript语言一个错误设计的地方,因为它从来就没有实际的用途。
Foo.method = function() {
function test() {
// this 将会被设置为全局对象(译者注:浏览器环境中也就是 window 对象)
}
test();
}
一个常见的误解是 test 中的 this 将会指向 Foo 对象,实际上不是这样子的。
为了在 test 中获取对 Foo 对象的引用,我们需要在 method 函数内部创建一个局部变量指向 Foo 对象。
Foo.method = function() {
var that = this;
function test() {
// 使用 that 来指向 Foo 对象
}
test();
}
that 只是我们随意起的名字,不过这个名字被广泛的用来指向外部的 this对象。
2.另一个看起来奇怪的地方是函数别名,也就是将一个方法赋值给一个变量。
var test = someObject.methodTest;// 将方法赋值给变量test test();
上例中,test 就像一个普通的函数被调用;因此,函数内的 this 将不再被指向到 someObject 对象。
javascript this 的工作原理的更多相关文章
- JavaScript定时器的工作原理(翻译)
JavaScript定时器的工作原理(翻译) 标签(空格分隔): JavaScript定时器 最近在看ajax原理的时候,看到了一篇国外的文章,讲解了JavaScript定时器的工作原理,帮助我很好的 ...
- 我们应该如何去了解JavaScript引擎的工作原理
“读了你的几篇关于JS(变量对象.作用域.上下文.执行代码)的文章,我个人觉得有点抽象,难以深刻理解.我想请教下通过什么途径能够深入点的了解javascript解析引擎在执行代码前后是怎么工作的,ec ...
- 【转】我们应该如何去了解JavaScript引擎的工作原理
原文地址:http://www.nowamagic.net/librarys/veda/detail/1579 昨天收到一封来自深圳的一位前端童鞋的邮件,邮件内容如下(很抱歉,未经过他的允许,公开邮件 ...
- JavaScript原型继承工作原理
原型继承的定义 当你阅读关于JS原型继承的解释时,你时常会看到以下这段文字: 当查找一个对象的属性时,JavaScript 会向上遍历原型链,直到找到给定名称的属性为止.——出自JavaScript秘 ...
- js:我们应该如何去了解JavaScript引擎的工作原理(转)
http://www.nowamagic.net/librarys/veda/detail/1579 昨天收到一封来自深圳的一位前端童鞋的邮件,邮件内容如下(很抱歉,未经过他的允许,公开邮件内容,不过 ...
- 浏览器中“JavaScript解析器”工作原理
浏览器在读取HTML文件的时候,只有当遇到<script>标签的时候,才会唤醒所谓的“JavaScript解析器”开始工作. JavaScript解析器工作步骤: 1.“找一些东西”: v ...
- JavaScript引擎的工作原理
http://my.oschina.net/fuckBAT/blog/318355?fromerr=jK6wCh1p#OSC_h4_4
- 我们应该如何去了解JavaScript引擎的工作原理 系列
http://www.nowamagic.net/librarys/veda/detail/1579
- JavaScript的工作原理:解析、抽象语法树(AST)+ 提升编译速度5个技巧
这是专门探索 JavaScript 及其所构建的组件的系列文章的第 14 篇. 如果你错过了前面的章节,可以在这里找到它们: JavaScript 是如何工作的:引擎,运行时和调用堆栈的概述! Jav ...
随机推荐
- android本地音乐播放器
乐乐音乐播放器更新到2.0版本了,之前1.0版本更多的是试验性实践,这次更新的2.0版本,更多的是将1.0的功能移植到2.0,在界面和皮肤风格上,参考了 天天动听 界面,在歌词显示方面 与 1.0 版 ...
- Shell Scripts - 条件语句,case语句,function功能
修改之前的代码 1.判断 $1 是否为 hello,如果是的话,就显示 "Hello, how are you ?": 2.如果没有加任何参数,就提示使用者必须要使用的参数 ...
- Linux文件与目录的默认权限与隐藏权限 - umask, chattr, lsattr, SUID, SGID, SBIT, file
文件默认权限:umask [root@www ~]# umask 0022 <==与一般权限有关的是后面三个数字! [root@www ~]# umask -S u=rwx,g=rx,o=rx ...
- <转>如何在iOS 7中设置barTintColor实现类似网易和 Facebook 的 navigationBar 效果
转自:i‘m Allen的博客 先给代码:https://github.com/allenhsu/CRNavigationController 1. 问题的表现 相信很多人在 iOS 7 的适配过程中 ...
- Spring Cloud入门教程-Ribbon实现客户端负载均衡
简介 我们继续以之前博客的代码为基础,增加Ribbon组件来提供客户端负载均衡.负载均衡是实现高并发.高性能.可伸缩服务的重要组成部分,它可以把请求分散到一个集群中不同的服务器中,以减轻每个服务器的负 ...
- unity零基础开始学习做游戏(二)让你的对象动起来
-------小基原创,转载请给我一个面子 小基认为电子游戏与电影最重要的区别就是交互,如果电子游戏没有让你输入的交互功能的话,全程都"只可远观,而不可鼓捣"的话,你可能是在看视频 ...
- PHP实现zip压缩打包下载
先来看PHP实现文件及文件夹的zip压缩 这里使用PHP扩展的ZipArchive类,在使用之前要将php.ini文件中的zlib.output_compression设置为On 代码如下: publ ...
- ES入门笔一
ES6一共有6种声明变量的方法 --ES5只有var 和 function --ES6新增了let.const.import和class四种 ES6新增let和const,用来声明变量,是对var的扩 ...
- 常用的几个在线生成网址二维码的API接口
原创,转载请注明出处! 用接口的好处就是简单,方便,时时更新,二维码生成以后不用保存在本项目服务器上面,可以减少不必要的开支,无需下载安装什么软件,可简单方便地引用,这才是最便捷的免费网址二维码生成 ...
- AE的空间分析(转载)
1.1 ITopologicalOperator接口 1.1.1 ITopologicalOperator接口简介ITopologicalOperator接口用来通过对已存在的几何对象做空间拓扑运算以 ...