解读JavaScript之this
来源:互联网 发布:linux用户权限文件 编辑:程序博客网 时间:2024/05/20 05:08
在《JavaScript高级程序设计》中提到,“this对象是在运行时基于函数的执行环境绑定的。” ,首先我们需要明白执行环境这个概念,在《你不知道的JavaScript》中指出:“call-site:the location in code where a function is called(not where it’s declared).” ,也就是说执行环境是函数被调用时的位置 。
按照我的理解,当函数被调用时,js引擎需要知道这个函数是在哪里被调用的,这时候函数如果声明在某个对象里,js引擎就只需要监听这个对象就可以了。如果不在某个对象里,则关联到全局对象上。所以函数执行环境就是函数所处的对象。
解决完call-site,还有this binding 。这给我感觉就有点像OS的PCB(进程控制块),this就像这个控制块里面的信息,记录了函数的执行环境地址。每个函数在被调用的时候会有一个this指针,指向执行环境。
理论知识差不多,是时候来点实践。
- 例子1
- function foo( ){
- //”use strict”
- console.log( this.a );
- }
- var a = 2;
- foo( ) ; //2
- foo函数的执行环境是全局对象。
- 不过这在严格模式下会报错,因为在严格模式下禁止this指向全局对象。
- ——————————————————————-
- 例子2
- function foo( ){
- console.log( this.a);
- }
- var obj2 = {
- a : 42,
- foo : foo
- }
- var obj1 = {
- a : 2 ,
- obj2 : obj2
- };
- obj1.obj2.foo( ) ; // 42
- 这个例子被调用的foo的执行环境是obj2对象
- —————————————————————
- 例子3
- function foo ( ){
- console.log( this.a );
- }
- var obj = {
- a : 2
- };
- foo.call( obj ); //2
- call , apply和bind函数都可以硬性改变this的指向,而且对改变之后的this指针再次绑定另一个执行环境是没效果的(称之为hard binding)
- —————————————————————–
- 例子4
- function foo( a ){
- this.a = a ;
- }
- var bar = new foo( 2 );
- console.log( bar.a ); //2
- 这个例子是通过new关键字来生成一个对象,而且这种也类似上面的硬性绑定。
- 这3个例子取自《你不知道的JavaScript》,例1被作者称为Default Binding , 例2 被称为 Implict Binding , 例3 被称为Explicit Binding , 例4 被称为 new Binding。
这里还有两个要注意的点
js里调用事件回调函数中this的上下文是全局的,所以通常我们都会
self = this
btn.addEventListener ( ‘click’ ,function (e) {
alert( self.Name)
})
在ES6中,箭头函数的this是绑定在函数声明的时候而非调用的时候。
第一次写博文,排版和组织词汇难免有些不足,这博文主要是我自己的平时学习的总结,如有错误望留言指正,觉得写得还可以的,请读者多多留言,一起交流学习。
阅读全文
0 0
- 解读JavaScript之this
- 6.JavaScript深入之从ECMAScript规范解读this
- 详细解读JavaScript的this关键字
- JavaScript之this关键字
- JavaScript之this
- JavaScript 之 this 详解
- JavaScript加强之this
- javascript之this详解
- JavaScript之this释疑
- javascript之this关键字
- javascript之this指针
- 深入浅出JavaScript之this
- javascript学习之this
- JavaScript之初探this
- JavaScript之学习this
- JavaScript之this
- JavaScript之this对象
- javascript之this
- Fliter-----补6-16
- Servlet&JSP 第八章 自定义标签
- ssm(springmvc4+spring4+mybatis3)整合实战-个人博客系统-util介绍与开发首页
- vim命令
- Leetcode 8 String to Integer (atoi)
- 解读JavaScript之this
- Linux内核:关于中断你需要知道的【转】
- Windows服务编程之服务程序
- #Unity坐标系,向量,四元数(一)
- mysql:cannnot create file navicatdesignquery.sql.bak 系统找不到指定路径
- android 图片转换
- 路由器端口映射
- [Hdu 3046]Pleasant sheep and big big wolf
- android OkHttp3.0介绍