2013/12/6

閱讀 jquery 原始碼的筆記 - Array.slice 的妙用

在 jquery v1.10.2 裡面的第 232行寫到 :

toArray: function() {
return core_slice.call( this );
}

他的功能是把 jquery 物件從物件 {} 轉換成陣列 []
在這裡的 this 是個 jquery 物件
而 core_slice 是宣告在第 55 行 :

core_deletedIds = [],
core_slice = core_deletedIds.slice,

以上來自第48行和第55行
我們知道他宣告了一個變數  core_slice 把陣列的 slice 函數拿來用
 slice 能作什麼事呢?

這裡我們知道執行

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(1,3);

會得到

citrus = ["Orange","Lemon"];

的結果

根據測試我發現 core_slice.call(A) 的運作模式是先判斷 A 有無 length 屬性
如果有就 new 一個新的陣列 然後把對應的元素丟進新的陣列裡,如果沒有傳入參數的話就是全丟進去
嘗試實作看看 :

function slice(A, start, end) {
    var output = [];
    if (start == undefined) start = 0;
    if (end == undefined) end = A.length;
    if (start < 0) start = A.length + start;
    if (end < 0) end = A.length + end;
    for (var i = start; i < end; i++) {
        output.push(A[i]);
    }
    return output;

}

試用起來跟內建的一樣
可以測試以下程式碼

var o = {};
o.length = 5;
o[0] = 1;
slice(o);
[].slice.call(o);

沒有留言: