卡卡网

这几天写了几个前端程序，在写的时候，是用Chrome浏览器来调试的，在Chrome、Firefox等主流浏览器里测试都无问题，但是，今天用IE打开时发现报错！

经过检查发现，在IE里根本认不了reduce()、startsWith()等函数。我用的IE版本是IE11。

reduce函数为数组求和、求平均值带来了极大的方便，一行代码就搞定了。普通方式要通过对数组元素遍历，再求和求均值，略有麻烦。比如下面这个示例：

var data = [5,1,6,8,3];
var sum = data.reduce((a, b) => a + b);  //23 
var avg = data.reduce((a, b) => a + b)/data.length;  //4.6

而startsWith函数在检索字符串上也提供了很大的便捷，比indexOf函数好用很多。比如下面这个示例：

var data = "卡卡测速网 www.webkaka.com";
console.log(data.startsWith("卡卡测速网"));  //true

通过这次经历，发现IE浏览器确实落后，它不但渲染网页速度慢，还不支持很多先进的语法，包括JS语法和CSS语法。

所以现在很多设计师都不再考虑IE用户了，毕竟IE的使用人数现在几乎是可以忽略的了。为了照顾少量的IE用户，可能设计师要花很多时间去编写兼容IE浏览器的程序，这在某些情况下是得不赏识。

除了上面提到的reduce、startsWith函数外，还有不少函数在IE里是运行不了的，下面给大家提供一些。

IE10 及以下版本不支持

// ============  new WeakMap()  ===============//  
// 在IE10 及以下版本显示  undefined
alert(window.WeakMap);

IE9 及以下版本不支持

// ============  new ArrayBuffer()  ===============//  
// 在IE9 及以下版本显示  undefined
alert(window.ArrayBuffer);

IE8 及以下版本不支持

// ============   trim()  ===============//
String.prototype.trim = String.prototype.trim || function(){  
    return this.replace(/(^\s*)(\s*$)/g, "");  
}; 
/*------------------ 例子 ---------------*/
var s = "          删除首尾空格          ";
alert(s.trim()); // “删除首尾空格”

// ============   isArray()  ===============//
window.isArray = window.isArray || function isArray(value){  
    return Object.prototype.toString.call(value) == "[object Array]";  
}
/*------------------ 例子 ---------------*/
var arr = [1,2,3,4,5];  
alert(isArray(arr)); // true

// ============   Date.now()  ===============//
Date.now = Date.now || function(){  
    return new Date().valueOf();  
}
/*------------------ 例子 ---------------*/
alert(Date.now()); 

// ============   indexOf  ===============//
Array.prototype.indexOf = Array.prototype.indexOf || function (searchElement, fromIndex) {
    if (this == null) {
        throw new TypeError('“this” 为 null 或者未定义');
    }
    var O = Object(this);
    var len = O.length >>> 0;
    if (len === 0) return -1;
    var n = +fromIndex || 0;
    if (Math.abs(n) === Infinity) n = 0;
    if (n >= len) return -1;
    var k = Math.max(n >= 0 ? n : len - Math.abs(n), 0);
    while (k < len) {
        if (k in O && O[k] === searchElement) return k;
        k++;
    }
    return -1;
};
/*------------------ 例子 ---------------*/
var arr = ["神梦无痕", "SMWH", "qq1042207232"];  
alert(arr.indexOf("SMWH")); // 1

// ============   filter  ===============//
// 数组的一些方法  every(), filter(), forEach(), map(), some() 
Array.prototype.filter = Array.prototype.filter || function(fun /*, thisp*/){  
    var len = this.length;
    if (typeof fun != "function"){
        throw new TypeError();
    }
    var res = new Array();
    var thisp = arguments[1];
    for (var i = 0; i < len; i++){
        if (i in this){
            var val = this[i]; // in case fun mutates this
            if (fun.call(thisp, val, i, this)) {
                res.push(val);
            }
        }
    }
    return res;
};
/*------------------ 例子 ---------------*/
var arr = [1,2,3,4,5,6];  
var filterResult = arr.filter(function(item, inde, array){  
    return (item>2);  
});  
alert(filterResult); // [3,4,5,6]

// ============   every  ===============//
Array.prototype.every = Array.prototype.every || function(fun){
    for(var i=0;i<this.length;i++){
        if(this[i]!==undefined){
            var r=fun(this[i],i,this);
            if(r==false){
                return false;
            }
        }
    }
    return true;
}
/*------------------ 例子 ---------------*/
var arr = [1,2,3,4,5,6];  
var everyResult = arr.every(function(item, inde, array){  
    return (item>2);  
});  
alert(everyResult); // false 

// ============   some  ===============//
Array.prototype.some = Array.prototype.some || function(fun){
    for(var i=0;i<this.length;i++){
        if(this[i]!==unefined){
            var r=fun(this[i],i,this);
            if(r==true){ return true; }
        }
    }
    return false;
}
/*------------------ 例子 ---------------*/
var arr = [1,2,3,4,5,6];  
var someResult = arr.some(function(item, inde, array){  
    return (item>2);  
});  
alert(someResult); // true

// ============   map  ===============//
Array.prototype.map = Array.prototype.map || function(fun){
    var newArr=[];
    for(var i=0;i<this.length;i++){
        if(this[i]!==undefined){
            var r=fun(this[i],i,this);
            newArr[i]=r;
        }
    }
    return newArr;
}
/*------------------ 例子 ---------------*/
var arr = [1,2,3,4,5,6];  
var mapResult = arr.map(function(item, inde, array){  
    return item * 2;  
});  
alert(mapResult); // [2, 4, 6, 8, 10, 12]

// ============   reduce  ===============//
Array.prototype.reduce = Array.prototype.reduce || function(fun,base){
    base===undefined&&(base=0);
    for(var i=0;i<this.length;i++){
        if(this[i]!==undefined){
            base=fun(base,this[i],i,this);
        }
    }
    return base;
}
/*------------------ 例子 ---------------*/
var arr = [1,2,3,4,5,6];  
var reduceResult = arr.reduce(function(total, item, inde, array){  
    return total + item;
}, 0);
alert(reduceResult); // 21

// ============   bind  ===============//
Function.prototype.bind = Function.prototype.bind || function (otherThis) {
    if (typeof this !== 'function') {
        throw new TypeError('Function.prototype.bind - 绑定的不是函数体');
    }
    var baseArgs = Array.prototype.slice.call(arguments, 1),
        baseArgsLength = baseArgs.length,
        fToBind = this,
        fNOP = function () {},
        fBound = function () {
            baseArgs.length = baseArgsLength;
            baseArgs.push.apply(baseArgs, arguments);
            return fToBind.apply(
                fNOP.prototype.isPrototypeOf(this) ? this : otherThis, baseArgs
            );
        };
    if (this.prototype) {
        fNOP.prototype = this.prototype;
    }
    fBound.prototype = new fNOP();
    return fBound;
};
/*------------------ 例子 ---------------*/
this.x = 9;    //在浏览器中，this 指向全局的 "window" 对象
var module = {
  x: 81,
  getX: function() { return this.x; }
};
alert(module.getX()); // 81

var retrieveX = module.getX;
alert(retrieveX());  // 返回 9 - 因为函数是在全局作用域中调用的

// 创建一个新函数，把 'this' 绑定到 module 对象
// 新手可能会将全局变量 x 与 module 的属性 x 混淆
var boundGetX = retrieveX.bind(module);
alert(boundGetX()); // 81

IE7 及以下版本不支持

// ============   String[0]  ===============//  
// 在IE7 及以下版本显示  undefined
alert("#"[0]);

您可能对以下文章也感兴趣

• jQuery $('document').on() 比 $('body').on() 速度快
• JS中文简繁体转换【演示-源码下载】
• jQuery find("#id")与find(".class")实例分析与比较
• JQuery计算HTML元素子元素(child elements)
• $.ajax() data{} 传参三种常见写法及ajax()方法参数详解
• 表单序列化插件serializeJSON.js下载及使用示例

• JQuery如何把JSON字符串转为JSON对象
• 使用HTML5和JQuery读取CSV(Text)文件的实例
• HTML5和JQuery裁剪图像实时预览缩略图并上传
• HTML5和JQuery实现多图片上传预览
• 使用HTML5和JQuery获得上传图片大小尺寸（高和宽）
• 使用jQuery setInterval函数延迟5秒后跳转到另一个页面

标签: reduce函数  startsWith函数