深入理解js的变量提升和函数提升(转)
一、变量提升
在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的变量提升和函数提升(转)的更多相关文章
- JS逻辑题 技术点: 1). 变量提升 2). 函数提升 3). 预处理 4). 调用顺序
考查的技术点: 1). 变量提升 2). 函数提升 3). 预处理 4). 调用顺序 var c = 1; function c(c) { console.log(c); var c = 3; ...
- JS——变量提升和函数提升
一.引入 在了解这个知识点之前,我们先来看看下面的代码,控制台都会输出什么 var foo = 1; function bar() { if (!foo) { var foo = 10; } aler ...
- JS 变量提升与函数提升
JS 变量提升与函数提升 JS变量提升 变量提升是指:使用var声明变量时,JS会将变量提升到所处作用域的顶部.举个简单的例子: 示例1 console.log(foo); // undefined ...
- js变量提升与函数提升的详细过程
大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...
- js中的变量提升和函数提升
从上周开始,我所在的学习小组正式开始了angular的学习,angular是全面支持es6的,所以语法上和以前的angular有了很大的不同,比如变量声明时就抛弃了var,而选择了let和const: ...
- js中变量提升和函数提升
变量提升和函数提升的总结 我们在学习JavaScript时,会遇到变量提升和函数提升的问题,为了理清这个问题,现做总结如下,希望对初学者能有所帮助 我们都知道 var 声明的变量有变量提升,而 let ...
- 对javascript变量提升跟函数提升的理解
在写javascript代码的时候,经常会碰到一些奇怪的问题,例如: console.log(typeof hello); var hello = 123;//变量 function hello(){ ...
- JavaScript系列文章:变量提升和函数提升
第一篇文章中提到了变量的提升,所以今天就来介绍一下变量提升和函数提升.这个知识点可谓是老生常谈了,不过其中有些细节方面博主很想借此机会,好好总结一下. 今天主要介绍以下几点: 1. 变量提升 2. 函 ...
- JavaScript:变量提升和函数提升
第一篇文章中提到了变量的提升,所以今天就来介绍一下变量提升和函数提升.这个知识点可谓是老生常谈了,不过其中有些细节方面博主很想借此机会,好好总结一下. 今天主要介绍以下几点: 1. 变量提升 2. 函 ...
- JavaScript: 变量提升和函数提升
第一篇文章中提到了变量的提升,所以今天就来介绍一下变量提升和函数提升.这个知识点可谓是老生常谈了,不过其中有些细节方面博主很想借此机会,好好总结一下. 今天主要介绍以下几点: 1. 变量提升 2. 函 ...
随机推荐
- jar包作用
hibernate中jar包的作用 (1)hibernate3.jar:Hibernate的核心库,没有什么可说的,必须使用的jar包 (2)cglib-asm.jar:CGLIB库,Hibernat ...
- 【VS外接程序】利用T4模板生成模块代码
引言 记得第一次做asp.net mvc项目时,可以用model直接生成Html的增删改查页面, 没什么特殊要求都可以不用修改直接用了, 觉得很神奇,效率太高了.后来在做客户端开发时,发现很多模块都是 ...
- Spring_总结_03_装配Bean(二)_Java配置
一.前言 本文承接上一节:Spring_总结_03_装配Bean(一)之自动装配 上一节提到,装配Bean有三种方式,首先推荐自动装配.当自动装配行不通时,就需要采用显示配置的方式了. 显示配置有两种 ...
- LeetCode OJ:Contains Duplicate III(是否包含重复)
Given an array of integers, find out whether there are two distinct indices i and j in the array suc ...
- 面试题46:求1+2+...+n
题目:求1+2+...+n,要求不能使用乘除法.for.while.if.else.swithc.case等关键字及条件判断语句(A?B:C). 解法一:利用构造函数求解 class Temp { p ...
- Python网络编程2018-01-26更新
前言:使用python3.x写的socket编程,本人wechat:YWNlODAyMzU5MTEzMTQ=. 如果内容有错,请指出来. ssh服务端 # 1.接收一个连接实例 # 2.接收数据 # ...
- hdu4121 poj4001 Xiangqi(模拟)
模拟题考验coding能力,一定要思路清晰,按照模块化思想,有哪些情况,需要哪些功能都要事先分析好了.高手的模拟题代码往往结构很清晰,功能模块写成函数,没有过多重复代码,让人一看便明. 方法选择的好坏 ...
- Android Volley完全解析(四),带你从源码的角度理解Volley
转载请注明出处:http://blog.csdn.net/guolin_blog/article/details/17656437 经过前三篇文章的学习,Volley的用法我们已经掌握的差不多了,但是 ...
- 《zero to one》读后感
五一放假,赶上下雨,天气很凉爽,这种天气很舒服,不冷不热,听着滴答的雨声,看看书其实也不错. 约了两个同学吃了顿饭,然后决定窝在实验室了,最近看了彼得.蒂尔的<zero to one>,确 ...
- 安装webpack
首先要安装 Node.js, Node.js 自带了软件包管理器 npm,Webpack 需要 Node.js v0.6 以上支持,建议使用最新版 Node.js. 用 npm 安装 Webpack: ...