深入理解js的变量提升和函数提升

一、变量提升

　　变量提升：在当前作用于中，js代码自上而下执行之前，浏览器会把所有带var/function关键字进行提前声明或定义。带var的关键字只是提前声明一下，带function的关键字在变量提升阶段把定义和声明都完成了。

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

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

1. 　　var global; // 变量提升，全局作用域范围内，此时只是声明，并没有赋值
2. 　　console.log(global); // undefined
3. 　　global = 'global'; // 此时才赋值
4. 　　console.log(global); // 打印出global

1. 　　function fn () {
2. 　　　　var a; // 变量提升，函数作用域范围内
3. 　　　　console.log(a);
4. 　　　　a = 'abc';
5. 　　　　console.log(a);
6. 　　}
7. 　　fn();

二、函数提升

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

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

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

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

结语：在函数与变量之间，函数首先会被提升，然后才是变量。

第一次写博客，写的不怎么好，继续努力。

标签：

版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点，本站所提供的摄影照片，插画，设计作品，如需使用，请与原作者联系，版权归原作者所有