美文网首页让前端飞Web前端之路JavaScript 进阶营
JavaScript的变量提升和函数作用域

JavaScript的变量提升和函数作用域

作者: 小蝉_蝉 | 来源:发表于2018-08-17 17:32 被阅读7次

JavaScript 的世界,或者说编程的世界里,变量很重要,但是因为 JavaScript 的变量有些 幺蛾子般 的特性,所以总有各种奇怪的题目来考大家的应变能力。
我们先说说这幺蛾子般的特性是怎么来的,大家应该知道,JavaScript最早是花10天抄袭Java的语法而来,感觉很叼对不?然而,十天的后果是根本没有健壮性可言,俗称一堆bug......

变量声明

而这个变态的特性,在我看来就是最大的bug之一。所以,有时候看其他人乐此不比的推荐刷这种题目并且把它妖魔化的时候,我....难受。
幸好ES6出来新的变量定义let方式来修补这个bug,它的特性才是模仿正统编程里面变量的定义。而之前的幺蛾子特性,我们还是要说一下。

针对var变量,只要记住下面这句话,统统搞定

变量声明自动提前 + 变量是函数级作用域

    var b = 1
    function outer () {
        var b = 2
        function inner (){
            b++
            var b = 4
            console.log(b)   // 4
        }
        inner()
    }
    outer()

对于这段代码可以做如下分析:

  • 变量声明提前
    在函数里面定义了变量,那么你就相当于在函数的 最最前面,加了一个变量声明一样,所以上面的代码可以变为
    var b  <=======
    b = 1
    function outer () {
        var b   <=======
        b = 2
        function inner (){
            var b  <=======
            b++
            b = 4
            console.log(b); // 4
        }
        inner()
    }
    outer()
  • 函数级别作用域
    也就是说,变量只在自己的函数内有效,给大家画个图看一下
    如果你还不知道什么是作用域,在这里我用一句大家都能理解的英文概括Where to look things
    三个 b 分别的作用域
    如果你还是不理解,那我索性改一下变量名,让你看的更清晰
    var global_b

    global_b = 1
    function outer () {
        var outer_b 

        outer_b = 2
        function inner (){
            var inner_b

            inner_b++;
            inner_b = 3;
            console.log(inner_b)
        }
        inner()
    }
    outer()

虽然我是史上最不正经的程序员,但对JavaScript我是认真的,就这样,啾咪~~

相关文章

  • 2019-11-11-本周学习周报

    学习总览 JavaScript 函数作用域、块级作用域 变量提升、函数提升 CSS 新增属性transition ...

  • 块作用域和let、const

    在ES6之前,JavaScript没有块级作用域,只有全局作用域和函数作用域。 变量提升即将变量声明提升到它所在作...

  • js的提升

    JavaScript 会将函数声明和变量声明提升到当前作用域的顶部。变量赋值不会提升。在脚本的顶部声明函数和变量,...

  • JavaScript 变量提升和函数提升

    一、变量提升 在ES6之前,JavaScript没有块级作用域,只有全局作用域和函数作用域。 1.所指的形式:必须...

  • 闭包的实现原理

    作用域和作用域链 在 JavaScript 中, 作用域为可访问变量,对象,函数的集合。 全局变量 变量在函数外定...

  • 07-JavaScript作用域和预解析

    JavaScript作用域 JavaScript中有全局作用域和局部作用域 相同作用域内不能有同名的变量和函数 不...

  • JavaScript - 变量作用域

    JavaScript教程之变量作用域 变量提升:JavaScript的函数定义有个特点,它会先扫描整个函数体的语句...

  • JavaScript 中的变量作用域

    JavaScript 中的变量作用域 JavaScript中的变量作用域被定义为函数作用域。 变量的值在定义该变量...

  • JavaScript 作用域和作用域链

    JavaScript 作用域 作用域就是变量与函数的可访问范围。在JavaScript中,变量的作用域有全局作用域...

  • JavaScript作用域链

    作用域 作用域就是变量和函数的可访问范围,控制着变量和函数的可见性与生命周期,在JavaScript中变量的作用域...

网友评论

    本文标题:JavaScript的变量提升和函数作用域

    本文链接:https://www.haomeiwen.com/subject/txrtiftx.html