前幾天去一家公司面試遇到個這樣的問題,兼容IE7下的Array.map方法,一臉蒙蔽。后面回來查了下資料發現。Array.map方法是ECMA-262 標准中新添加的方法,在低版本的JS中是木有的。
看如下兼容性實現方式:
實現思路:
1,先驗證this對象,再將this用Object封裝成obj。
2,獲取封裝后的obj的屬性長度
3,驗證是否有回調方法
4,根據obj的屬性長度lengh生成新的數組,new Array(length)。
5,遍歷obj對象,獲取mapKey,mapValue,並將返回值添加到新數組arr中。
6,將整個新的數組返回。
代碼實現:
(function(){
if(!Array.prototype.map) {
Array.prototype.map = function(callback, args) {
var arg , arr, index ;
if(this == null) {
throw new TypeError('this is null or not defined');
}
var obj = new Object(this);
var len = obj >>> 0; //獲取obj的長度
if(Object.prototype.toString.call(callback) != '[object Function]') {
throw new TypeError(callback + 'is not a function');
}
if(args) {
arg = args;
}
// 創建新數組,長度為原數組O長度len
arr = new Array(len);
index = 0;
while(index < len) {
var kValue, mappedValue;
if(index in obj) {
//kValue為索引k對應的值.
kValue = obj[index];
// 執行callback,this指向arr,參數有三個.分別是kValue:值,index:索引,obj:原數組.
mappedValue = callback.call(arg, kValue, index, obj);
// 返回值添加到新數組arr中.
arr[index] = mappedValue;
}
index ++;
}
return arr;
}
}
})()
上面代碼既是Array.map方法的原生實現。