`

变量提升

 
阅读更多

看一个有趣的例子,它显示了关于局部和全局作用域的一个重要问题:

 

    var a =123;
    function f() {
        console.log(a);
        var a = 1;
        console.log(a);
    }
    f();

        您可能会想当然的认为console.log()第一次显示123(也就是全局变量a的值),第二次显示1(即局部变量a)。但事实并非完全如此,查看firebug输出结果,如下:

> undefined
> 1
 

      这是因为函数域始终优于全局域,所以局部变量a会覆盖掉所有与它同名的全局变量,尽管在console.log()第一次被调用时,a还没有被正式定义(即该值为undefined),但该变量本身已经存在于本地空间了。这种特殊现象叫做提升(hoisting)。

    也就是说,当Javascript执行过程进入新的函数时,这个函数内部声明的所有变量都会被移动(或者说提升)到函数最开始的地方。这个概念很重要,必须牢记。另外需要注意的是,被提升的只有变量声明,这意味着,只有函数体内声明的这些变量在该函数执行开始时就存在,而与之相关的赋值操作并不会被提升,它还在原来的位置上。上述例子可以被等价的写为:

 

    var a =123;
    function f() {
        var a; // some as: var a= undefined;
        console.log(a); // undefiend;
        var a = 1;
        console.log(a); // 1
    }

 

     再看一个有趣的例子:

    console.log('global1:'  + window.a);
    function hehe()  {
        console.log('func area1:' + window.a);
        console.log('func area2:' + a);
    }
    hehe();
    console.log('global2:'  + window.a);

 您可能认为输出结果是这样的:

> global1: undefined
> func area1: undefined
> func area2: undefiend
> global2: undefined
 

通过查看firebug控制台,实际结果是这样的:

> global1:undefined
> func area1:undefined
> ReferenceError: a is not defined

 

    在输出func area1的时候出错了。为什么func area1 和func area2不同呢,a不应该是全局变量吗?如果因为未定义而出错,那window.a为啥不出错?

    原来,在javascript里,如果访问的对象的属性不存在,代码就会返回undefiend,window.a属于不存在的属性,所以返回undefined,而a属于不存在的变量,故出错,二者性质不通,把window.a改成其他对象效果是一样的:

    var o = {};
    console.log(o.v);

 

 

分享到:
评论

相关推荐

    【JavaScript源代码】JavaScript中变量提升和函数提升实例详解.docx

    变量提升和函数提升在JavaScript中的应用 JavaScript是一种基于对象的脚本语言,广泛应用于Web开发中。其中,变量提升和函数提升是JavaScript语言中两个非常重要的概念。变量提升和函数提升是JavaScript语言的核心...

    JS变量提升及函数提升实例解析

    JavaScript中的变量提升(Variable Hoisting)和函数提升(Function Hoisting)是理解JS代码执行机制的关键概念。在JS中,作用域分为全局作用域和函数作用域,而在ES6引入了块级作用域(例如使用`let`和`const`声明...

    JS变量提升原理与用法实例浅析

    JavaScript中的变量提升(Hoisting)是语言特性的一种表现,它涉及到变量声明和函数声明的处理方式。在JavaScript引擎解析代码时,它会首先扫描整个作用域,将所有的`var`变量声明和函数声明提升到它们所在的作用域...

    详解javascript中的变量提升和函数提升

    JavaScript中的变量提升(Variable Hoisting)和函数提升(Function Hoisting)是理解JavaScript执行机制的关键概念,它们在JavaScript代码解析和执行过程中起着至关重要的作用。本文将详细讲解这两个概念,帮助...

    最通俗易懂的javascript变量提升详解

    JavaScript中的变量提升(Variable Hoisting)是编程时需要理解的关键概念,它涉及到JavaScript引擎如何处理变量和函数的声明。变量提升是指在JavaScript代码执行前,引擎会将所有的`var`和函数声明移动到它们所在...

    JavaScript中变量提升和函数提升的详解

    第一篇文章中提到了变量的提升,所以今天就来介绍一下变量提升和函数提升。这个知识点可谓是老生常谈了,不过其中有些细节方面博主很想借此机会,好好总结一下。 今天主要介绍以下几点: 1. 变量提升 2. 函数提升 3....

    JavaScript中的变量提升与函数提升

    JavaScript中的变量提升(Variable Hoisting)和函数提升(Function Hoisting)是JavaScript解析器在代码执行前进行预解析阶段的两个重要概念。预解析的主要目的是为了检查语法错误并优化代码执行效率。在这个过程中...

    JavaScript变量提升和严格模式实例分析

    JavaScript变量提升和严格模式是JavaScript编程中的两个重要概念,它们影响着代码的执行和变量的管理。 变量提升是指在JavaScript代码执行之前,函数声明和变量声明会从原来的位置被移动到其所在作用域的顶部。这一...

    javascript变量提升和闭包理解

    ### JavaScript变量提升 变量提升是JavaScript语言的一个重要特性,它允许声明的变量和函数在声明之前就可以使用。这一机制是JavaScript引擎在代码执行之前进行预编译时发生的,它将变量声明和函数声明从原来的位置...

    基于js的变量提升和函数提升(详解)

    一、变量提升 在ES6之前,JavaScript没有块级作用域(一对花括号{}即为一个块级作用域),只有全局作用域和函数作用域。变量提升即将变量声明提升到它所在作用域的最开始的部分。 上个简历的例子如: console.log...

    ESLint:ESLint规则详解:类型与变量提升.docx

    ESLint:ESLint规则详解:类型与变量提升.docx

    07-变量提升:JavaScript代码是按顺序执行的吗?_For_vip_user_0011

    介绍,现在你只需要知道,在执上下中存在个变量环境的对象变量环境的对象(ViriableEnvironment),该对象中保存了变量提升的内容,如上代码中的变量

    JavaScript中变量提升 Hoisting

    JavaScript中的变量提升(Hoisting)是指在JavaScript代码执行之前,JavaScript引擎会将当前作用域(函数或全局作用域)中所有用var声明的变量提升到作用域的顶部。然而,只有声明(即变量名)会被提升,而赋值操作...

    js变量提升深入理解

    在JavaScript编程中,变量提升(hoisting)是一个重要的概念,它涉及函数作用域和变量声明。变量提升指的是在函数中声明的变量会在函数体内的任何代码执行之前被移动到函数的顶部。这种行为是由JavaScript的执行机制...

    javascript中的变量作用域以及变量提升详细介绍

    在JavaScript编程中,变量作用域与变量提升是两个基础且重要的概念。理解这些概念对于编写有效且安全的代码至关重要。下面将详细介绍这两个概念及其相关知识点。 首先,我们需要了解什么是变量作用域。变量作用域...

Global site tag (gtag.js) - Google Analytics