在Internet Explorer中修复JavaScript数组函数(indexOf,forEach等)


137

至于详细的其他地方,否则显然是众所周知的,IE浏览器(版本绝对7,并在某些情况下,版本8)不落实的关键功能,特别是Array(如forEachindexOf等)。

这里到处都有许多变通办法,但是我想将一组适当的规范的实现折叠到我们的网站中,而不是复制粘贴或修改我们自己的实现。我发现js-methods看起来很有前途,但是我想在这里发表文章,看看是否有另一个高度推荐的库。几个其他标准:

  • 对于那些浏览器已经具有实现功能的功能,该库应该是js-methods无能为力的(在这里看起来做得很好)。
  • 请使用非GPL,尽管LGPL是可以接受的。

Answers:


220

许多人使用MDC后备实现(例如,用于indexOf)。它们通常严格地符合标准,甚至达到显式检查所有参数类型的程度。

不幸的是,尽管很明显作者认为该代码是微不足道且可自由使用的,但似乎并没有明确的许可将其写为书面形式。如果这是可接受的许可证,则整个Wiki都是CC Attribution-ShareAlike(尽管CC并非针对此类代码而设计)。

js方法总体上看起来还可以,但是在功能应该是怎样的边缘(例如,未定义的列表项,使列表发生变化的函数)的边缘并不符合标准。它还充满了其他随机的非标准方法,包括一些可疑的方法,例如狡猾的stripTags和不完整的UTF-8编解码器(考虑到unescape(encodeURIComponent)技巧,这也是不必要的)。

物有所值,这就是我的用途(如果可以说完全具有版权,我特此将其发布到公共领域)。它比MDC版本短一点,因为它不尝试键入嗅探您没有做过诸如传递非函数回调或非整数索引之类的愚蠢操作,但除此之外,它还尝试符合标准。(让我知道我是否错过了任何事情。

'use strict';

// Add ECMA262-5 method binding if not supported natively
//
if (!('bind' in Function.prototype)) {
    Function.prototype.bind= function(owner) {
        var that= this;
        if (arguments.length<=1) {
            return function() {
                return that.apply(owner, arguments);
            };
        } else {
            var args= Array.prototype.slice.call(arguments, 1);
            return function() {
                return that.apply(owner, arguments.length===0? args : args.concat(Array.prototype.slice.call(arguments)));
            };
        }
    };
}

// Add ECMA262-5 string trim if not supported natively
//
if (!('trim' in String.prototype)) {
    String.prototype.trim= function() {
        return this.replace(/^\s+/, '').replace(/\s+$/, '');
    };
}

// Add ECMA262-5 Array methods if not supported natively
//
if (!('indexOf' in Array.prototype)) {
    Array.prototype.indexOf= function(find, i /*opt*/) {
        if (i===undefined) i= 0;
        if (i<0) i+= this.length;
        if (i<0) i= 0;
        for (var n= this.length; i<n; i++)
            if (i in this && this[i]===find)
                return i;
        return -1;
    };
}
if (!('lastIndexOf' in Array.prototype)) {
    Array.prototype.lastIndexOf= function(find, i /*opt*/) {
        if (i===undefined) i= this.length-1;
        if (i<0) i+= this.length;
        if (i>this.length-1) i= this.length-1;
        for (i++; i-->0;) /* i++ because from-argument is sadly inclusive */
            if (i in this && this[i]===find)
                return i;
        return -1;
    };
}
if (!('forEach' in Array.prototype)) {
    Array.prototype.forEach= function(action, that /*opt*/) {
        for (var i= 0, n= this.length; i<n; i++)
            if (i in this)
                action.call(that, this[i], i, this);
    };
}
if (!('map' in Array.prototype)) {
    Array.prototype.map= function(mapper, that /*opt*/) {
        var other= new Array(this.length);
        for (var i= 0, n= this.length; i<n; i++)
            if (i in this)
                other[i]= mapper.call(that, this[i], i, this);
        return other;
    };
}
if (!('filter' in Array.prototype)) {
    Array.prototype.filter= function(filter, that /*opt*/) {
        var other= [], v;
        for (var i=0, n= this.length; i<n; i++)
            if (i in this && filter.call(that, v= this[i], i, this))
                other.push(v);
        return other;
    };
}
if (!('every' in Array.prototype)) {
    Array.prototype.every= function(tester, that /*opt*/) {
        for (var i= 0, n= this.length; i<n; i++)
            if (i in this && !tester.call(that, this[i], i, this))
                return false;
        return true;
    };
}
if (!('some' in Array.prototype)) {
    Array.prototype.some= function(tester, that /*opt*/) {
        for (var i= 0, n= this.length; i<n; i++)
            if (i in this && tester.call(that, this[i], i, this))
                return true;
        return false;
    };
}

其他未在此处实现的ECMA262-5方法包括Array reduce/ reduceRight,JSON和一些Object可以可靠地实现为JS函数的新方法。


5
感谢您提供的指针-我在mozdev中看到的其他链接可能是过时的,这些链接我已经看到了。仅供参考,代码是MIT许可,如下规定:developer.mozilla.org/Project:Copyrights(约一样好,你可以得到:-)!
cemerick

1
有趣的是,如果我在jQuery 1.4.2之前引用了包含所有MDC ECMA262-5 imps的js文件,则jQuery被破坏了-例如,所有选择器均失败,返回null。在jquery导致预期的行为之后,移动MDC隐式启动。很奇怪。
cemerick

好奇!会看一下(您有一个测试用例吗?)...我无法立即想到为什么会发生这种情况,尽管jQuery在第72行所做的事情看起来很可疑。
bobince 2010年

4
注意:在大多数需要这些存根的浏览器中,如果执行“ for(在somearray中的索引){...}”,则需要使用somearray.hasOwnProperty(index)作为检查。IE <= 8的JS引擎将在其中包括array.prototype扩展。Google Adwords异步代码无法执行此操作。最好使用Underscore或以此为标准的其他库功能。
Tracker1 2012年

1
我可以找到这是IE 8最快的indexOf()实现。谢谢!
Alex Denysenko 2015年

27

看看Underscore.js


2
ES5Shim和其他存根(例如MDC的存根)也往往会产生其他后果。对于这些类型的函数,最好使用下划线或其他库,这些库将在可用时使用内部方法。
Tracker1 2012年

使用Underscore.js var arr = ['a','a1','b'] _.filter(arr,function(a){return a.indexOf('a')> -1;})
sri_bb

9

Kris Kowal已编译了一个小的库,充当ECMAScript 5功能的填充程序,该功能可能会在浏览器的实现中丢失。某些功能已被其他人多次修订,以优化速度并解决浏览器错误。编写功能时要尽可能遵循规范。

es5-shim.js是根据MIT许可证发布的,Array.prototype扩展名在顶部附近,您可以轻松地砍掉并删除所有不需要的功能。我还建议您缩小脚本的大小,因为注释使它变得比需要的大得多。


1

“不执行关键功能”实际上是指“符合ECMA 262第三版”,对吗?:)

您所引用的方法是新的第5版的一部分-对于不支持此功能的浏览器,您可以使用以下将“ 3”扩展到第5的“ shim” http://github.com/kriskowal/narwhal- lib / blob / narwhal-lib / lib / global-es5.js


1
这是一个好的开始,但是在实现过程中有很多错误并非来自MDC。例如。许多数组方法没有将足够的参数传递给它们的回调,并且在回调函数中发生数组突变的情况下行为不正确。
bobince 2010年

我将尽我所能使js成为更理智/功能最少的语言。</ snark> :-)
cemerick


0

使用Underscore.js

var arr=['a','a1','b'] _.filter(arr, function(a){ return a.indexOf('a') > -1; })

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.