技術(shù)頻道導(dǎo)航
HTML/CSS
.NET技術(shù)
IIS技術(shù)
PHP技術(shù)
Js/JQuery
Photoshop
Fireworks
服務(wù)器技術(shù)
操作系統(tǒng)
網(wǎng)站運營

贊助商

分類目錄

贊助商

最新文章

搜索

js reduce、startsWith等函數(shù)在IE里無效

作者:admin    時間:2022-4-21 22:43:53    瀏覽:

這幾天寫了幾個前端程序,在寫的時候,是用Chrome瀏覽器來調(diào)試的,在Chrome、Firefox等主流瀏覽器里測試都無問題,但是,今天用IE打開時發(fā)現(xiàn)報錯!

經(jīng)過檢查發(fā)現(xiàn),在IE里根本認不了reduce()、startsWith()等函數(shù)。我用的IE版本是IE11。

 js reduce、startsWith等函數(shù)在IE里無效

reduce函數(shù)為數(shù)組求和、求平均值帶來了極大的方便,一行代碼就搞定了。普通方式要通過對數(shù)組元素遍歷,再求和求均值,略有麻煩。比如下面這個示例:

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函數(shù)在檢索字符串上也提供了很大的便捷,比indexOf函數(shù)好用很多。比如下面這個示例:

var data = "卡卡測速網(wǎng) www.howtostagehomes.com";
console.log(data.startsWith("卡卡測速網(wǎng)"));  //true

通過這次經(jīng)歷,發(fā)現(xiàn)IE瀏覽器確實落后,它不但渲染網(wǎng)頁速度慢,還不支持很多先進的語法,包括JS語法和CSS語法。

所以現(xiàn)在很多設(shè)計師都不再考慮IE用戶了,畢竟IE的使用人數(shù)現(xiàn)在幾乎是可以忽略的了。為了照顧少量的IE用戶,可能設(shè)計師要花很多時間去編寫兼容IE瀏覽器的程序,這在某些情況下是得不賞識。

除了上面提到的reducestartsWith函數(shù)外,還有不少函數(shù)在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  ===============//
// 數(shù)組的一些方法  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 - 綁定的不是函數(shù)體');
    }
    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 - 因為函數(shù)是在全局作用域中調(diào)用的

// 創(chuàng)建一個新函數(shù),把 'this' 綁定到 module 對象
// 新手可能會將全局變量 x 與 module 的屬性 x 混淆
var boundGetX = retrieveX.bind(module);
alert(boundGetX()); // 81

IE7 及以下版本不支持

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

您可能對以下文章也感興趣

相關(guān)文章
    x
    • 站長推薦
    /* 左側(cè)顯示文章內(nèi)容目錄 */