資訊專欄INFORMATION COLUMN
摘要：數(shù)組的原型上有一個(gè)方法叫做給不同的參數(shù)組合會(huì)返回不同的結(jié)果，由于組合非常多，這里研究一下不同組合的結(jié)果并基于原型鏈對(duì)該方法進(jìn)行仿寫考慮情況為負(fù)數(shù)，為負(fù)數(shù)，超出有效長(zhǎng)度了，非有效數(shù)字源碼如下不想看源碼的請(qǐng)直接看最下面的結(jié)果處理沒有參數(shù)的情況處
數(shù)組的原型上有一個(gè)方法叫做slice,給不同的參數(shù)組合會(huì)返回不同的結(jié)果，由于組合非常多，這里研究一下不同組合的結(jié)果并基于原型鏈對(duì)該方法進(jìn)行仿寫
考慮情況：
slice(a,b) slice(a) slice(undefined,b) slice()
a
源碼如下： 不想看源碼的請(qǐng)直接看最下面的結(jié)果...
Array.prototype.mySlice = function (a, b) {
var newArr = [];
//處理沒有參數(shù)的情況
if (a === undefined && b === undefined) {
return this
}
//處理只有一個(gè)參數(shù)，或者是第二個(gè)參數(shù)大于數(shù)組長(zhǎng)度的情況
if (b === undefined || b > this.length) {
b = this.length
}
if (a === undefined) {
a = 0
}
//處理參數(shù)不是數(shù)字的情況(上面代碼已經(jīng)將undefined參數(shù)轉(zhuǎn)化為非undefined參數(shù)并且保證參數(shù)為兩個(gè)了)
if (typeof a !== "number" || typeof b !== "number" ) {
console.log("參數(shù)必須是數(shù)字")
}
//處理第一個(gè)參數(shù)為負(fù)數(shù)以及第一個(gè)參數(shù)大與第二個(gè)參數(shù)以及第二個(gè)參數(shù)是負(fù)數(shù)的情況的情況
if (b < 0) {
b = this.length + b
}
if (a < 0) {
a = this.length + a
}
//先將a,b恢復(fù)成正數(shù)再比較
if (a >= b || b === 0) {
return []
}
//正常 slice(a,b)
for (var i = a; i < b; i++) {
newArr.push(this[i])
}
return newArr
}
考慮到驗(yàn)證正確性,增加一個(gè)驗(yàn)證函數(shù)
function check(testArr, n, m) {
console.log(`[${testArr}].slice(${n},${m})--->[${testArr.slice(n, m)}]`, testArr.slice(n, m).toString() === testArr.mySlice(n, m).toString());
}
check([1, 2, 3, 4, 5], 1, 3);
check([1, 2, 3, 4, 5], 1);
check([1, 2, 3, 4, 5], undefined, 3);
check([1, 2, 3, 4, 5], 1, 7);
check([1, 2, 3, 4, 5]);
check([1, 2, 3, 4, 5], -1, 3);
check([1, 2, 3, 4, 5], -3, 3);
check([1, 2, 3, 4, 5], 1, 0);
check([1, 2, 3, 4, 5], 1, -1);
check([1, 2, 3, 4, 5], 1, -2);
check([1, 2, 3, 4, 5], 1, -3);
check([1, 2, 3, 4, 5], 3, 1);
結(jié)果如下：
比較常見的應(yīng)用：
數(shù)組的復(fù)制
arr.slice()
類數(shù)組轉(zhuǎn)化為數(shù)組（dom類數(shù)組不兼容IE6，7，可以用ES6中arr.from()替換）
Array.prototype.slice(類數(shù)組)
子數(shù)組的獲取
3.1 正常的自數(shù)組獲取
