Javascript(Basic Pink) 预解析

---

引例

//1问
// console.log(num);

//2问
console.log(num); //undefined
var num = 10;

//3问
fn();
function fn() {
    console.log(11);
}

//4问
fun();
var fun = function () {
    console.log(22);
}

---

步骤

js引擎运行js主要分为2步：

1. 预解析
2. 代码执行

预解析：把JS里面所有的var还有function提升到当前作用域的最前面
主要分为：

1. 变量提升：把所有的变量声明提升到作用域的最前面。注意：只是声明不赋值
2. 函数提升：就是把所有的函数声明提升到作用域的最前面，但是不调用函数

代码执行：按照代码的书写顺序从上往下执行

---

结论

所以对于引例的第四问，代码可以等价为

var fun;
fun();
fun = function(){
		console.log(22);
		}

所以问4 的运行结果是ERROR

结合函数声明的原因，也解释了问3为什么可以顺利执行，相当于在预解析的时候已经对函数进行了初始化了

---

案例1

//案例1
var num = 10;
fun();

function fun() {
    console.log(num);
    var num = 20;
}

//相当于执行了以下操作
var num

function fun() {
    var num
    console.log(num);
    num = 20;
}

num = 10;
fun();

运行结果:

---

案例2

//案例2
var num = 10;

function fn() {
    console.log(num);
    var num = 20;
    console.log(num);
}

fn();

//等价于
var num;

function fn() {
    var num
    console.log(num);
    num = 20;
    console.log(num);
}

num = 10;
fn();

运行结果:

---

案例3

//案例3
function f1() {
    var a = b = c = 9;
    console.log(a);
    console.log(b);
    console.log(c);
}

f1();
console.log(c);
console.log(b);
console.log(a);

注意，第三行的连等赋值相当于

var a  = 9; b = 9; c = 9;

其中b、c没有var赋值，当全局变量来看
所以

console.log( c );
console.log( b );

这两句话不会报错，可以正常执行，但是a在外面并没有赋值，最后会报错
所以结果如下

---

写在最后

注:上述笔记均来自JavaScript基础语法-dom-bom-js-es6新语法-jQuery-数据可视化echarts黑马pink老师前端入门基础视频教程 这一课程的学习记录，主要供自己的学习分享

各位看官，都看到这里了，麻烦动动手指头给博主来个点赞8，您的支持作者最大的创作动力哟！ ＜（＾－＾）＞
才疏学浅，若有纰漏，恳请斧正
本文章仅用于各位同志作为学习交流之用，不作任何商业用途，若涉及版权问题请速与作者联系，望悉知