从字面上理解----域就是空间、范围、区域,作用就是读、写,所以作用域我们可以简单理解为:在什么样空间或者范围内对数据进行什么样的读或写操作。

看一下代码

alert(a);                    // 为什么是undefined
var a = 1; alert(a); //为什么浏览器无反应
a = 1;

要了解为什么这些现象必须先知道浏览器是如何读取js代码,而这段浏览器专门用来读取js代码的片段我们称之为-----js解析器 

首先,我们来理解“JS解析器”是如何工作的?

先看如下代码

alert(a);                    // function a (){ alert(4); }
var a = 1;
alert(a); //
function fn1(){ alert(2); }

当“JS解析器”识别到 <script> 它就开始工作了,至少从两个部分开始

1)先找一些东西 :根据 var function 参数 先找齐了再开始工作。于是先找到a,但是不会读取a等号后面的东西,所以a是未定义,

可以简单理解为 -----所有的变量,在正式运行代码之前,都提前赋了一个值:未定义  a=.......

然后根据 function  找到   fn1 = function fn1(){ alert(2); }

所有的函数,在正式运行代码之前,都是整个函数块

                         整体简单理解为:有变量未定义,由函数整个函数整体

这一步称之为----------‘js的预解析’

                        原则:遇到重名的------1、只留一个2、变量和函数重名了,就只留下函数

2)逐行读代码 :

表达式:= + - * / % ++ -- ! 参数……

表达式可以修改预解析的值!

如最上面代码当读取到

alert(a); 

先去第一步仓库中找到a未定义

于是alert是undefined

接着才会执行 var a=1;此时a的值才是1

第二段里面没有var function 参数 所以仓库里面没有东西所以浏览器毫无反应

案例一:分析如下代码

alert(a);                    // function a (){ alert(4); }
var a = 1;
alert(a); //
function a (){ alert(2); }
alert(a); //
var a = 3;
alert(a); //
function a (){ alert(4); }
alert(a); //
a ()                        // 报错 Uncaught TypeError: number is not a function

分析过程

1)预解析    var function 参数

            遇到重名的------1、只留一个2、变量和函数重名了,就只留下函数

             最后留下function a (){ alert(4); }  整个集合

2)逐行读代码   所以第一行alert(a); 是集合 function a (){ alert(4); }

               接着给据:表达式可以修改预解析的值!
遇到第二行var a = 1; 于是第三行alert(a); 的值是1
第四行无作用不执行
于是第五行alert(a); 还是1
遇到第六行var a = 3; 于是第七行alert(a); 的值是3
第八行无作用不执行
于是第九行alert(a); 还是3
第十行a(); 因为此时仓库中只有a=3,而此时在仓库中没有function 所以报错

第06课:作用域、JS预解析机制的更多相关文章

  1. JS预解析机制

    JS的预解析过程: 1,预解析 2,再逐行解读代码, 实例: ---------------------------- <script>        var name="xm& ...

  2. [妙味JS基础]第六课:作用域、JS预解析机制

    知识点总结 浏览器的解析方法 script 全局变量,全局函数 自上而下 函数 由里到外 "JS的解析器": 1)“找一些东西”:var function 参数 var a=未定义 ...

  3. javascript-初级-day06作用域、JS预解析机制

    <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content ...

  4. js作用域其二:预解析

    文章目錄 解析机制 JavaScript是一门解释型的语言 , 想要运行js代码需要两个阶段 编译阶段: 编译阶段就是我们常说的JavaScript预解析(预处理)阶段,在这个阶段JavaScript ...

  5. JS的解析机制

    JS的解析机制,是JS的又一大重点知识点,在面试题中更经常出现,今天就来唠唠他们的原理.首先呢,我们在我们伟大的浏览器中,有个叫做JS解析器的东西,它专门用来读取JS,执行JS.一般情况是存在作用域就 ...

  6. 轻松搞定javascript变量(闭包,预解析机制,变量在内存的分配 )

    变量:  存储数据的容器     1.声明        var   2.作用域       全局变量. 局部变量. 闭包(相对的全局变量):   3.类型         a.基本类型(undefi ...

  7. 进击JavaScript核心 --- (2)函数和预解析机制

    一.函数 每个函数都是 Function类型的实例,也具有属性和方法.由于函数也是一个对象,因此函数名实际上也是一个指向函数对象的指针,不会与某个函数绑定 1.函数的定义方式 (1).函数声明 fun ...

  8. 轻松搞定javascript预解析机制(搞定后,一切有关变态面试题都是浮云~~)

    hey,guys!我们一起总结一下JS预解析吧! 首先,我们得搞清楚JS预解析和JS逐行执行的关系.其实它们两并不冲突,一个例子轻松理解它们的关系: 你去酒店吃饭,吃饭前你得看下菜谱,点下菜(JS预解 ...

  9. js预解析相关知识总结以及一些好玩的面试题

    js预解析的题像在做智力题一样有意思~ 预解析 预解析:在解释这行代码之前发生的事情——变量的声明提前了,函数的声明提前 console.log(num) ——未定义Num,结果是报错 var num ...

随机推荐

  1. Spring实战(十)Spring AOP应用——为方法引入新功能、为对象引入新方法

    切面最基本的元素是通知和切点,切点用于准确定位应该在什么地方应用切面的通知. 1.Spring借助AspectJ的切点表达式语言来定义Spring切面 在Spring中,要使用AspectJ的切点表达 ...

  2. java——多线程知识点大总结

    1:理解线程的概念之前,我们有必要先理解一下进程的概念 程序(Program)是为实现特定目标或解决特定问题而用计算机语言(比如Java语言)编写的命令序列的集合. 进程指一个程序的一次执行过程   ...

  3. winfrom_根据checkbox勾选项增减dgv字段列

    1.效果: 2.点击‘配置’按钮: private void btn_configure_Click(object sender, EventArgs e) { string sum = string ...

  4. O049、准备 LVM Volume Provider

    参考https://www.cnblogs.com/CloudMan6/p/5597790.html   Cinder 真正负责volume 管理的组件是 volume provider .Cinde ...

  5. vue使用scss应该安装哪些依赖

    通过vue-cli搭建的项目如果想使用scss的话除了安装sass-loader,还需要安装node-sass cnpm install sass-loader node-sass -D

  6. Delphi MSComm控件的错误消息

  7. 十一,k8s集群访问控制之ServicAccount

    目录 认证安全 连接Api-Server的两类账号 ServiceAccount 创建 使用admin 的SA 测试 URL访问kubernetes资源 APIserver客户端定义的配置文件 kub ...

  8. while 循环 及 and or not

    一  while 循环 语法: while 条件: 结果 如果条件为真,则直接执行结果,然后再次判断条件,直到条件是假,停止循环 结束循环: 1.改变条件 2.break 二 流程控制 break 和 ...

  9. 4.3. Scrapy Shell

    Scrapy Shell:模拟scrapy去发送请求 Scrapy终端是一个交互终端,我们可以在未启动spider的情况下尝试及调试代码,也可以用来测试XPath或CSS表达式,查看他们的工作方式,方 ...

  10. Delphi用QJSON解析JSON格式的数据 【转】

    本来用superobject来解析JSON已经够用了,可惜这个东东不能在移动端使用,于是找到QJSON来处理. 这是一个国内高手写开源免费的东西,赞一个. 假入数据如下: {"message ...