JavaScript解析过程分为两个阶段:

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

二是:执行阶段.在编译阶段JavaScript解析器借助执行环境把字节码生成机械码,并顺序执行;

预解析:在当前的作用域中,js代码执行之前浏览器会默认把所有带var 和function的进行提前的声明或者定义;

eg:var num=1;

sum();

function sum(){console.log(num)};//1

执行过程:

1.预解析:查找var,找到num变量,按照与解析的规则,变量的预解析是只声明不赋值.

相当于把num变量放在了全局变量仓库里,但是此时的num并没有赋值,值为undefined.

查找function关键字,发现了函数素描,按照与解析的规则,声明并定义,相当于把sum函数放在全局的仓库,并且赋值了.

2.执行:代码从上到下执行,预解析过的直接略过.

*定义函数的方式有函数声明函数表达式两种,通过对预解析机制的简单了解我们可以知道只有函数声明的方式才可以将函数执行写在函数声明之前,而使用函数表达式定义的函数则不能先调用后声明

handel1(); //1 函数声明的方式,函数整体被预解析
function handel1(){
alert(1);
}

handel2(); //Uncaught TypeError: undefined is not a function 函数表达式仅仅将变量名进行了预解析
var handel2 = function(){
alert(1);
}

*简单了解我们可以知道只有函数声明的方式才可以将函数执行写在函数声明之前,而使用函数表达式定义的函数则不能先调用后声明,

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

function a(){
alert(2);
}
alert(a); //1

var a = 3;
alert(a); //3

function a(){
alert(4);
}
alert(a); //3

*由于JS是自上而下的执行顺序,单个script标签内为一个完整的执行域,所以会逐个script标签进行以上两步操作

* 当JS解析器执行代码到fn()执行的时候重新执行预解析过程,如果在执行函数里面的代码的时候没有在执行环境中找到相应变量则会在其父级作用域中寻找,这种方式叫做作用域链.

eg:var a=1;

function fn(){

alert(a);//1

a=2;

}

alert(a);//1

fn();

alert(a);//2

*除了var和function会被预解析之外,函数的参数也会被执行环境预解析:

var a = 1;
function fn(a){
alert(a); //undefined
a = 2; //这里修改的是函数作用域内的局部变量a
}
fn();
alert(a); //1

作用域:

全局作用域:在代码中任何地方都能访问到的对象,

(1)最外层函数和在最外层函数外面定义的变量拥有全局作用域.

eg:var num=1;

function sum(){console.log(num)};

(2)所有未定义直接复制的变量自动声明为拥有全局作用域,

eg:function sum(){

var num1=10;//局部变量

num2=20;//全局变量

}

(3)所有window对象的属性拥有全局作用域

一般情况下,window对性的内置属性都拥有全局作用域.

局部作用域:一般只在固定的代码片段内可以访问到,最常见的就是函数内部,所以在一些地方也会看到有人把这种作用域称为是函数作用域.

eg:var num=1;//全局作用域

function sum(number){//number是局部变量

var num2=2;//局部变量

console.log(num);//num为全局变量

num=3;//全局变量

}

函数有一个内部属性[[Scope]],该内部属性包含了函数被创建的作用域中对象的集合,这个集合被称为函数的作用域链,他决定了哪些数据能被函数访问.

javascript预解析和作用域的更多相关文章

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

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

  2. JavaScript 之有趣的函数(函数声明、调用、预解析、作用域)

    前言:“函数是对象,函数名是指针.”,函数名仅仅是指向函数的指针,与其他包含函数指针的变量没有什么区别,话句话说,一个函数可能有多个名字. -1.函数声明,function+函数名称.调用方法:函数名 ...

  3. JavaScript预解析

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

  4. JavaScript 预解析机制

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

  5. JavaScript 预编译与作用域

    JavaScript 预编译与作用域 JavaScript 预编译的过程和作用域的分析步骤是 JS 学习中重要的一环,能够帮助我们知道代码的执行顺序,更好理解闭包的概念 预编译 JavaScript ...

  6. javascript 预解析

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

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

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

  8. js---07 js预解析,作用域---闭包

    js解析器首先不会逐行读代码,这是第二部了. 首先 根据var找到变量,根据function找函数,找到变量var a = 1,js解析器只会读取等号前面的var a,并把a设置值未定义,并不会读取等 ...

  9. js的预解析和作用域

    预解析指的就是,在js文件或者script里面的代码在正式开始执行之前,进行的一些解析工作.这个工作很简单,就是在全局中寻找var关键字声明的变量和通过function关键字声明的函数. 1.寻找 v ...

随机推荐

  1. DIY_hlstudio_WIN7PE【69M】网络版【89M】

    DIY_hlstudio_WIN7PE[69M]网络版[89M] hlstudio的骨头版PE非常精简,由于启动方式和用法不同,个人进行了如下修改:1.原来的合盘修改为bootmgr直接起动ISO镜像 ...

  2. 教你开启红米的USB大容量存储选项,全网首发哦

    教你开启红米的USB大容量存储选项,全网首发哦 http://bbs.7to.cn/thread-10732-1-1.html 发表于 2014-4-29 110643 红米note入手也有两天了.各 ...

  3. css三级下拉的导航栏

    #menu{ height: 65px; width:100%; background-color: rgba(0, 0, 0, 0.5);}#menu ul{ list-style: none;}# ...

  4. OneProxy与其它数据库中间件的对比

    OneProxy 优点 性能 缺点 闭源,被商业公司掌控,到时候随别人蹂躏 可维护性极差,缺乏友好的出错信息,光维护这个环节就被他人掌控 定价不明 有没有这样的公司? 大到10wtps,但是没人能理解 ...

  5. as的Enter_Frame与Timer

    As3中的Timer和Event.EnterFrame是有明显的区别的. Evnet.EnterFrame是定时间隔多少时间出发.如果执行时间比间隔时间长,则会间隔执行时间这么久. 举个例子: Fla ...

  6. DispatcherServlet

    <servlet> <servlet-name>chapter2</servlet-name> <servlet-class>org.springfra ...

  7. JavaWeb基础:HTTP协议和基于Restful的架构

    HTTP介绍 HTTP协议是互联网上应用最广泛的协议,它是一种无状态的数据传输协议,规定了数据请求方和数据响应方的数据传输方式:使用HTTP协议可以跨平台,跨语言的进行数据传输和展示. 目前的Web应 ...

  8. android入门之: SharedPreferences

    读取数据: 保存数据: +++++++++++++++++++方法详解++++++++++++++++++++++++++++++ SharedPreferences综述: 使用getSharedPr ...

  9. C/C++ 一段代码区分数组指针|指针数组|函数指针|函数指针数组

    #include<stdio.h> #include<stdlib.h> #include<windows.h> /* 举列子说明什么是函数指针 */ //以一个加 ...

  10. uva-----11292 The Dragon of Loowater

    Problem C: The Dragon of Loowater Once upon a time, in the Kingdom of Loowater, a minor nuisance tur ...