js变量提升深入理解

JavaScript的函数定义有个特点，它会先扫描整个函数体的语句，把所有申明的变量“提升”到函数顶部：

'use strict';

function foo() {
  var x = 'Hello, ' + y;
  alert(x);
  var y = 'Bob';
}
foo();

虽然是strict模式，但语句var x = 'Hello, ' + y;并不报错，原因是变量y在稍后申明了。但是alert显示Hello, undefined，说明变量y的值为undefined。这正是因为JavaScript引擎自动提升了变量y的声明，但不会提升变量y的赋值。

对于上述foo()函数，JavaScript引擎看到的代码相当于：

function foo() {
  var y; // 提升变量y的申明
  var x = 'Hello, ' + y;
  alert(x);
  y = 'Bob';
}

由于JavaScript的这一怪异的“特性”，我们在函数内部定义变量时，请严格遵守“在函数内部首先申明所有变量”这一规则。最常见的做法是用一个var申明函数内部用到的所有变量：

function foo() {
  var
    x = 1, // x初始化为1
    y = x + 1, // y初始化为2
    z, i; // z和i为undefined
  // 其他语句:
  for (i=0; i<100; i++) {
    ...
  }
}

以上这篇js变量提升深入理解就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

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

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

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

    变量作用域"一个变量的作用域表示这个变量存在的上下文.它指定了你可以访问哪些变量以及你是否有权限访问某个变量." 变量作用域分为局部作用域和全局作用域. 局部变量(处于函数级别的作用域)不像其他对面对象的编程语言(比方说C++,Java等等),javascript没有块级作用域(被花括号包围的):当是,javascript有拥有函数级别的作用域,也就是说,在一个函数内定义的变量只能在函数内部访问或者这个函数内部的函数访问(闭包除外,这个我们过几天再写个专题). 函数级别作用域的一个例子

  • 深入理解Javascript作用域与变量提升

    下面的程序是什么结果? 复制代码 代码如下: var foo = 1;function bar() { if (!foo) {  var foo = 10; } alert(foo);}bar(); 结果是10: 那么下面这个呢? 复制代码 代码如下: var a = 1;function b() { a = 10; return; function a() {}}b();alert(a); 结果是1. 吓你一跳吧?发生了什么事情?这可能是陌生的,危险的,迷惑的,同样事实上也是非常有用和印象深刻

  • 浅谈JavaScript中变量和函数声明的提升

    现象: 1. 在JavaScript中变量和函数的声明会提升到最顶部执行. 2. 函数的提升高于变量的提升. 3. 函数内部如果用var声明了相同名称的外部变量,函数将不再向上寻找. 4. 匿名函数不会提升. 5. 不同<script>块中的函数互不影响. 例子: 函数声明提升高于变量声明 //同时声明变量a和函数a var a; function a() {} alert(typeof a); //显示的是"function",初步证明function的优先级高于var.

  • js变量提升深入理解

    JavaScript的函数定义有个特点,它会先扫描整个函数体的语句,把所有申明的变量"提升"到函数顶部: 'use strict'; function foo() { var x = 'Hello, ' + y; alert(x); var y = 'Bob'; } foo(); 虽然是strict模式,但语句var x = 'Hello, ' + y;并不报错,原因是变量y在稍后申明了.但是alert显示Hello, undefined,说明变量y的值为undefined.这正是因为

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

    本文实例讲述了JS变量提升.分享给大家供大家参考,具体如下: 该篇介绍什么是变量提升,写给像我一样的JS新手看的 简单来说变量提升就是 JS会把var变量的声明自动提升到作用域的顶部,即使你不想这样 一个例子: (局部变量与全局变量同名时 , 局部变量覆盖全局变量) var a="全局变量"; function test() { document.writeln(a); var a="局部变量"; document.writeln(a); } test(); 上例的

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

    1在js中只有两种作用域 a:全局作用域 b:函数作用域 在ES6之前,js是没有块级作用域. 首先来解释一下什么是没有块级作用域? 所以此时 是可以打印输出变量a的值. 2:什么是变量提升? 在我们的js中,代码的执行时分两步走的,1.预解析 2.一步一步执行 在预解析阶段:首先会在全局作用域内,js解析器会找所有的 var .function .参数,并提前到当前作用域的最顶上去(变量的赋值操作不会提前,还在原来的地方),此时并没有执行代码. 然后再开始一行一行执行代码.遇到了函数调用,于是

  • JavaScript中变量提升和函数提升实例详解

    js 执行 词法分析阶段:包括分析形参.分析变量声明.分析函数声明三个部分.通过词法分析将我们写的 js 代码转成可以执行的代码. 执行阶段 变量提升 只有声明被提升,初始化不会被提升 声明会被提升到当前作用域的顶端

  • JavaScript中变量提升机制示例详解

    变量提升 JavaScript的变量提升有两种,用var声明的变量以及用function声明的变量. 用var声明的变量 我们先来看下面这段代码,a的值是多少 代码1 console.log(a); var a; 按照以往编程语言的思路来看,代码自上而下运行,按这种思路,会报错,因为执行到第2行时,变量a还没有定义,所以会报错a is not defined 然而事实上答案是undefined 好,抱着疑惑,我们看下面的代码 var a; console.log(a); 我们发现,这两段代码是一

  • 浅析JavaScript中的变量提升

    目录 前言: 函数提升 var变量提升 let & const提升 Class提升 前言: JavaScript中奇怪的一点是你可以在变量和函数声明之前使用它们.就好像是变量声明和函数声明被提升了代码的顶部一样. sayHi() // Hi there! function sayHi() { console.log('Hi there!') } name = 'John Doe' console.log(name) // John Doe var name 然而JavaScript并不会移动你的

  • JavaScript中的变量提升和函数提升

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

    目录 前言 为什么有变量提升 javascript变量提升和函数提升 总结 前言 在js中对变量进行操作后打印值经常会出现undefined的现象.其实原因是因为js中有一个叫做变量提升的功 举例: var data="lyyyyy"; getData(); function getData(){ //第一次打印 console.log("data值为: ", data); var data="yyyyyyy"; //第二次打印 console.

  • JS中作用域和变量提升(hoisting)的深入理解

    JS中作用域和变量提升(hoisting)的深入理解

    作用域(Scoping) 对于Javascript初学者来说,一个最迷惑的地方就是作用域:事实上,不光是初学者.我就见过一些有经验的javascript程序员,但他们对scope理解不深.javascript作用域之所以迷惑,是因为它程序语法本身长的像C家族的语言.我对作用域的理解是只会对某个范围产生作用,而不会对外产生影响的封闭空间.在这样的一些空间里,外部不能访问内部变量,但内部可以访问外部变量. c语言的变量分为全局变量和局部变量,全局变量的作用范围是任何文件和函数访问(当然,对于非变量定

  • javascript变量提升和闭包理解

    我们先来看一个题目: <script> console.log(typeof a)//undefined var a='littlebear'; console.log(a)//littlebear </script> <script> console.log(typeof a)//string var a=1; console.log(a)//1 </script> 第一个script里可以看出var a 被提升到顶部,a = 'littlebear'被保

  • web面试之JS预解析与变量提升区别

    目录 什么是预解析? 变量和函数预解析的区别 重复声明var变量 变量提升和函数提升优先级 函数优先级大于变量优先级的深入探究 预解析流程 搜寻预解析关键字 执行预解析 几个需要注意的细节 什么是预解析? 概念: JS代码在在代码从上往下执行前,浏览器会先把所有变量声明解析一遍, 这个阶段叫预解析. 详讲 寻找作用域中的var 和function声明(匿名函数没有function声明,所以不会提升),然后对其进行事先声明, 并把赋值操作留在原地,再从上到下执行代码.这就是一个预解析的过程. 变量

随机推荐