兼容低版本JS的Array.map方法

前几天去一家公司面试遇到个这样的问题,兼容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方法的原生实现。

posted @ 2017-09-06 11:31  nokelong  阅读(3365)  评论(0编辑  收藏  举报