Web | JavaScript的提升机制

作用对象: 函数和变量的声明.

作用效果: 会将其声明提升到其所在的作用域的最顶端.函数会优先于变量的声明.

//函数的提升优于变量的提升
	test();
	var a=2;
	function test(){
		console.log(a);
	}
//浏览器会将其提升为===>
    function test(){
            console.log(a);
        }
		var a;
		test();
		a=2;

如果在同一个作用域内,有相同命名的变量和函数,那么变量的声明就会被忽略掉,只要函数的声明有效.(但是变量的赋值行为依然有效)

//相同命名的变量和函数声明
		foo();
		var foo;
		function foo() {
			console.log( 1 );
		}
//浏览器解析====>
		function foo() {
			console.log( 1 );
		}
		//var foo; 被忽略无效
		foo();

//2
	function a() {}
      var a;
  	console.log(typeof a)//function

//3
	var c = 1
  	function c(c) {
    console.log(c)
    var c = 3
  	}
  	c(2)   //结果是error

借助一些小实例能够更清晰的看到提升所带来的效果

		var foo=2;
		test();
		function test(){
			foo=5;
			function foo(){
				console.log(1);
			}
		}
		console.log(foo);
//浏览器解析====>
		function test(){
			function foo(){
				console.log(1);
			}
            foo=5;
		}
		var foo;
		foo = 2;
		test();
		console.log(foo)  //==>2

需要注意的是,如果是在代码块中声明的函数,会自己转化成函数表达式,那么提升的就仅仅只是指向表达式的变量.

		//代码块中无作用域
		console.log(a);//undefined
		console.log(b);//undefined
		if(true){
			var a=0;
		}else{
			var b=2;
		}
		//代码块中的函数转化,下面函数相当于注释的样子
		console.log(test)//undefined
		if(true){
			/*var test =function (){
				console.log("if");
			}*/
			function test (){
				console.log("if");
			}
		}else{
			/*var test =function (){
				console.log("eles");
			}*/
			function test (){
				console.log("else");
			}
		}
		console.log(test)//函数