js的解析顺序 作用域 严格模式

一、javascript的解析顺序

  我们大家所理解的代码的执行顺序都是从上到下的,但是实际上确不是这样的。我们看一下下面的代码。

  

12 a = 1;

  如果执行顺序是从上到下的,在上面弹出一个a,浏览器会认为从上到下执行的,那么当它alert(a)的时候,他就会发现没有这个东西,那么他就会报错,但是实际上他弹出来的结果是undefined。返回值是undefined说明a没有被定义也就是没有赋值。下面我来讲解一下javascript的解析顺序。

  1.ES5中有声明意义的关键字

    var   会存在变量提升

    function  也有声明变量的的作用。

  2.解析顺序

    1.找声明  var、function   声明:只是声明变量,而不包括赋值。

    2. 执行

    注意:以上两步 都遵循从上至下,执行的时候遇到等号,先看等号的右边。

    注意:当function声明的变量和var声明的变量重名时,function的变量权重会比var声明的要高。

  下面多来几个例子解析一下就清楚许多了,但是看例子之前要知道一下什么叫作用域。

二、作用域

  作用域就是:起作用的范围分为下面两种

  1.全局作用域

  2.函数作用域

    他们两个的区别看下面的例子仔细分析。

三、看几个例子解析一下执行顺序的步骤

 1. 第一个例子:

x = 5 x = 10

  解析过程

  1,.寻找声明   (看全局作用域)

    var x;

    function a(){} 

  2.执行

    x = 5;

    a()  ------------->执行到这个函数的过程中在重新进行以上两步

            1,寻找声明 var x;  (函数作用域)

            2. 执行

              alert(x);  这个x在函数作用域中存在,并且还没有执行到赋值的那一步,那么弹出的东西就是undefined;

              x = 10;

    alert(x)    这里弹窗是全局变量  5;    

  所以浏览器弹窗的内容是   undefined  5

 2. 第二个例子

x = 10

  解析过程 按照上面的例子一样分析

  1. 寻找声明

   function a(){}

  2.执行

   a()------------------------->函数

            1.寻找声明

              var x;

            2.执行

              alert(x)    弹出未定义

              x = 10;

  alert(x);  这里的x会从全局中寻找x,但是发现并没有x,所 以浏览器会 报错     x is not  defined x没有被定义

  所以浏览器的弹出的内容是  undefined  报错

 

  我相信看了这两个例子的人都对这个解析过程都有了清除的了解,如果还是不太了解,建议重新看一次。

  下面介绍几个需要注意的地方, 直接上例子

 3. 第三个例子

  前面讲到了当function声明的变量和var声明的变量重名时,function的变量权重会比var声明的要高。来一个例子证明一下

  

<span style="color: #0000ff;">function<span style="color: #000000;"> a() {
alert("函数"<span style="color: #000000;">)
}

<span style="color: #0000ff;">var a = 1<span style="color: #000000;">;
alert(a)

  解析过程

  1.寻找声明

   function a(){}

   var a;

  2. 执行

    alert(a) 前面说到了function的声明比var声明的权重高,所有执行这个的时候他会弹出这个 函数块(函数体)

    a = 1;

    alert(a);     这里弹出的就是 1 了

  所以最后的结果就是 函数块 1;

 4.第四个例子

  子作用域可以向父级作用域找变量,直到全局作用域为止,反之不行。 如果子作用域有同样的变量,那么他就会使用自己的,不会去找爸爸要。

  

a = 5<span style="color: #0000ff;">function<span style="color: #000000;"> fn() {
alert(a)
}

fn()

  解析过程

  1.寻找声明

    var a;

    function fn(){}

  2.执行

    a = 5;

    fn()--------------------------------------> 函数

                    1.找声明

                    2.执行

                     alert(a);  他这里没有a 所以去找爸爸要。  a = 5;   所以弹窗是  5

  所以最后结果为  弹窗5

  下面看一下爸爸会不会去找儿子要东西

b = 5

  1.寻找声明

    function fn(){}

  2. 执行

    fn()----------------------------------------> 函数

                      1.寻找声明

                        1.var b;

                      2.执行

                        return b;

  alert(b);   //我们看一下返回值是多少   b is not defined   他说b没有被定义,说明父作用域不可以向自作用域去寻找变量。

 

 5. 第五个例子

  当一个变量无中生有时,不管从哪个作用域出来的,统统归到window下,下面看两个例子

  

a = 0 a = 1

这一个例子应该可以自己分析了  最后的结果是  undefined   0

我们再来看一下下面这个你会很吃惊

a = 0= 1

  明明都一样,我吃惊什么 返回值不是还是 undefined 和 0 吗

  但是你有没有发现倒数第二行 上面的声明了 下面的没有声明,来解析一波

  1.寻找变量

    var a;

    function fn(){}

  2.fn()---------------------------->函数

          a = 1;  这个时候就说到了那一点,无中生有的变量,统统归到window下面

  所以下面的执行过程

  alert(a)    这里的弹窗就是  1 了

   a = 0;

     alert(a)   弹出 0

  所以最后的结果是   1       0 

四、严格模式

  严格模式下的代码执行时,非常严格

  变量不允许无中生有

  意义:规范代码开发的流畅,逻辑

  

"use strict"= 1

当我们写后面两句代码的时候不会报错和出现问题,但是当我们加上第一句代码的时候,我们在这样写的时候就会报错了。所以我们还是按照规范的标准来,提高自己的能力

五、可能好多人做了上面的例子感觉不太过瘾,下面我再给出几个例子,可以自己去分析分析,我会在最后面给出答案。

1. 第一个例子    //  10 报错

a = 1020

2.第二个例子   undefined 1 0

a = 0 a = 1

3.第三个例子 当同样的声明同样的名字重复时,后面写的会覆盖前面写的  //2  1  1  3

a = 12 a = 3

 如果你看到我的文章可以收获一些知识,那么我会非常高兴的。

 

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


这篇文章主要介绍“基于nodejs的ssh2怎么实现自动化部署”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“基于nodejs...
本文小编为大家详细介绍“nodejs怎么实现目录不存在自动创建”,内容详细,步骤清晰,细节处理妥当,希望这篇“nodejs怎么实现目录不存在自动创建”文章能帮助大...
这篇“如何把nodejs数据传到前端”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这...
本文小编为大家详细介绍“nodejs如何实现定时删除文件”,内容详细,步骤清晰,细节处理妥当,希望这篇“nodejs如何实现定时删除文件”文章能帮助大家解决疑惑...
这篇文章主要讲解了“nodejs安装模块卡住不动怎么解决”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来...
今天小编给大家分享一下如何检测nodejs有没有安装成功的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文...
本篇内容主要讲解“怎么安装Node.js的旧版本”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“怎...
这篇“node中的Express框架怎么安装使用”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家...
这篇文章主要介绍“nodejs如何实现搜索引擎”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“nodejs如何实现搜索引擎...
这篇文章主要介绍“nodejs中间层如何设置”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“nodejs中间层如何设置”文...
这篇文章主要介绍“nodejs多线程怎么实现”,在日常操作中,相信很多人在nodejs多线程怎么实现问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法...
这篇文章主要讲解了“nodejs怎么分布式”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“nodejs怎么分布式”...
本篇内容介绍了“nodejs字符串怎么转换为数组”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情...
这篇文章主要介绍了nodejs如何运行在php服务器的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇nodejs如何运行在php服务器文章都...
本篇内容主要讲解“nodejs单线程如何处理事件”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“nodejs单线程如何...
这篇文章主要介绍“nodejs怎么安装ws模块”,在日常操作中,相信很多人在nodejs怎么安装ws模块问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法...
本篇内容介绍了“怎么打包nodejs代码”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!
本文小编为大家详细介绍“nodejs接收到的汉字乱码怎么解决”,内容详细,步骤清晰,细节处理妥当,希望这篇“nodejs接收到的汉字乱码怎么解决”文章能帮助大家解...
这篇“nodejs怎么同步删除文件”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇...
今天小编给大家分享一下nodejs怎么设置淘宝镜像的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希