Chapter4: Hoisting

变量附加到哪个层次的scope,由它们在哪里和如何声明(let, var)来决定。

Function scope/Block scope都有相同的法则:任何变量在一个scope内声明,则这个变量附加到这个作用域上。

但有一个细节问题:当声明declarations出现在一个作用域中的不同的位置的时候,scope附加如何与declarations协作?


Chicken or The Egg?

temptation: a strong desire to have or do sth even thought you know you should not(邪念,诱惑人的事物)

当程序执行时,JS 代码被一行行,从上到下的顺序被解译。但有例外:

a = 2;

var a;

console.log( a );  输出2

可是:

console.log( a );

var a = 2;  
//输出undefined

怎么回事? 一个先有鸡还是先有蛋的问题。 the declaration是蛋, assignment是鸡。


The Compiler Strikes Again 编译器又罢工了

Engine实际是先编译JS code,在interprtes it之前。

编译器先声明变量,然后Engine在Scope中查询这个变量,如果发现就分配它。

所以思考事情的最好的方式是:

所有的声明declarations,包括变量和函数,被首先处理processed。在你的代码被执行executed前。

var a = 2; 其实是2个statements: var a;和a = 2;

var a 是声明,在编译阶段被处理;

a = 2是assignment, 会留在执行阶段execution phase处理。

所以,前2个例子就可以理解了:

//第一个例子:
var a;
a = 2;
console.log(a); // 2 //第二个例子:
var a;
console.log(a); //undefined
a = 2;

结论:先有蛋(declarations),后有

You Don't Know JS: Scope & Closures (第4章: Hoisting)的更多相关文章

  1. You Don't Know JS: Scope & Closures (第3章: 函数 vs 块作用域)

    第二章,作用域由一系列的bubbles组成.每一个都代表了一个container或bucket,装着被声明的identifiers(variables, functions).这些bubbles相互嵌 ...

  2. You Don't Know JS: Scope & Closures (第2章: Lexical Scope)

    2种主要的models for how scope work. 最普遍的是Lexical Scope. 另一种 Dynamic Scope.(在Appendix a中介绍.和Lexical Scope ...

  3. (未完成👃)You Don't Know JS: Scope & Closures (第5章: Scope & Closures)

    Chapter 5: Scope Closure 我们到达这里时,已经对作用域如何工作有了非常健康稳固的理解. 下面,我们转移注意力到一个及其重要,但长期难以理解,几乎是神话中的部分语言:Closur ...

  4. You Don't Know JS: Scope & Closures (第一章:什么是Scope)

    Content What is Scope? Lexical Scope Function Vs. Block Scope Hoisting Scope Closures Appendix: Dyna ...

  5. You Don't Know JS: Scope & Closures(翻译)

    Chapter 1: What is Scope? 第一章:什么是作用域 One of the most fundamental paradigms of nearly all programming ...

  6. You Don't Know JS: Scope & Closures (附加:Lexical/dynamic作用域)(附加:Lexical-this)

    JavaScript只有Lexical Scope 模式 Lexical Scope就是在写代码的时候,定义函数的时候创建的作用域! 而动态作用域是在runtime时,函数被调用的地方的作用域! 实际 ...

  7. js的closures(闭包)

    JS中的闭包(closure) 闭包(closure)是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现.下面就是我的学习笔记,对于Javascript初学者应该是很有用 ...

  8. Angular JS Scope(作用域)

    Scope(作用域) 是应用在 HTML (视图) 和 JavaScript (控制器)之间的纽带. Scope 是一个对象,有可用的方法和属性. Scope 可应用在视图和控制器上. 当你在 Ang ...

  9. You Don't Know JS: Async & Performance(第一章, 异步:now & later)

    Chapter 1: Asynchrony: Now & Later 在一门语言中,比如JavaScript, 最重要但仍然常常被误解的编程部分是如何在一个完整的时间周期表示和操作程序行为. ...

随机推荐

  1. php编程疑难解决-1

    全局变量和超全局变量 如果是php脚本script 或php代码, 一定要放在 php标签内<?php ?> 内. 这样apache才会把他当做php脚本内容来解析, 才会去调用php模块 ...

  2. 设计模式总结(转自CS-Notes)

    转载地址:https://github.com/CyC2018/CS-Notes/blob/master/docs/notes/%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F ...

  3. Custom Quality Profiles in SonarQube

    https://medium.com/ltunes/custom-quality-profiles-in-sonarqube-part-1-8754348b9369 Creating Custom Q ...

  4. java 之 xml 之解析工具jaxp

    一.jaxp的api查看 *jaxp是javase一部分 *jaxp解析器在jdk的javax.xml.parsers包里面 *共四个类:分别针对dom和sax解析使用的类 *dom解析类: Docu ...

  5. JavaScript 拥有动态类型

    字符串.数字.布尔.数组.对象.Null.Undefined JavaScript 拥有动态类型 JavaScript 拥有动态类型.这意味着相同的变量可用作不同的类型: 实例 var x // x ...

  6. codeforce 886C Petya and Catacombs (map,思路)

    突然发现百度不到这题的单独题解(果然是因为这是水题么),那我就来写一个了~ 先把题给贴了. C. Petya and Catacombs time limit per test 1 second me ...

  7. Latex: extra alignment tab has been changed to cr

    参考: Error: extra alignment tab has been changed to \cr Latex: extra alignment tab has been changed t ...

  8. C语言 分割字符串

    对指针的操作有点迷糊 只好采用下面一些比较low的手段 char str[100]; char delims[] = ";"; char *result = NULL; sprin ...

  9. matplotlib python

    #导入包 import matplotlib.pyplot as plt import numpy as np # 从[-1,1]中等距去50个数作为x的取值 x = np.linspace(-1, ...

  10. sed命令使用详解

        内容来自马哥视频,感谢马哥精彩讲解 sed:编辑器 sed: Stream EDitor, 行编辑器,逐行进行处理 grep:实现文本过滤 awk:文本报告生成器 sed默认不编辑源文件,而是 ...