1 javascript作用域

初学javascript的时候,变量的作用域就感觉有些麻烦,他不像C#或java那样清晰明了,貌似处处都在作用域内,但有时会处处都是空。

javascript中,变量的作用域只有两种,全局变量和局部变量,并且只由函数决定,函数内的即为局部变量,函数外的就为全局变量 如图:

一切要是都这样,那么世界该有多么美好!!!但是 总会有各种各样的陷阱

陷阱1:函数中声明全局变量

  1. 函数中省略var 关键字
  2. 笔误 在for循环中,i前忘记写var
  3. 第二点的扩充,for(var i...)的情况下,i的作用域不为for循环内部,而是整个函数

    所以,比较好的写法应为

陷阱2 变量提升

javascript中,变量定义后,在执行环境中会提升至环境顶部,并赋予初始值undefined

具体表现为:变量无论在何处定义,均会充斥整个函数,但在赋值语句前的值为undefined。

注意此时,输出信息并不是变量未发现,而是变量的值为undefined。

举一个更明显的例子:

可以看到在,在变量赋值之前,无论定义位置,均会有默认初始值undefined

陷阱3:前两个陷阱合成的一个大陷阱!

和想象的是不是不太一样,原因就是,在执行环境中,首先v被提升至函数头,赋值undefined

var v="设置值";
function demo5()
{
var v=undefined;
console.log(v);
}
demo5();

  

是不是和想象的还不一样?这个更复杂些,因为执行函数之前,一定能确定函数参数的数据类型和数据值,所以,首先就会给函数参数初始化并赋值,然后声明局部变量(变量提升,陷阱2),但并不初始化,此时值为undefined,并初始化函数。

这一系列的操作会产生一个新的执行环境。执行环境下一篇文章再说。

参考资料:犀牛书,《单页web应用》,其他大牛blog 谢谢

javascript温故知新的更多相关文章

  1. 温故知新 javascript 正则表达式

    很长时间没看 正则表达式了,碰巧今天用到,温故知新了一把 看书学习吧 50% 的举一反三练习中的原创.   一 javascript正则表达式的基本知识 1     javascript 正则对象创建 ...

  2. javaScript高级教程(八)-----正则表达式温故知新

    1.RegExp对象:五个属性二个方法 五个属性:global, ignoreCase,multiline,lastIndex,source 二个方法: exec()--模式匹配 test()--检测 ...

  3. javascript中的一些核心知识点以及需要注意的地方

    前言 近期杂事甚多,这些事情的积累对知识体系的提升有好处,但是却不能整理出来,也整理不出来 比如说我最近研究的Hybrid在线联调方案便过于依赖于业务,就算分享也不会有人读懂,若是抽一点来分享又意义不 ...

  4. javascript --- 只继承于原型

    正如上次所述,,出于效率考虑,我们应该尽可能的将一些可重用的属性和方法添加到原型中去. 如果养成了这个好习惯,我们仅仅依靠原型就能顺利的完成继承关系的构建了. 毕竟采用new her()方法将her的 ...

  5. 再回首,Java温故知新(一):Java概述

    Java发展历程 Java的发展要追溯到1991年,Patrick Naughton(帕特里克·诺顿)和James Gosling(詹姆斯·高斯林)带领Sun公司的工程师打算为有线电视转换盒之类的消费 ...

  6. JavaScript八张思维导图

    JS基本概念 JS操作符 JS基本语句 JS数组用法 Date用法 JS字符串用法 JS编程风格 JS编程实践 不知不觉做前端已经五年多了,无论是从最初的jQuery还是现在火热的Angular,Vu ...

  7. JavaScript八张思维导图—基本概念

    JS基本概念 JS操作符 JS基本语句 JS数组用法 Date用法 JS字符串用法 JS编程风格 JS编程实践 不知不觉做前端已经五年多了,无论是从最初的jQuery还是现在火热的Angular,Vu ...

  8. JavaScript八张思维导图—操作符

    JS基本概念 JS操作符 JS基本语句 JS数组用法 Date用法 JS字符串用法 JS编程风格 JS编程实践 不知不觉做前端已经五年多了,无论是从最初的jQuery还是现在火热的Angular,Vu ...

  9. JavaScript八张思维导图—基本语句

    JS基本概念 JS操作符 JS基本语句 JS数组用法 Date用法 JS字符串用法 JS编程风格 JS编程实践 不知不觉做前端已经五年多了,无论是从最初的jQuery还是现在火热的Angular,Vu ...

随机推荐

  1. 使用 Laravel 前的准备工作

    是的,使用 Laravel 前需要准备开发环境,准备工作做完后,就可以一门心思的投入到学习 Laravel 知识的战斗中去了. Larvavel 是一个 PHP 框架,API 非常语义化.它激进,使用 ...

  2. No module named 'urllib2'

    import urllib2 response = urllib2.urlopen('http://www.baidu.com/') html = response.read() print html ...

  3. php请求返回GeoJSON格式的数据

    <?php /* * Following code will list all the products */ // array for JSON response $response = ar ...

  4. shell随机输出一人的学号与姓名

    如果要多输出,可以分成*组,然后从每组中输出一个(这里是分为3组)

  5. 一个简单的MySql数据库连接池的实现

    package cn.hc.connectionPool; import java.io.IOException; import java.io.InputStream; import java.sq ...

  6. Navigator

      Navigator   这是一个简单的例子,用Navigator来跳转页面,页面之间传递参数 (代码是ES6语法写的): import React from 'react'; import { V ...

  7. 关于php的开源

    这里的开源是指编写php的C语言的源代码是开放的,你可以下载下来c源代码去修改然后重新编译连接得到自己的程序. 比如php不支持多线程一直是广为被人所诟病的,你也可以让它变相的支持多线程,比如face ...

  8. java基本数据类型的字面量

    java的基本数据类型一共有8种.其中:(每种类型后面列出了java中的该类型的字面量) 四种整型: int  4字节: 12  +12  -12  077 0xFF  0b101(JDK7中支持的二 ...

  9. display inline-block 垂直居中

    table td:after {display:inline-block;width:0;height:100%;vertical-align:middle;content:'';}

  10. AspNet MVC中各种上下文理解

    0  前言 AspNet MVC中比较重要的上下文,有如下: 核心的上下文有HttpContext(请求上下文),ControllerContext(控制器上下文) 过滤器有关有五个的上下文Actio ...