javascript的预解析

目录

一、预解析

1、定义

1.1声明

1.2定义

2、var预解析和function函数的预解析

2.1var预解析

         2.2function函数的预解析

2.3两者的区别

二、预解析中的一些机制

1、不管条件是否成立，提前声明带var的

2、 只预解析“=”左边的，右边的是指针，不参与预解析

3、 名字已经声明过了，不需要重新的声明，但是需要重新的赋值

---

 

一、预解析

1、定义

在当前作用域中，JavaScript代码执行之前，浏览器首先会默认的把所有带var和function声明的变量进行提前的声明或者定义。

注：var是ES6之前的定义变量的方式。ES6之后引入了let。

var a = 10;

1.1声明

var a 就是声明，即在浏览器中声明一个a变量，但是并没有初始化。

1.2定义

a = 10 就是定义， 定义就是给变量进行赋值。

2、var预解析和function函数的预解析

2.1var预解析

        /*先解析var变量num
		  然后执行console输出
		  最后把10赋给num
        */
          console.log("num=",num); //先使用变量
          var num = 10; //再使用 var 关键词声明的变量,执行结果是 undefined

 

 注:在JavaScript中如果是没有使用 var 关键词声明的变量,执行结果是会报错 。

•        如果是报错,之后的所有程序,都不会执行 。
•        如果是 undefined 之后程序还可以继续执行。

原因：

2.2function函数的预解析

       /*
		   先解析fn函数的定义
		   然后执行console语句
		*/
		console.log("1+2+3+...+100=",fn());

		function fn(){
			var s = 0;
			for(var i=1;i<=100;i++){
				s += i;
			}
			return s;
		}

2.3两者的区别

• var声明的变量在预解析的时候只是提前的声明。
• function声明的函数在预解析的时候会提前声明并且会同时定义。

二、预解析中的一些机制

1、不管条件是否成立，提前声明带var的

if (!('num' in window)) { 
    var num = 12;
}
console.log(num); // undefined

先将num预解析，而预解析会将该变量添加到window中，作为window的一个属性。那么 'num' in window 就返回true，取反之后为false，这时代码执行不会进入if块里面，num也就没有被赋值，最后console.log(num)输出为undefined。

2、 只预解析“=”左边的，右边的是指针，不参与预解析

fn(); // -> undefined();  // Uncaught TypeError: fn is not a function
var fn = function () {
    console.log('ok');
}

fn(); -> 'ok'
function fn() {
    console.log('ok');
}
fn(); -> 'ok'

3、 名字已经声明过了，不需要重新的声明，但是需要重新的赋值

var fn = 13;                                       
function fn() {                                    
    console.log('ok');                               
}                                                  
fn(); // Uncaught TypeError: fn is not a function