var name = "The Window";
var object = {
name : "My Object",
getNameFunc : function(){
return function(){
return this.name;
};
}
};

一个经典的代码,在高程也出现过的,意在说明 this 和 闭包变量作用域。

以前写过一篇记录一下,最近在sf看到一博客文章,又突然陷入深思。

http://blog.segmentfault.com/findingea/1190000000537129

首先,说一下2个关键点:

1.function的作用域:在function中访问一变量,首先看function执行体内是否存在该变量,不存在,则往function的调用环境,去查询,如果是多层调用,则会遵循内部找不到就往外部查找,一直到全局作用域,这也就是作用域链。

1.1一般说来,闭包,即内部函数调用了外部函数的变量,并返回自身给外部使用,此时,即可访问到外部函数的变量,这里能不能说其实也是套用了所谓的作用域链原理呢。

2. function的作用域内,本身执行体的执行环境包含参数arguments和this两个自带的,不会导致需要去外部找变量,上面的经典问题中,this.name之所以返回的是 the window 即全局变量,那是因为function自身的调用环境决定的,这个return的闭包,不属于object对象本身的属性,因此,自然而然,其调用主题是全局window。

通过需要后,即可达到访问object.name的效果.

 var name = "The Window";
var object = {
name : "My Object",
getNameFunc : function(){
var that = this;
return function(){
return that.name;
};
}
};

这里用that存了this,getNameFunc本身就是object的属性,因此this指向的是object,而that作为最底层的function的外部函数的作用域之一,刚好function内部没有that的申明,所以自然内部调用that访问的就是外部函数的作用域的that。

而我本来觉得这样好理解,突然想,那么不要this呢?

 var name = "The Window";
var object = {
name : "My Object",
getNameFunc : function(){
return function(){
return name;
};
}
};

一开始以为,根据作用域链,最终得到的name应该是object.name,结果一运行,不对,为什么呢?

一开始搞不明白。

但是,回想起来,首先,getNameFunc这里如果调用name同样得到的是全局的name.  想想,假设我加一句代码进去,

 var name = "The Window";
var object = {
name : "My Object",
getNameFunc : function(){
console.log(name); //这里name是全局name
return function(){
return name;
};
}
};

正如我注释的那里,这里直接调用name,跟调用this.name的不同,在于this.name是对象的属性,直接调用,则是查找作用域里声明的name,明显与对象属性不是同一个概念,正如

var name = 0; 和 obj.name="dont"; 不能相提并论,不知道这么解释对不对。

也正因为作用域里不存在独立的name声明,因此最终找到的是全局的作用域声明的name: The Window.

function变量困惑的更多相关文章

  1. this指针与function变量--this究竟指向哪里?

    参考文章:<深入浅出 JavaScript 中的 this> http://www.ibm.com/developerworks/cn/web/1207_wangqf_jsthis/ Ja ...

  2. 六天玩转javascript:javascript变量与表达式(1)

    说明 本系列属于进阶系列,语常用语法等不在本系列介绍范围之内. 在我刚开始做一个程序员并开发项目的时候,我总是喜欢使用开发语言的各种特性,每次m$发布新版C#的时候我总是会把开发者预览版下好,亲自体验 ...

  3. 在javascript中关于变量与函数的提升

    在javascript中关于变量与函数的提升 一.简介 在javascript中声明变量与函数的执行步骤: 1.先预解析变量或函数声明代码,会把用var声明的变量或者函数声明的代码块进行提升操作 2. ...

  4. js变量和函数声明的提升

    函数声明和变量声明总是会被解释器悄悄地被“提升”到方法体的最顶部 请注意,变量赋值并没有被提升,只是声明被提升了. 函数的声明比变量的声明具有高的优先级. 下面的程序是什么结果? var foo =  ...

  5. JS基础——变量

    引用类型:对象  数组 函数 }; var b =a ; b.age = ; console.log(a.age);// 21 传递的是地址, a,b同地址 值类型: var a =100; var ...

  6. js变量和函数声明的提升(转)

    原文:http://zha-zi.iteye.com/blog/2037026 下面的程序是什么结果? var foo = 1; function bar() { if (!foo) { var fo ...

  7. [转]js 判断js函数、变量是否存在

    本文转自:http://blog.csdn.net/liang4571231/article/details/4042519 在进行js编程时,总会出现可能一些函数或者变量未定义而被引用,导致报错的情 ...

  8. JavaScript变量提升 面试题

    <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...

  9. Javascript作用域和变量提升

    下面的程序是什么结果? var foo = 1; function bar() { if (!foo) { var foo = 10; } alert(foo); } bar(); 结果是10: 那么 ...

随机推荐

  1. java--连接SQL数据库获取验证码

    1.导入SQL相关的包: 可以下载:mysql-connector-java-5.1.39-bin.jar 将包导入到工程的方法:project(在工程名上点鼠标右键) -> Build Pat ...

  2. ant 使用指南

    一.概述 ant 是一个将软件编译.测试.部署等步骤联系在一起加以自动化的一个工具,大多用于Java环境中的软件开发.在实际软件开发中,有很多地方可以用到ant. 开发环境: System:Windo ...

  3. swift 3.0 协议笔记

    协议能够要求遵循者必须含有一些特定名称和类型的实例属性(instance property)或类属性(type property),也能够要求属性的(设置权限)settable 和(访问权限)gett ...

  4. LeetCode 36 Valid Sudoku

    Problem: Determine if a Sudoku is valid, according to: Sudoku Puzzles - The Rules. The Sudoku board ...

  5. STM32F412应用开发笔记之一:初识NUCLEO-F412ZG

    今天终于收到了期待已久的NUCLEO-F412ZG,感谢电子发烧友论坛! 近几年来基本都是在STM32平台上做一些设计开发工作.STM32F103.STM32F107.STM32F429等都应用过,但 ...

  6. css经典布局——头尾固定高度中间高度自适应布局

    转载:穆乙 http://www.cnblogs.com/pigtail/ 相信做过后台管理界面的同学,都非常清楚这个布局.最直观的方式是框架这个我不想多写费话,因为我们的重心不在这里.如果有不了解的 ...

  7. Flask 框架入门

    Flask Flask是一个使用 Python 编写的轻量级 Web 应用框架.其 WSGI 工具箱采用 Werkzeug ,模板引擎则使用 Jinja2 . 安装 Flask 依赖两个外部库, We ...

  8. System系统类常用方法

    System 系统类: 主要用于获取系统的属性数据. System类常用的方法: arraycopy(Object src, int srcPos, Object dest, int destPos, ...

  9. python的异常处理

    在所有的程序中,都会遇到异常,有些异常是代码编写的时候产生的,在前期过程中可能会直接导致程序无法运行.这一类的异常,在编写代码的时候,程序可以直接排查修改.但有些异常,是在程序运行过程中产生的,可能是 ...

  10. 3*n/2 - 2

    求区间范围最小值最大值 用分治法(Divide and Conquer)求n元数组最小元与最大元,当n=1时,不用比较,最大元和最小元都是这个数:当n=2时,一次比较就可以找出两个数据元素的最大元和最 ...