《高效能javascript》讀書筆記-第二章 資料存取

hellocherry發表於2019-02-16

javascript中有四種基本的資料存取位置:字面量、變數、陣列元素、物件成員。

1.訪問字面量和區域性變數的速度最快,訪問陣列元素和物件成員相對較慢。

2.變數在作用域鏈中的位置越深,訪問所需時間越長。

-區域性變數位於作用域鏈的起始位置,因此訪問速度最快;

-全域性變數位於作用域鏈的最末端,因此訪問速度最慢。

3.with語句和try-catch中的catch子句可以改變執行環境的作用域鏈,有時會增加訪問代價,應小心使用。

-with(A)會建立一個變數物件推入作用域鏈的首位,這個變數物件擁有A物件的所有屬性

function initUI(){
    width(document){//雖然避免了多次書寫document,但是其他區域性變數(如i)處於作用域鏈的第二個物件中
      let bd = body,
        links = getElementsByTagName(`a`),
        i=0,
        len = links.length
    //其他程式碼
  }
}

-catch()子句會把異常物件推入作用域鏈的首位,catch程式碼塊內部訪問的所有區域性變數會被放到作用域鏈的第二個物件中。

4.巢狀的物件成員會明顯影響效能,儘量少用。

如執行時間:location.href < window.location.href < window.location.href.toString()

5.就物件及物件原型來說,屬性或方法在原型鏈中的位置越深,訪問它的速度越慢。

如訪問時間:例項屬性 < 第一層原型屬性 < 第二層原型屬性

6.在同一個函式中沒必要多次讀取同一個物件成員,建議第一次查詢到值後就將其儲存在區域性變數中。

//bad
if(objecA.attr === 1 || objecA.attr === 2 || objecA.attr === 3){}
//good
const { attr } = objecA
if(attr === 1 || attr === 2 || attr === 3){}

相關文章