变量提升(Hoisting):在ES6之前,函数声明变量声明总是被JavaScript解释器隐式地提升(hoist)到包含他们的作用域的最顶端。

注意: 1. JavaScript 仅提升声明,而不提升初始化。2. ES6 中不存在变量提升的概念。

1. 变量提升

变量未声明:

function fn () {
console.log(name);
}
fn(); // 报错: ReferenceError: name is not defined

变量在使用后声明:

function fn () {
console.log(name);; // undefined
var name;
}
fn();

变量在使用后声明并初始化:

function fn () {
console.log(name);; // undefined
var name = 'cedric';
}
fn();

上面函数等效于下面:

function fn () {
var name;
console.log(name);; // undefined
name = 'cedric';
}
fn();

2. 函数表达式的提升

function fn () {
console.log(fn2);; // undefined
console.log(fn2());; // 报错 Error: fn2 is not a function
var fn2 = function() { };
}
fn ();

可见,在一个函数表达式声明前,可以访问其函数名,但是调用此函数会报错!!

3. 函数声明的提升

function fn () {
console.log(fn2); // fn2() {console.log('console in fn2');}
fn2(); // console in fn2
function fn2() {
console.log('console in fn2');
};
}
fn ();

在函数声明前,既可以访问函数名,也可以调用此函数。

4. 易错

var a = 1;
function fn() {
console.log( a); // undefined
var a = 2;
}
fn();
var a = 1;
function fn() {
console.log( a); // 1
a = 2;
}
fn();
var a = 1;
function fn() {
if (!a) {
var a = 2;
}
console.log( a); // 2
}
fn();
var a = 1;
function fn() {
if (!a) {
a = 2;
}
console.log( a); // 1
}
fn();

JavaScript 变量提升的更多相关文章

  1. 回归基础: JavaScript 变量提升

    from me: javascript的变量声明具有hoisting机制,它是JavaScript一个基础的知识点,也是一个比较容易犯错的点,平时在开发中,大大小小的项目都会遇到. 它是JavaScr ...

  2. JavaScript变量提升 面试题

    <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...

  3. JavaScript变量提升和函数声明预解析

    1.首先理解函数作用域 在JavaScript中,变量的定义并不是以代码块作为作用域的,而是以函数作用作用域的.也就是说,如果变量是在某个函数中定义的,那么它在函数以外的地方是不可见的.而如果该变量是 ...

  4. javascript变量提升

    提升是一种将变量和函数的声明移到函数作用域(如果不在任何函数内的话就是全局作用域)最顶部的机制. 提升影响了变量的生命周期,一个变量的生命周期包含3个阶段: 声明——创建一个新变量,例如var myV ...

  5. 最通俗易懂的javascript变量提升

    a = 'ghostwu'; var a; console.log( a ); 在我没有讲什么是变量提升,以及变量提升的规则之前, 或者你没有学习过变量提升,如果按照现有的javascript理解, ...

  6. javascript变量提升详解

    js变量提升 对于大多数js开发者来说,变量提升可以说是一个非常常见的问题,但是可能很多人对其不是特别的了解.所以在此,我想来讲一讲. 先从一个简单的例子来入门: a = 2; var a; cons ...

  7. 160622、详解JavaScript变量提升

    变量在程序中随处可见.它们是一些始终在相互影响,相互作用的的数据和逻辑.正是这些互动使应用程序活了起来. 在JavaScript中使用变量很重要的一方面就是变量的提升 —— 它决定了一个变量何时可以被 ...

  8. 详解JavaScript变量提升

    变量在程序中随处可见.它们是一些始终在相互影响,相互作用的的数据和逻辑.正是这些互动使应用程序活了起来. 在JavaScript中使用变量很重要的一方面就是变量的提升 —— 它决定了一个变量何时可以被 ...

  9. 对javascript变量提升跟函数提升的理解

    在写javascript代码的时候,经常会碰到一些奇怪的问题,例如: console.log(typeof hello); var hello = 123;//变量 function hello(){ ...

随机推荐

  1. 《图解HTTP》

    第一章.了解web及网络基础 1.2 http的诞生 HTTP于1990年问世,那时候HTTP并没有作为正式的标准被建立,被称为HTTP/0.9 HTTP正式作为标准被公布是在1996年5月,版本被命 ...

  2. RSA 非对称加密,私钥转码为pkcs8 错误总结

    RSA 非对称加密,私钥转码为pkcs8 错误总结 最近在和某上市公司对接金融方面的业务时,关于RSA对接过程中遇到了一个坑,特来分享下解决方案. 该上市公司简称为A公司,我们简称为B公司.A-B两家 ...

  3. 复合梯形公式、复合辛普森公式 matlab

    1. 用1阶至4阶Newton-Cotes公式计算积分 程序: function I = NewtonCotes(f,a,b,type) % syms t; t=findsym(sym(f)); I= ...

  4. Emmm,从删库到跑路系列之.......Root权限的重要性

    中午导入了一个.SQL文件,晚上查navicat的数据库死活打不开 错误代码1030,想起来中午导入了mysql数据库的user表,而那里面什么也没有... 默默删掉了data,然后emmm --in ...

  5. HTML DOM item() 方法

    一直不知道javascript还有类似jQ里面eq()的函数,原来原生javascript的item()有类似功能: 由于是原生javascript,先补习下children和childNodes的区 ...

  6. php 两个二维数组重组新数组,数组下标不同

    Array ( [0] => Array ( [PosNum] => 27025008 [start_time] => 20180328164929 [type] => 0 ) ...

  7. jumperserver docker部署

    最近在考虑 系统安全问题,jumperserver 用docker 部署比较简单1. 安装redis2.安装mariadb create database jumpserver charset='ut ...

  8. Android—将Bitmap图片保存到SD卡目录下或者指定目录

    直接上代码就不废话啦 一:保存到SD卡下 File file = new File(Environment.getExternalStorageDirectory(), System.currentT ...

  9. Android调用相机拍照并返回路径和调用系统图库选择图片

    调用系统图库: Intent intent = new Intent(Intent.ACTION_PICK,MediaStore.Images.Media.EXTERNAL_CONTENT_URI); ...

  10. css3动画功能介绍

    一:过渡动画---Transitions 含义:在css3中,Transitions功能通过将元素的某个属性从一个属性值在指定的时间内平滑过渡到另一个属性值来实现动画功能. Transitions属性 ...