javascript scope的研究

简介:

 首先有个原则:

就是在Javascript中,对于scope的处理,如果是被对象调用的函数,比如o.f() 的形式,那么this 指针指向“点”前面的对象,比如这里的o.

如果是普通函数,也就是没有“点”号,那么对于浏览器来说,这个this指针指向的是window.

附上测试源代码:

 

 
 
  1. var theAccumulator={ 
  2.                                  
  3.          total:0, 
  4.          clear:function(){ 
  5.                  this.total=0 ; 
  6.                }, 
  7.          add:function(x){ 
  8.                 this.total+=x; 
  9.              }, 
  10.          getResult:function(){ 
  11.               return this.total; 
  12.              } 
  13.                                  
  14. function printResult(f){ 
  15.      alert("result=" + f()); 
  16.                                  
  17. theAccumulator.clear();  
  18. theAccumulator.add(100); 
  19. theAccumulator.add(200);           
  20. printResult(theAccumulator.getResult);   

在这种情况下,为什么是undefined呢?

因为printResult(theAccumulator.getResult) 传递进去的是一个类似C里面函数指针的方式,这个方式是可取的(没有任何语法毛病,我一开始以为是有语法毛病的),因为

 

 
 
  1. theAccumulator.getResult  

是代表以下函数体


 
 
  1.   
  2.  
  3. function(){ 
  4.  
  5. return this.total; 
  6.  
  7.  } 
  8.  
  9.   
  10.  
  11.   

所以原始写法就等效于printResult(


 
 
  1. function(){ 
  2.  
  3. return this.total; 
  4.  
  5.   } 
  6.  
  7. );  
  8.  
  9.   

这里看出,括号内部匿名方法(也就是function(){})没有被任何对象所调用。所以它是“普通方法”,所以他的函数体里面的this指向的是window,而window 这个scope上并没有一个叫total的成员(因为total成员是theAccumulator的,而不是window的),所以会出现undefined


基于这个思路,我做了进一步的测试。于是,我在保留JSON对象不变和全局函数不变的情况下做了一个很小的测试,结果验证是完全正确的

 

我的改动是:


 
 
  1. printResult(function(){return theAccumulator.getResult();}); 

其他不变

 

我的想法是,现在这个getResult,由于是以“点”的方式调用了,所以this指针应该会指向点前面的scope,也就是theAccumulator对象,而theAccumulator对象(实实在在的确一定当然)会有getResult()方法,所以,他能解析到。

 

经过测试,果然OK 。




本文转自 charles_wang888 51CTO博客,原文链接:http://blog.51cto.com/supercharles888/840221,如需转载请自行联系原作者

目录
相关文章
|
5月前
|
JavaScript 前端开发 开发者
|
7月前
|
JavaScript 数据库
js动态添加datagrid表头&批量保存实战研究
最近小编在做项目的时候,遇到了这样一个需求:如下图所示,表头中的"一般"和"优秀"是动态添加的,添加上对应的票数之后,选中多行,单击保存,将动态添加的列数据转换成行保存到数据库中
|
7月前
|
JavaScript 前端开发
(译)看得见的 JavaScript: 作用域(链)Scope (Chain)
(译)看得见的 JavaScript: 作用域(链)Scope (Chain)
53 0
|
Web App开发 JavaScript 前端开发
使用Chrome开发者工具研究JavaScript函数的原生实现原理
使用Chrome开发者工具研究JavaScript函数的原生实现原理
100 0
使用Chrome开发者工具研究JavaScript函数的原生实现原理
|
Web App开发 JavaScript 前端开发
使用Chrome开发者工具研究JavaScript里函数的原生实现
使用Chrome开发者工具研究JavaScript里函数的原生实现
77 0
使用Chrome开发者工具研究JavaScript里函数的原生实现
|
Web App开发 JavaScript 前端开发
使用Chrome开发者工具研究JavaScript的垃圾回收机制
使用Chrome开发者工具研究JavaScript的垃圾回收机制
97 0
使用Chrome开发者工具研究JavaScript的垃圾回收机制
|
Web App开发 JavaScript 前端开发
使用Chrome开发者工具研究JavaScript的垃圾回收机制
I use the following simple JavaScript code to illustrate:
使用Chrome开发者工具研究JavaScript的垃圾回收机制
|
Web App开发 JavaScript 前端开发
使用Chrome开发者工具研究JavaScript里函数的原生实现
使用Chrome开发者工具研究JavaScript里函数的原生实现
119 0
使用Chrome开发者工具研究JavaScript里函数的原生实现
|
前端开发 JavaScript
Javascript AST 编译器的研究学习
# Javascript AST 编译器的研究学习 ## Source: ```javascript 'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); var _IceInteractContainer = require('./InteractContaine
3127 0

相关产品

  • 云迁移中心