局部變量也就可以理解為在函數(shù)內(nèi)部定義的變量，很明顯訪問局部變量要比域外的變量要快，因為它位于作用域鏈的第一個變量對象中(關(guān)于作用域鏈的介紹可以閱讀這篇文章)。變量在作用域鏈的位置越深，訪問所需要的時間就越長，全局變量總是最慢的，因為它們位于作用域鏈的最后一個變量對象。

每種數(shù)據(jù)類型的訪問都需要付出點性能代價，對于直接量和局部變量基本都能消費得起，而訪問數(shù)組項和對象成員則要代價高點。下圖顯示了不同瀏覽器，分別對這四種數(shù)據(jù)類型進行了200'000次操作所用的時間。

由上圖可以看出，要想優(yōu)化代碼的性能，那么盡量使用直接量和局部變量，限制數(shù)組項和對象成員的訪問次數(shù)(將對象成員用一個局部變量來保存)。

首先我們需要了解一下對象成員的訪問過程。其實函數(shù)就是一個特殊的對象，所以對象成員的訪問跟函數(shù)的內(nèi)部變量的訪問都差不多，都是基于鏈的查找，前者是原型鏈，后者是作用域鏈，只是怎么個鏈法有點差別而已。

對象成員包含屬性和方法，如果該成員是一個函數(shù)就稱為方法，否則就稱為屬性。
JavaScript中的對象是基于原形(原形本身就是一個對象)的，原形是其他對象的基礎(chǔ)。當你實例化一個Object對象或其它JS的內(nèi)置對象時(var obj=new Object() or var obj={})，實例obj的原形由后臺自動創(chuàng)建，瀏覽器FF，safari，Chrome可通過obj.__proto__屬性(等同于 Object.prototype)可以訪問到這個原形，也正是因為這個原形，每一個實例都能共享原形對象的成員。如：

此代碼中，book對象有兩個私有成員，分別是屬性name和方法getName。book對象并沒有定義成員toString，但調(diào)用了也沒有拋出錯誤，原因是book對象繼承了原形對象的成員。book對象與原形的關(guān)系如下：

訪問book對象成員toString的過程是這樣的，當book.toString()被調(diào)用時，后臺對成員進行名為”toString”的搜 索，首先從實例book本身開始，如果在book發(fā)現(xiàn)名為”toString”的成員，則搜索結(jié)束，否則繼續(xù)向__proto__指向的原型對象搜索，如 果在Object的原形對象都找不到該成員，則表示該成員未定義。通過這種方式，book就可以訪問它的原型對象所擁有的每個屬性或方法。

對象的另一高級用法就是模擬類和繼承類，我喜歡叫這樣用法的對象為對象類。繼承對象類主要就是依靠原型鏈來完成的，這個知識點太多需要另外詳細 說明。通過上面的對象成員搜索過程，訪問對象成員的速度，隨著原型鏈的越深，搜索的速度就越慢。下圖就顯示了對象成員在原型鏈中所處的深度與訪問時間的關(guān) 系：

由上圖可清楚的知道，每深入原型鏈一層都會增加性能的損失，所以像那種遍歷對象成員的操作開銷很大。還有另外一種常用且損耗性能的做法就是嵌套對象 成員(如window.location.href)，像這種最好的做法就是減少點的次數(shù)了。比如location.href就比 window.location.href快。

好了,總結(jié)起來就一句話：一個屬性或方法在原型鏈的位置越深，訪問它的速度就越慢。解決辦法就是：將經(jīng)常使用的對象成員，數(shù)組項和域外的變量存入局部變量中，然后訪問這個局部變量。

最新評論