【前端學習】javascript作用域(鍊）和this

前言

    要想學好javascript，了解作用域和this是非常重要的，尤其是this，對剛學習這門語言的新手來說，了解起來絕對是個挑戰，但是如果不好好掌握的話，你就沒法了解一些代碼的意圖，因為javascript中的this很詭異。 為了學習這些知識，我除了看書意外，從網上找了一些比較通俗易懂的文章，分享給大家，詳細後後面的參考文章。

關于作用域鍊

    為了了解javascript中變量的檢索機制，首先需要掌握作用域和作用域鍊的知識。關于這些知識，大家還是參考文章後的參考文章，寫得非常詳細。這裡我分享下個人學習的總結和了解：

javascript中作用域是什麼？

    作用域是為了控制變量和函數的可通路範圍、可見性以及生命周期。 就是在語言解釋執行的過程中，針對不同的文法（function、with語句等）開辟一個存儲區域，該區域就是一個作用域，該區域裡的資料能否被其它記憶體區域通路，需要按照一定的規則來（javascript文法規則）。

javascript中哪些文法會開辟一個新作用域？

1. 函數(function)

2. with語句

3. try …. catch語句

javascript中作用域鍊是什麼？

    了解代碼運作原理的朋友可能知道，代碼的執行，首先會在一個被稱作“運作環境”的區域的裡執行（這環境其實就是個棧），一旦碰見開辟新作用域的文法時，就會在目前環境下又開辟一個“運作環境”（新開辟一個作用域）。當然，目前的“運作環境”是不能通路新建立“運作環境”裡的資料，但是新”運作環境“卻可以通路目前“運作環境”, 這就相當于 新”運作環境”作用域可以鍊到目前“運作環境”作用域，進而形成一個類似“連結清單”的東西。

關于this

    關于this，建議大家一定要好好掌握，多從網絡上找相關資料，學習了解，形成自己的知識體系。下面分享一下本人學習總結和了解：

1. 和java程式設計語言一樣， 每個”運作環境”中都有一個this，this可了解成一個對象。

2. 和java不一樣的是，java中this是“固定”的，this指的就是目前方法所在的宿主對象，不可改變。而javascript中的this有點不一樣，javascript中某個“運作環境”的this可以是任何對象，我們完全可以通過call、applay方法來改變它。當然也可以通過bind方法來生成一個已經指定了this的函數, 指定了this的函數不能通過call或apply來重新設定它的this值。

具體可參照下面代碼加深了解：

obj1 = {name:"obj1"} 
obj2 = {name:"obj2"}
name = "global";

function fn() {
 console.log(this.name);
}

fn(); // global 全局this 根據ES實作各不相同 浏覽器下是window node下是空對象
fn.apply(obj1); //obj1
fn.apply(obj2); // obj2

var fbn = fn.bind(obj2); //生成一個指定了this的函數
fbn(); //obj2 this是obj2
fbn.apply(obj1); //obj2 apply不能改變已經綁定了this的this值
           

參考文章

了解javascript作用域和作用域鍊

詳解this

javascript中this對象詳解