hey,guys!我们一起总结一下JS预解析吧!

首先,我们得搞清楚JS预解析JS逐行执行的关系。其实它们两并不冲突,一个例子轻松理解它们的关系:

  你去酒店吃饭,吃饭前你得看下菜谱,点下菜(JS预解析),但吃的时候还是一口一口的吃(JS逐行执行)!

OK,解决下面五个问题,JS预解析就算过了~~(前提:对JS变量作用域有清晰理解)

一、JS预解析是什么?

其实就是对程序要用到的材料(变量,函数)给一个初始值,并存到一个表中(我自己虚构的),当程序运行到那一行时,就来这个表看有没有初始值,没有就报错~~

二、JS在什么情况下会进行预解析呢?

1.遇到<script></script>标签对时;

2.遇到函数时;(因为变量是有作用域的)

三、JS对什么进行预解析?

1.var 后面的变量

2.函数 

3.函数传参的变量

四、那JS会给这些 变量、函数 赋予什么初始值呢?

1.凡是var 的,都会赋予一个 undefined 作为初始值;

2.凡是函数,直接赋予 函数本身 作为初始值;(所以这就是为什么我们可以把 函数调用 放到  函数声明 之前的原因)

五、什么情况会改变 预解析 赋予的初始值呢?

有赋值功能的符号:=,  +=,  -=,  *=,  /=,  ++,  --等 (如果还有再添加..)

下面是来点实例:

1 alert(a);    //报错,没有var 是不会进行预解析的
2 a = 0;
1 alert(a);    //undefined
2 var a = 0;
3 alert(a); //0, =号 可以改变初始值
1 alert(a);    //function a(){ alert('我是函数') },  undefined代表空,函数不是空的,当然要不是空的啦!
2 var a = '我是变量';
3 function a(){ alert('我是函数') }
4 alert(a); //'我是变量', = 可以改变初始值
1 alert(a);    //function a(){ alert('我是函数') },  undefined代表空,函数不是空的,当然要不是空的啦!
2 a++;
3 alert(a); //NaN, ++可以改变初始值
4 var a = '我是变量';
5 function a(){ alert('我是函数') }
6 alert(a) //'我是变量', = 可以改变初始值
 1 alert(a);    //undefined
2 var a = 0;
3 alert(a); //0
4 function fn(){
5 alert(a); //undefined;遇到函数,重新进行预解析
6 var a = 2;
7 alert(a); //2
8 }
9 fn()
10 alert(a); //0,fn里面的a与全局的a不是同一作用域的
 1 alert(a);    //undefined
2 var a = 0;
3 alert(a); //0
4 function fn(){
5 alert(a); //0;因为没var, 所以这里的a会被看作是全局的,往上查找,找到a=0,所以是0,如果全局也没有就会报错
6 a = 2;
7 alert(a); //2
8 }
9 fn()
10 alert(a); //2,fn把这全局的a修改了
1 function fn(a){
2 alert(a); //undefined,JS会把传参当作var一样对待,相当于在fn内部定义了一个变量--> var a;
3 a = 2;
4 alert(a); //2,这里修改的不是全局的哦,改的是fn的局部变量哦
5 }
6 fn()
7 alert(a); //报错
1 <script>
2 alert(a); //报错,因为遇到<script>标签对时,会先对这一块进行预解析,运行到下面的才会再进行预解析,下面没预解析,所以找不到a,于是报错了
3 </script>
4
5 <script>
6 alert(a); //undefined
7 var a = 0;
8 alert(a); //0
9 </script>
1 <script>
2 var a;
3 </script>
4
5 <script>
6 alert(a); //undefined,虽然这个<script>标签对没有定义a,但会往上查找,上面的个<script>标签定义了,所以为undefined
7 </script>

下面我们再看下这两种情况的区别:

1 alert(a);    //function a(){ alert('我是函数') }
2 function a(){ alert('我是函数') }
1 alert(a);    //undefined,可以看出,凡是var,初始值都是undefined
2 var a = function (){ '我是函数' }

看,JS预解析也就这样,没我们想象中的那么难吧!

原文出处:

http://www.cnblogs.com/Ivangel/p/3694694.html

轻松搞定javascript预解析机制(搞定后,一切有关变态面试题都是浮云~~)的更多相关文章

  1. JavaScript 预解析机制

    首先我们来看一段代码: <script> console.log(a); var a = 10; </script> 此时运行结果为   为什么会显示undefined呢?这就 ...

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

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

  3. 从var func=function 和 function func()区别谈Javascript的预解析机制

    var func=function 和 function func()在意义上没有任何不同,但其解释优先级不同:后者会先于同一语句级的其他语句. 即: { var k = xx(); function ...

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

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

  5. javascript预解析和作用域

    JavaScript解析过程分为两个阶段: 一是:编译阶段.就是JavaScrip预解析阶段,在这个阶段JavaScript解析器将完成把JavaScript脚本代码转换到字节码; 二是:执行阶段.在 ...

  6. JavaScript预解析

    定义:JavaScript"预解析",可以理解为把变量或函数预先解析到它们被使用的环境中. 通俗点讲,即认为浏览器在正式运行JavaScript代码前, 第一步,会预先根据关键字v ...

  7. Javascript预解析、作用域、作用域链

    最近在看js的一些资料,总结一下昨晚看到的js作用域方面的知识,不准确的地方希望留言指正! 先看片段js代码如下: < script type="text/javascript&quo ...

  8. javascript 预解析

    内容来源:http://www.cnblogs.com/TomXu/archive/2011/12/28/2286877.html JavaScript中,你可以在函数的任何位置声明多个var语句,并 ...

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

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

随机推荐

  1. We will be discontinuing the Nitrous Development Platform and Cloud IDE on November 14th, 2016.

    我表示我很难过 Nitrous We will be discontinuing the Nitrous Development Platform and Cloud IDE on November ...

  2. c#.net对excel的操作——创建一个excel报表两个sheet就是2个表分别添加内容

    添加引用:Microsoft.Office.Interop.Excel //创建excel对象,就是实例化一个excel对象            Application excel=new Appl ...

  3. ios swfit 由继承UIButton了解类的构造方法

    最近需要建立UIButton的子类. 先看一看swfit中继承父类构造方法的条件: Rule1 1“If your subclass doesn’t define any designated ini ...

  4. How to call getClass() from a static method in Java?

    刚才在学习Java 使用properties类,遇到这样的错误: Cannot make a static reference to the non-static method getClass() ...

  5. VC++ 判断当前系统为32位还是64位

    尝试了在VC++环境下判断系统为32位还是64位的方法,亲测有效!提供的函数如下 BOOL IsWow64() { typedef BOOL (WINAPI *LPFN_ISWOW64PROCESS) ...

  6. 在SpringMVC中获取request对象

    1.注解法 @Autowired private  HttpServletRequest request; 2. 在web.xml中配置一个监听 <listener> <listen ...

  7. mybatis跨XML引用

    resultMap中association标签的select属性使用嵌套查询的时候需要引用其它xml文件的配置 此时可以用要引用xml的namespace.引用select的ID 如 <resu ...

  8. 【leetcode】Gray Code (middle)

    The gray code is a binary numeral system where two successive values differ in only one bit. Given a ...

  9. js生成验证码并验证

    前台代码: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.as ...

  10. 详解web.xml中元素的加载顺序

    一.背景 最近在项目中遇到了启动时出现加载service注解注入失败的问题,后来经过不懈努力发现了是因为web.xml配置文件中的元素加载顺序导致的,那么就抽空研究了以下tomcat在启动时web.x ...