原生JS--编译与执行

JS在执行代码时，会先编译，再执行。所谓编译，即通读全文，找到var和function，做出对应提升；执行时，按照逻辑，结构正常执行。
下面给大家介绍几种提升的情况。

1、变量的提升

• 找到所有的var关键字，把var的声明，提升到的作用域最开始的位置。
  • var声明的变量会提升
  • 但赋值会在原本位置

	console.log(a);     // undefined
    var a = 10;
    console.log(a);     // 10

    '↑↑↑↑等价于↓↓↓↓'

    var a; // 把var声明的变量提升到作用域开始的地方
    console.log(a);     // undefined
    a = 10; // 但赋值仍在原来的位置
    console.log(a);     // 10

2、函数的提升

• 声明式创建函数的提升是整体提升
• 找到所有的function关键字，把fucntion声明的函数，整体提升到的作用域最开始的位置
  • 整体提升
  • 既提前声明，又提前赋值

    fn();	// hello
    function fn(){
        console.log("hello")
    }
    fn();	// hello

    '↑↑↑↑等价于↓↓↓↓'

    function fn(){ // 把function整体提升到作用域最开始的地方
        console.log("hello")
    }
    fn();	// hello
    fn();	// hello

3、当var遇到function

3.1、赋值式创建函数

• 提升的是var，不是函数

	console.log(a); // undefined
	var a = function() {};
	console.log(a); // function

	'⬆⬆⬆ 相当于 ⬇⬇⬇'

	var a; // 只把var声明的变量提升到作用域最开始
	console.log(a);
	a = function() {} // 相当于第1种情况，这里函数作为值使用，仍在原来的位置
	console.log(a);

3.2、变量和声名式函数重名

• 这里先提个题外话。每声明一个变量，相当于在内存中划分了一个区域。第一次遇到var声明的变量时（假设var a = 10），划分好了区域。再遇到a时（假设a = 20），不会重新划分区域，而是直接覆盖原区域。也就是说此时变量a所在的区域的值为20。
• 如果遇到了function，和var的基础规则一致。
• 如果var的变量和function的名字重名，先执行var，var的优先级更高，内存先按照var的声明划分区域，然后function直接占用，生效的是function。

    console.log(a);		// function(){}
    var a = "hello";
    console.log(a)		// hello
    function a(){}
    console.log(a);		// hello

    '↑↑↑↑等价于↓↓↓↓'

    var a; // var的优先级更高，提升到作用域最开始的地方
    function a(){}; // function直接占用
	console.log(a);	// function(){} 
    a = "hello"; // 值仍然在原本的位置
    console.log(a) // hello
    console.log(a);	// hello

本文地址：https://blog.csdn.net/qq_41860731/article/details/107137487