Javascript效能優化(二) 資料訪問優化

2021-08-07 05:26:43 字數 1425 閱讀 1988

資料的儲存位置,關係到**執行時資料被檢索到的速度,js中有四種資料儲存位置:直接量、變數、陣列、物件。其中直接量可能比較少聽說,其實可以理解為表示匿名函式、匿名物件的乙個變數,如var sum = function(a,b),sum就是乙個函式直接量。

四種資料儲存位置中,直接量和區域性變數的訪問效能微不足道,效能消耗高的是全域性變數、陣列和物件成員。

每乙個js函式都是乙個物件,函式物件和其他物件一樣,擁有程式設計可以訪問的屬性和僅供js引擎使用的屬性。其中有乙個虛擬屬性叫做[[scope]],[[scope]]中包含函式作用域中物件的集合(作用域鏈),它表示當前函式環境可以訪問的資料,以鏈式存在,作用域鏈的建立改變過程如下:

1.宣告乙個函式時函式作用域鏈中被推入乙個可變的全域性變數,代表了所有全域性範圍內的變數。作用域鏈:a

2.執行乙個函式時會建立乙個內部物件(執行完銷毀),稱其為執行期上下文,執行期上下文會拷貝函式本身的[[scope]]物件,按照原來的順序複製到執行期上下文的作用域鏈中,此時的執行期上下文作用域鏈:a。然後執行期上下文的作用域鏈中被推入乙個新的物件,名叫『啟用物件』,它儲存了所有的區域性變數、命名引數、引數集合和this的介面。此時執行期上下文作用域鏈:b -> a

3.當函式執行遇到變數時,會檢索作用域鏈,首先會去b中查詢是否存在,再去a中查詢,顯然a中變數訪問效能要比b中的更慢。

function

fun()

// 當使用with時,document臨時被放到了作用域鏈的最前端

// 在使用getelemntbyid時會先到document物件裡面尋找

function

fun()

}

try

catch(e)

// cat._proto_ = object

var cat =

function

animal

(name,age)

// 通過prototype可以向函式物件新增成員

animal.prototype.sayhello = function

()var cat = new animal("cat",1);

var dog = new animal("dog",1);

由原型鏈的訪問過程可知,當訪問的物件成員處在較深處時,訪問的代價還是挺大的,所以當多次訪問同乙個物件成員時,可以進行快取。

function

foo(ele,classname1,classname2)

JavaScript效能優化

盡量使用區域性變數 減少全域性變數的使用 可以縮小查詢的作用域鏈。使用變數和陣列要比訪問物件上的屬性更有效率。對於多重屬性查詢,將多次使用的屬性查詢儲存在區域性變數中。前 window.location.href.substring window.location.href.indexof 後 va...

JavaScript效能優化 資料訪問

乙個function的作用域模型,一般分為活動物件 區域性變數什麼的 全域性物件 window物件,document 訪問順序是先變數活動物件,後查詢全域性物件。function initui document可以用區域性變數儲存 var doc document var bd doc.body v...

效能優化 二 優化方法

1.優化思路 1 公升級伺服器的硬體,換成更快 更大的機器。2 增加伺服器的數量。3 對系統和應用程式進行仔細的調優,以提高響應時間 吞吐量和資源利用率的效能指標。2.優化方法 1 每次改變乙個系統引數或者乙個應用邏輯。2 使用固定的負載 比如保持相同的併發使用者數 3 測試另乙個設定之前收集本次效...