一、变量提升

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

1
2
3
4
5
6
7
8
9
10
console.log(global); // undefined
var global = 'global';
console.log(global); // global
 
function fn () {
  console.log(a); // undefined
  var a = 'aaa';
  console.log(a); // aaa
}
fn();

  之所以会是以上的打印结果,是由于js的变量提升,实际上上面的代码是按照以下来执行的:

1
2
3
4
5
6
7
8
9
10
11
12
var global; // 变量提升,全局作用域范围内,此时只是声明,并没有赋值
console.log(global); // undefined
global = 'global'// 此时才赋值
console.log(global); // 打印出global
 
function fn () {
  var a; // 变量提升,函数作用域范围内
  console.log(a);
  a = 'aaa';
  console.log(a);
}
fn();

二、函数提升

  js中创建函数有两种方式:函数声明式和函数字面量式。只有函数声明才存在函数提升!如:

1
2
3
4
console.log(f1); // function f1() {}   
console.log(f2); // undefined  
function f1() {}
var f2 = function() {}

  只所以会有以上的打印结果,是由于js中的函数提升导致代码实际上是按照以下来执行的:

1
2
3
function f1() {} // 函数提升,整个代码块提升到文件的最开始<br>     console.log(f1);   
console.log(f2);   
var f2 = function() {}

  

结语:基本上就是这样,要熟练掌握的话可以多做些练习,test:

1
2
3
4
console.log(f1()); 
console.log(f2);   
function f1() {console.log('aa')}
var f2 = function() {}
1
2
3
4
5
6
(function() {
  console.log(a);
  a = 'aaa';
  var a = 'bbb';
  console.log(a);
})();

深入理解js的变量提升和函数提升(转)的更多相关文章

  1. JS逻辑题 技术点: 1). 变量提升 2). 函数提升 3). 预处理 4). 调用顺序

    考查的技术点:  1). 变量提升 2). 函数提升  3). 预处理  4). 调用顺序 var c = 1; function c(c) { console.log(c); var c = 3; ...

  2. JS——变量提升和函数提升

    一.引入 在了解这个知识点之前,我们先来看看下面的代码,控制台都会输出什么 var foo = 1; function bar() { if (!foo) { var foo = 10; } aler ...

  3. JS 变量提升与函数提升

    JS 变量提升与函数提升 JS变量提升 变量提升是指:使用var声明变量时,JS会将变量提升到所处作用域的顶部.举个简单的例子: 示例1 console.log(foo); // undefined ...

  4. js变量提升与函数提升的详细过程

    大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...

  5. js中的变量提升和函数提升

    从上周开始,我所在的学习小组正式开始了angular的学习,angular是全面支持es6的,所以语法上和以前的angular有了很大的不同,比如变量声明时就抛弃了var,而选择了let和const: ...

  6. js中变量提升和函数提升

    变量提升和函数提升的总结 我们在学习JavaScript时,会遇到变量提升和函数提升的问题,为了理清这个问题,现做总结如下,希望对初学者能有所帮助 我们都知道 var 声明的变量有变量提升,而 let ...

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

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

  8. JavaScript系列文章:变量提升和函数提升

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

  9. JavaScript:变量提升和函数提升

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

  10. JavaScript: 变量提升和函数提升

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

随机推荐

  1. Chrome Adobe flash player已过期怎么办

    越来越多的朋友感受到了来自谷歌chrome新版浏览器的压力,因为有不少朋友在使用新版chrome浏览器看视频时,却出现了这样的提示:Adobe flash player已过期!怎么办啊? 有网友抱怨: ...

  2. MySQL 添加、查看字段注释

    语法: 创建表时的COMMENT内容,要查看这些内容,使用命令: show full fields from '表名称'; 查看tb_usr表字段注释: 创建新表的脚本中, 可在字段定义脚本中添加co ...

  3. cscope配置和使用

    , cscope安装 软件下载:http://sourceforge.net/project/showfiles.php?group_id=4664 软件安装: ./configure --with- ...

  4. Reinforcement Learning Q-learning 算法学习-1

  5. 洛谷 P2822 组合数问题

    题目描述 组合数C_n^mC​n​m​​表示的是从n个物品中选出m个物品的方案数.举个例子,从(1,2,3) 三个物品中选择两个物品可以有(1,2),(1,3),(2,3)这三种选择方法.根据组合数的 ...

  6. php7 新特性整理

    PHP7 已经出来1年了,PHP7.1也即将和大家见面,这么多好的特性,好的方法,为什么不使用呢,也希望PHP越来越好. 在这里整理 PHP 5.1 ,PHP5.2,PHP5.3,PHP5.4,PHP ...

  7. Web打印的处理 方案之普通报表打印

    做过许多 的Web项目,大多数在打印页面内容的时刻 ,采用的都是议决 Javascript调用系统内置的打印要领 执行 打印,也就是调用 PrintControl.ExecWB(?,?)实现直接打印和 ...

  8. CAS环境搭建-证书方式(https连接)

    一.教程前言 1 教程目的:从头到尾细细道来单点登录服务器及客户端应用的每个步骤 2 单点登录(SSO):请看<CAS简介> 3 本教程使用的SSO服务器是Yelu大学研发的CAS(Cen ...

  9. 高性能服务器架构 的几个注意点 (High-Performance Server Architecture)

    High-Performance Server Architecture 高性能服务器架构 来源:http://pl.atyp.us/content/tech/servers.html译文来源:htt ...

  10. 异常java.sql.SQLException: Field 'id' doesn't have a default value

    使用spring data jpa出现这个情况. entity中的自增策略已经加好了. 还是出现这个异常.去数据库中查看,发现没有给主键加上自增. 出现这个问题去实体类跟数据库中看一下就可以了.