關於js中的作用域和作用域鏈以及常見的問題和結果方法

在js中不僅有原型鏈還存在這作用域和作用域鏈。首先在介紹作用域和作用域鏈之前，先讓我們瞭解一下局部變量和全局變量

1.全局變量和局部變量

全局變量：定義在函數外部的變量可以被叫做全局變量

局部變量：定義在函數內部的變量，但是如果變量在函數內部沒有使用var來聲明，那麼該變量也會被認爲是全局變量。

1，全局變量對應的作用域是整個代碼，即在代碼的任何部分都是可以調用該變量的

2，局部變量對應的作用域是函數內部，只能在函數內部使用，如果在函數外部使用就會出錯

3，局部變量的優先級大於全局變量，即如果全局變量和局部變量名字一樣，那麼在函數內部局部變量會覆蓋掉全局變量。

2.函數作用域

變量在聲明它的函數體內以及該函數內部嵌套的任何函數體內都是有定義的。這句話是什麼意思呢？我們可以出個很容易出錯的代碼

	<script type="text/javascript">
		//函數作用域
		var num=2;
		function fun(){
			console.log(num);
			var num=3;
			console.log(num);
		}
		fun();
	</script>

在這個demo中，你的第一印象會輸出什麼呢？

1.如果你的腦海中的結果是第一個num=2.第二個num=3.那麼恭喜你完全打錯了。\

2.如果你的答案是第一個num=undefined，第二個num=3,那麼你就可以提過這一部分啦。

肯定所有的人都知道第二個num輸出3，但是第一個爲什麼輸出undefined有些人可能不清楚，我會帶着您一起解析一下...

解答：在該部分我們首先就拋出了一個函數作用域的概念，即變量在聲明它的函數以及該函數所嵌套的任意函數內都是有定義的，所以說上面的代碼我們可以這樣理解

	<script type="text/javascript">
		//函數作用域
		var num=2;
		function fun(){
			var num;
			console.log(num);
			num=3;
			console.log(num);
		}
		fun();
	</script>

很明顯的看到在第一個輸出的上面我們添加了一個var num；此時並沒有賦值，所以這時候在函數內部輸出num的話得出的值就是undefined。

3.函數作用域鏈

在上面的代碼中我們分析了一種常見的可能會出錯的情況，接下來我們就進入函數作用域鏈。

在js中函數可以嵌套，多個函數嵌套在一起，所以多個作用域就會相互嵌套，這種情況下就形成了作用域鏈。

其實整個直接用代碼就可以說的很清晰：

	<script type="text/javascript">
		var num=1;
		function fun(){
			var num=2;
			function fun1(){
				var num=3;
				console.log(num);
			}
			function fun2(){
				console.log(num);
			}
			fun1();
			fun2();
		}
		fun();
	</script>

上面的代碼片段其實很清晰的表明了函數作用域中變量的查找規律，輸出結果是3,2.

4.函數作用域中變量的訪問原則

首先會在當前函數的作用域中查找，如果沒有的話會沿着作用域鏈向上查找， 直至全局作用域如果還沒有的話就返回undefined

5，總結

按照慣例就行一下總結，只要對函數作用域理解清晰，那麼函數作用域鏈理解起來也會簡單很多。其實作用域鏈的查找規則和原型鏈的查找規則蠻像的。最好還是自己手動寫一個小demo實驗一下，眼見爲虛，手動纔是實際的。