script:自上而下 全局变量、全局函数

函数:由里到外

浏览器:

   “JS解析器”

    1)“找一些东西”: var function

      参数 a = undefine 所有的变量,在正式运行代码之前,都提前赋了一个值:未定义

      fn1 = function fn1(){ alert(2); } 所有的函数,在正式运行代码之前,都是整个函数块

      JS 的预解析原则: 遇到重名的:只留一个!变量和函数重名了,就只留下函数

    2)逐行解读代码:表达式(= + - * / % ++ -- ! )可以修改预解析的值! 注意:函数块不要放在if/else、for的{}里面执行;函数如果带参数,预编译 先找 参数的声明 并且把 实参赋值给形参,再执行找函数的操作

代码解析至少分两步

1)预解析:查找var,function参数例如下面这个例子

a= 未定义

fn1={alert(2)}函数的话,是整个整体

2):逐行读代码:类似=+-%*等都是表达式,表达式可以改变值

example1:

<script>

 alert(a)   //最终结果:undefiner

var a=1

function fn1(){

alert(alert(2));

} 

</script>

分析:

  预解析: a=未定义;fn1=function fn1(){alert(alert(2));}

  执行:

    alert(a)   ==》未定义

    var a=1

    function fn1(){

      alert(alert(2));

    }

example2:

alert(a)         //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

分析:

  预解析: a=未定义;a=function a(){alert(2)} a=未定义;a=function a(){alert(4)}(查找var  function 参数,,重名时只会留下有值的,这里第一个是undefine,所以踢掉,若都有值,那么谁后执行就留下谁)

  执行:  

    alert(a)         ==>function a(){alert(4)}

    var a=1    ==>a=1

    alert(a)       ==>1

    function a(){alert(2)} ==>没有表达式,不改变值

    alert(a)      ==》1

    var a=3; ==》3

    alert(a)     ==》3

    function a(){alert(4)}==>没有表达式,不改变值

    alert(a)   ==》3

example3:

var a=1;

function fn1(){

alert(a);

var a=2

}

fn1();//undefine

alert(a)//a=1

预解析:

  1):查找var function 参数

    a=未定义

    fn1=function fn1(){

    alert(a);

    var a=2

  }

执行:

  var a=1;==》a=1

  function fn1(){`==》不改变值

  alert(a);

  var a=2

  }

  fn1();==》

    开始预编译: a=1,a=未定义;,

    开始执行:

      alert(a)==》未定义

       a=2        

  alert(a) ==>a=1,因为这是函数里面的变量,不能作用到函数外;

example4:

var a=1;

function fn1(){

alert(a);//1

a=2

}

fn1()

alert(a)//2

预解析:

  a=undefine

  fn1=function fn1(){

  alert(a)

  a=2}

执行:

  var a=1;==》1️⃣a=1

  function fn1(){    3️⃣预解析:无var,无function,所以没有了

    alert(a);    4️⃣执行 a=1

    a=2     5️⃣执行a=2

    }

    fn1()   2️⃣

    alert(a)    6️⃣a=2

example5:

var a=1

function fn1(a){

alert(a);

a=2;

}

fn1(a);//1

alert(a);//1

预解析: a=未定义 fn1=function fn1(a){....}

执行:  

  var a=1 ==》a=1

  function fn1(a){  预解析: 1.a=未定义(原因是有参数,这里相当于 var a=1)  2.赋值实参 a=1, 3.a=2

    alert(a);  ==>a=1

    a=2; ==>a=2(函数内部的a=2);//内部有的值,不改变外部a变量的值;

  }

    fn1(a);//1

    alert(a);//1

 注意:如果fn1函数中带有其他函数fn1x(){} 并且执行该函数的,那么过程就是 预解析: a=未定义 a = 1,然后再是 fn1x = fn1x(){。。。},再执行函数内部。。。

js作用域的理解的更多相关文章

  1. 对JS作用域和作用域链的理解

    理解好javascript的变量作用域和链式调用机制对用好变量起着关键的作用,下面我来谈谈这两个概念的理解. (1)链式调用机制 作用域链的定义:函数在调用参数时会从函数内部到函数外部逐个”搜索“参数 ...

  2. Atitit 作用域的理解attilax总结

    Atitit 作用域的理解attilax总结 1.1. 作用域是指对某一变量和方法具有访问权限的代码空间, 1 1.2. 作用域的使用提高了程序逻辑的局部性,增强程序的可靠性,减少名字冲突.1 1.3 ...

  3. 前端基本知识(三):JS的闭包理解

    JS闭包的理解 一.变量的作用域 二.如何从外部读取局部变量 三.什么是闭包 四.深入理解闭包 五.闭包的用途 六.使用闭包注意情况 七.JavaScript的垃圾回收机制 八.一些思考题 一.变量作 ...

  4. 前端基本知识(三):JS的闭包理解(第一个思考题有错误,已修改)

    JS闭包的理解 一.变量的作用域 二.如何从外部读取局部变量 三.什么是闭包 四.深入理解闭包 五.闭包的用途 六.使用闭包注意情况 七.JavaScript的垃圾回收机制 八.一些思考题 一.变量作 ...

  5. JS作用域,作用域,作用链详解

    前言   通过本文,你大概明白作用域,作用域链是什么,毕竟这也算JS中的基本概念. 一.作用域(scope) 什么是作用域,你可以理解为你所声明变量的可用范围,我在某个范围内申明了一个变量,且这个变量 ...

  6. JS底层知识理解之执行上下文篇

    JS底层知识理解之执行上下文篇 一.什么是执行上下文(Execution Context) 执行上下文可以理解为当前代码的执行环境,它会形成一个作用域. 二.JavaScript引擎会以什么方式去处理 ...

  7. JS作用域和ASP(vbs)作用域比较

    一.js作用域,先上图: 以上代码执行的效果是,依次弹出 undefined, undefined, a, a,为什么是这样的结果啦?因为JS的作用域为链式作用域. 作用域链: 用VAR声明一个变量时 ...

  8. JS闭包的理解及常见应用场景

    JS闭包的理解及常见应用场景 一.总结 一句话总结: 闭包是指有权访问另一个函数作用域中的变量的函数 1.如何从外部读取函数内部的变量,为什么? 闭包:f2可以读取f1中的变量,只要把f2作为返回值, ...

  9. JS作用域、变量提升和闭包

    作用域 作用域可以理解为JS引擎执行代码的时候,查找变量的规则. 从确定变量访问范围的阶段的角度,可以分为2类,词法作用域和动态作用域.js是词法作用域. 从变量查找的范围的角度,可以分为3类,全局作 ...

随机推荐

  1. 设置和重置ssh key

    查看本地是否有已经生成好的ssh key $ cat ~/.ssh/id_rsa.pub 若有,先删除: $ cd ~ $ rm -rf .ssh 重新生成ssh key ssh-keygen -t ...

  2. apache的安全增强配置(使用mod_chroot,mod_security)

    apache的安全增强配置(使用mod_chroot,mod_security) 作者:windydays      2010/8/17 LAMP环境的一般入侵,大致经过sql注入,上传webshel ...

  3. python_输入一个数,判断是否是素数

    while True: n=int(input('n=')) for i in range(2,n): if n%i==0: print("n is not 素数") break ...

  4. C#事件与接口编程实例

    很多初学c#的朋友对于事件与接口感到迷惑不解,不明白它们之间的关系,下面我就用实例来简单的分析讲解一下. 事件,用event修饰符来代表一个事件,我们要创建一个C#事件必须按以下顺序来扫行: 1,创建 ...

  5. java 代码优化

    Java程序中的内存管理机制是通过GC完成的,“一个对象创建后被放置在JVM的堆内存中,当永远不在应用这个对象的时候将会被JVM在堆内存中回收.被创建的对象不能再生,同时也没有办法通过程序语句释放”( ...

  6. web前端使用localstorage、sessionstorage、cookie增删获方法

    今天主要的学习内容是cookie与本地储存的知识, 在HTML5中,本地存储是一个window的属性,包括localStorage和sessionStorage,从名字应该可以很清楚的辨认二者的区别, ...

  7. 基于django的个人博客网站建立(一)

    基于django的个人博客网站建立(一) 前言 网站效果可点击这里访问 之前基于hexo和github page搭建过一个博客网页,后来由于换了个系统,感觉弄的有点麻烦也就没有再去管它了,最近偶然从网 ...

  8. Head First Python (一)

    建立一个数组: cast = ["Cleese","Palin","Jones","Idle"] 列出数组有多少数据项: ...

  9. dijkstra与他的优化!!!

    目录 SPFA已死,有事烧纸 Dijkstra 配对堆 引言 讲解 合并 修改 弹出堆顶pop 代码 结合! 1 2 @ SPFA已死,有事烧纸 其实我本人也是一个SPFA的忠诚用户,至少我的最少费用 ...

  10. spark 对hbase 操作

    本文将分两部分介绍,第一部分讲解使用 HBase 新版 API 进行 CRUD 基本操作:第二部分讲解如何将 Spark 内的 RDDs 写入 HBase 的表中,反之,HBase 中的表又是如何以 ...