JavaScript的变量声明提升问题浅析(Hoisting)
更新时间：2016年11月30日 10:04:04 投稿：daisy
大家应该都只奥javascript的变量声明具有hoisting机制，JavaScript引擎在执行的时候，会把所有变量的声明都提升到当前作用域的最前面。网上关于JavaScript的变量声明提升问题的文章有很多，这篇文章将再次谈谈关于这方面的问题，有需要的朋友们可以参考借鉴。
一、变量声明提升
hoisting 英[‘hɔɪstɪŋ] 美[‘hɔɪstɪŋ]
n. 起重，提升
v. 把…吊起，升起( hoist的现在分词 )
先来看一个栗子
var cc = 'hello';
function foo(){
console.log(cc);
var cc = 'world';
console.log(cc);
}
foo();
console.log(cc);
这里将会输出 undefined、'world' 、'hello'
此处主要有两个知识点：
1、作用域
2、变量声明提升
JavaScript是一门解释性语言，当代码在解释器（如Chrome的V8引擎）环境中执行时，会有一个预解析的过程，此时会将变量声明和函数声明提升至当前作用域的最前方，这个行为被称为声明提升（Hoisting）
再来看上面的例子，此代码有两层作用域，全局作用域和函数foo作用域，而foo中的变量声明在预解析的过程中会被提升至函数作用域的前方，于是代码就会变成这样：
var cc = 'hello';
function foo(){
var cc;
console.log(cc);
cc = 'world';
console.log(cc);
}
foo();
console.log(cc);
当执行到第一个log时，变量cc只是进行了声明，并未赋值，所以打印出的是undefined
二、 函数声明提升
函数的声明有两种方式：函数声明和函数表达式
// 函数声明
function foo(a, b) {
return a + b;
}
// 函数表达式
var foo = function(a, b) {
return a + b;
}
解析器在向执行环境中加载数据时，对函数声明和函数表达式并非一视同仁。解析器会率先读取函数声明，并使其在执行任何代码之前可用（可以访问）；至于函数表达式，则必须等到解析器执行到它所在的代码行，才会真正被解释执行。
当然，也可以函数声明和函数表达式同时使用,如var a = function b(){} ,其结果是只具有函数表达式的作用，b会被自动忽略，所以只会发生变量提升效果。
总结
以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作能带来一定的帮助，如果有疑问大家可以留言交流。
相关文章
本文是对js中apply方法的使用进行了详细的总结介绍，需要的朋友可以过来参考下，希望对大家有所帮助2013-11-11
这篇文章主要介绍了微信小程序项目总结之记账小程序功能的实现方法（包括后端）,需要的朋友可以参考下2019-08-08
收集的一些Array及String原型对象的扩展实现代码，学习js的朋友可以参考下。并可以自定义的对字符串与array数据，进行扩展。2010-12-12
今天小编就为大家分享一篇使用layer弹窗,制作编辑User信息页面的方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2019-09-09
这篇文章主要从作用域链谈闭包，闭包（closure）是Javascript语言的一个难点，也是它的特色，很多高级应用都要依靠闭包实现，本文针对闭包进行学习,需要的朋友可以参考下2015-12-12
这篇文章主要介绍了详解uniapp的全局变量实现方式，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2021-01-01
在 Canvas 中,基本图形包括直线图形和曲线图形,在我们的工作中,经常在统计图中会看到有饼状图等这样的圆弧图形,当然绘制曲线图形那么我们要知道曲线图形的绘制往往会涉及到曲线与弧线,所以本文就给大家介绍一下Canvas绘制圆与半圆的方法2023-08-08
今天移动端正好需要图片触摸滑动效果实现代码，基于swiper实现,需要的朋友可以参考下2018-05-05
js 数据类型转换总结笔记,需要的朋友可以参考下。2011-01-01
最近的一个项目中在保存表单数据时，要用到一个动态添加行的功能。平时动态添加行只是在表格的最下面添加，现在在表格中间动态添加行，而且表格内部是包含并且单元格的，其实很简单，下面贴出代码。2010-06-06
最新评论