预解析指的就是函数的编译和执行的过程，js是一个解释型的语言,就是在代码执行之前,先对代码进行通读和解释,然后再执行代码。也就是说js运行前会有两个步骤：
#1：解释代码：
因为是在所有代码执行之前进行解释,所以叫做预解析(预解释)。
预解析的内容有两个：
a：声明式函数
1）：声明式函数，指的是function f1() {
要执行的代码；
}
仅仅是声明式函数，像赋值式函数就不属于要预解析的内容了。
（什么是赋值式函数？简单说一下就是指用var 一个变量等于一个函数的方法创建的一个函数：var f1= function () {要执行的代码；}）
b：var关键字
在内存中声明有一个变量名。
#2：然后才是执行代码。
我要评论fn();//'我是fn函数'
console.log(num);//undefined
function fn(){
console.log('我是fn函数')
}
var num = 100;
咱们来看看这一段简单代码是要怎么解析的：
根据咱们上面所说：先找出声明式函数和var关键字命名的变量，然后将之提前至最前面,然后再是执行代码。
//第一阶段预解析：将下面代码提至最前面
function fn(){
console.log('我是fn函数')
}
var num ;
//第二阶段代码执行：
fn();//'我是fn函数'
console.log(num);//undefined
num = 100;//这里才会赋值
//按照这个顺序运行下来
*这里有个点要注意下：
我们的var关键字在预解析阶段只是声明变量，而不进行赋值，赋值是在第二阶段代码执行时才会进行赋值。因此是将声明式函数和声明变量提前至代码运行的最前面。
综合一二阶段按顺序执行我们可以看到：
先是声明了一个fn的函数，然后var了一个变量num，但是并没有赋值，接着运行下去是调用函数fn()，执行函数时就会打印函数里的“我是fn函数”，然后是打印num值，由于此时的num仅仅是var声明了还没赋值所以会打印undefined，然后在给num赋值。
上面那个简单例子看懂了的话咱们可以再看一个难一点的，这个要是也会了那预解析相信你也基本掌握该怎么分析了，话不多说咱们上代码。
先看看不注释f1里面的console.log(b)和console.log(c )
f1();
console.log(c);
console.log(b);
console.log(a);
function f1() {
//函数内部定义的变量只能在函数内部使用
console.log(a); //undefined
console.log(b); //试试注释我们吧
console.log(c); //试试注释我们吧
var a=b=c= 9;
}
这一段代码会输出什么呢？
根据上面一题的方法分析咱们同样来看分成两个阶段来做：
这里可以简单提一下全局变量和局部变量：
在函数f1里var a=b=c= 9;就相当于：
var a;声明一个变量；
a=b=c=9;然后给9赋值给c,b,a
此时a有声名为函数f1里面的局部变量外界不可用，b，c未声明会转换成全局变量，外界可以读取到。
进行预解析：
即：
//正确的第一阶段预解析
function f1() {
//函数内部定义的变量只能在函数内部使用
var a ; //函数内部再次预解析，将var a;提前
console.log(a); //undefined
console.log(b); //未定义b,报错,后续就不会继续执行下去了
console.log(c); //
a=b=c= 9;
}
//第二阶段代码执行
f1();
console.log(c);
console.log(b);
console.log(a);
咱们先对函数里面的这里部分分析：
var a ;声明了a变量，咱们就可以打印出来a，由于赋值是在打印之后所以打印结果为undefined，然后此时console.log(b)和console.log(c )，这两个都还没var声明定义所以会直接打印会报错（报错结果为：Uncaught ReferenceError: b is not defined意思就是b还没定义，只要有一个报错后面就不会继续执行了），所以也就不需要继续看第二阶段的执行了，到这就报错了。
这个题其实咱们可以在改改，如我上面说的将f1里面的：
//console.log(b); 试试注释我们吧
//console.log(c); 试试注释我们吧
这个时候第二阶段就可以继续走下去了，注释后预解析以及执行代码：
function f1() {
//函数内部定义的变量只能在函数内部使用
var a ;
console.log(a); //undefind
//console.log(b);
//console.log(c);
a=b=c= 9;
}
f1();
console.log(c);//9
console.log(b);//9
console.log(a);//报错Uncaught ReferenceError: a is not defined
运行结果为什么会不一样呢？
在函数f1里var a=b=c= 9;就相当于：
var a;声明一个变量；
a=b=c=9;然后给9赋值给c,b,a。
a是函数里用var声明的，是一个局部变量，而b,c没有声明,变量未声明直接赋值，会被转换成全局变量，所以二阶段代码执行时f1里面的a声明了打印时还未赋值，为undefined，外面的c,b由于在里面没有用var声明为全局变量，外部也能读取，所以分别打印9,9，而a是函数里面声明的局部变量，外部不可用，所以a会报错，因为在外部没有定义，更别谈赋值了，相信看到这各位同学对预解析应该理解的也差不多了吧。
本文地址：https://blog.csdn.net/weixin_42649868/article/details/107281616
如对本文有疑问， 点击进行留言回复！！
JS 浅拷贝——Shallow copy 在 Canvas 绘图中的应用
网友评论