JavaScript中是否有indexOf函数可以使用自定义比较函数在数组中搜索?

31

我需要得到数组中符合自定义比较函数的第一个值的索引。

非常好用的underscorejs库有一个“find”函数可以返回满足条件的第一个值,但我需要的是返回它的索引。是否有一种可用的indexOf版本,可以传递一个用于比较的函数?

感谢任何建议!


1
我认为你的整体方法在这里是错误的。你不想要修改默认功能(重载===),而是想要你自己的功能(例如:myIndexOf)。前者比后者更具破坏性和危险性。 - Christian
2
lodash有它 http://lodash.com/docs#findIndex - Drew LeSueur
2
如果您的目标环境支持ES2015(或者您使用转译步骤,例如Babel),则可以使用本机Array.prototype.findIndex()方法。 - craigmichaelmartin
8个回答

29
这里介绍了Underscore的做法 - 它通过增强核心Underscore函数来接受一个迭代器函数:
// save a reference to the core implementation
var indexOfValue = _.indexOf;

// using .mixin allows both wrapped and unwrapped calls:
// _(array).indexOf(...) and _.indexOf(array, ...)
_.mixin({

    // return the index of the first array element passing a test
    indexOf: function(array, test) {
        // delegate to standard indexOf if the test isn't a function
        if (!_.isFunction(test)) return indexOfValue(array, test);
        // otherwise, look for the index
        for (var x = 0; x < array.length; x++) {
            if (test(array[x])) return x;
        }
        // not found, return fail value
        return -1;
    }

});

_.indexOf([1,2,3], 3); // 2
_.indexOf([1,2,3], function(el) { return el > 2; } ); // 2

1
下划线是过度设计。你可能想要将整个内容包装在IIFE中:你刚刚引入了对全局变量的依赖。此外,如果你的代码中有一个错误,你就会污染所有使用 _.indexOf 的代码。 - 1983
4
@ mintsauce - OP提到了Underscore,这就是为什么我提供了一个基于Underscore的解决方案。关于全局引用,这只是一个片段,而不是一个即插即用的模块;用户需要包装它或以适合他们应用程序的方式设置它。至于错误-没错,这就是为什么我更喜欢编写无bug代码的原因 :)。 - nrabinowitz
4
注意:自原帖和答案发布以来,underscore.js已添加了findIndex函数。 - Ben

15

ECMAScript 2015中有一个标准函数,用于Array.prototype.findIndex()。目前在除了Internet Explorer之外的所有主要浏览器中都已实现。

以下是一个兼容性补丁,由Mozilla Developer Network提供:

// https://tc39.github.io/ecma262/#sec-array.prototype.findIndex
if (!Array.prototype.findIndex) {
  Object.defineProperty(Array.prototype, 'findIndex', {
    value: function(predicate) {
     // 1. Let O be ? ToObject(this value).
      if (this == null) {
        throw new TypeError('"this" is null or not defined');
      }

      var o = Object(this);

      // 2. Let len be ? ToLength(? Get(O, "length")).
      var len = o.length >>> 0;

      // 3. If IsCallable(predicate) is false, throw a TypeError exception.
      if (typeof predicate !== 'function') {
        throw new TypeError('predicate must be a function');
      }

      // 4. If thisArg was supplied, let T be thisArg; else let T be undefined.
      var thisArg = arguments[1];

      // 5. Let k be 0.
      var k = 0;

      // 6. Repeat, while k < len
      while (k < len) {
        // a. Let Pk be ! ToString(k).
        // b. Let kValue be ? Get(O, Pk).
        // c. Let testResult be ToBoolean(? Call(predicate, T, « kValue, k, O »)).
        // d. If testResult is true, return k.
        var kValue = o[k];
        if (predicate.call(thisArg, kValue, k, o)) {
          return k;
        }
        // e. Increase k by 1.
        k++;
      }

      // 7. Return -1.
      return -1;
    },
    configurable: true,
    writable: true
  });
}

findIndex实际上已经在EcmaScript 2015标准中得到了确认,详情请参见@Husky提供的链接。 - Peter T.
下划线库还有一个findIndex()函数,以防浏览器不支持它。 - Peter T.

7
你可以这样做:
Array.prototype.myIndexOf = function(f)
{
    for(var i=0; i<this.length; ++i)
    {
        if( f(this[i]) )
            return i;
    }
    return -1;
};

关于Christian的评论:如果您用具有相同签名但不同功能的自定义方法覆盖标准JavaScript方法,可能会发生糟糕的事情。尤其是在您调用第三方库时,这些库可能依赖于原始的Array.proto.indexOf。所以,是的,您可能希望将其命名为其他内容。


2
谢谢关心。我也相信第二次机会。;) 请强调一下为什么Array.prototype.indexOf(function)是错误的方法,我会给你点赞的。 - Christian
谢谢这个。我可以使用它而不必将其添加到Array.prototype中。 - Peter T.
最好不要添加到Array.prototype,除非您为标准中存在但特定实现不支持的函数提供了一个shim。 - 1983

3

正如其他人所指出的那样,你可以自己制作一个简短而简单的程序来满足你特定的使用需求。

// Find the index of the first element in array
// meeting specified condition.
//
var findIndex = function(arr, cond) {
  var i, x;
  for (i in arr) {
    x = arr[i];
    if (cond(x)) return parseInt(i);
  }
};

var moreThanTwo = function(x) { return x > 2 }
var i = findIndex([1, 2, 3, 4], moreThanTwo)

如果你是使用CoffeeScript的开发者:

findIndex = (arr, cond) ->
  for i, x of arr
    return parseInt(i) if cond(x)

1

这是 nrabinowitz 的 code 的 Coffeescript 版本。

# save a reference to the core implementation
indexOfValue = _.indexOf

# using .mixin allows both wrapped and unwrapped calls:
# _(array).indexOf(...) and _.indexOf(array, ...)
_.mixin ({
    # return the index of the first array element passing a test
    indexOf: (array, test) ->
        # delegate to standard indexOf if the test isn't a function
        if (!_.isFunction(test))
            return indexOfValue(array, test)
        # otherwise, look for the index
        for item, i in array
            return i if (test(item))
        # not found, return fail value
        return -1
})

1
JavaScript 数组方法 filter 返回从传递的函数返回 true 的数组子集。
var arr= [1, 2, 3, 4, 5, 6],
first= arr.filter(function(itm){
    return itm>3;
})[0];
alert(first);

if you must support IE before #9 you can 'shim' Array.prototype.filter-

Array.prototype.filter= Array.prototype.filter || function(fun, scope){
    var T= this, A= [], i= 0, itm, L= T.length;
    if(typeof fun== 'function'){
        while(i<L){
            if(i in T){
                itm= T[i];
                if(fun.call(scope, itm, i, T)) A[A.length]= itm;
            }
            ++i;
        }
    }
    return A;
}

谢谢,构建一个新的子集数组可能会减慢性能 - 你认为呢? - Peter T.
我认为这是最简单、最优雅的答案。不需要定义任何新方法、底线或者补丁之类的东西。我说的只是简单,而不是性能。 - Lane Rettig

1
这样的查找功能怎么样?
(function () {
  if (!Array.prototype._find) {
    Array.prototype._find = function (value) {
      var i = -1, j = this.length;
      if (typeof(value)=="function") 
         for(; (++i < j) && !value(this[i]););
      else
         for(; (++i < j) && !(this[i] === value););

      return i!=j ? i : -1;
    }
  }
}());

0

使用下划线,我从他们的find实现中复制了一些内容,使用了_.any:

findIndex = function (obj, iterator, context) {
    var idx;
    _.any(obj, function (value, index, list) {
        if (iterator.call(context, value, index, list)) {
            idx = index;
            return true;
        }
    });
    return idx;
};

你认为怎么样 - 你有更好的解决方案吗?

我不知道_.any是什么意思。我猜你正在使用某个框架?如果是这样,请友好地告诉我们你的秘密 ;)。 - Christian
1
你不应该在 any 函数中使用额外的函数,这会减慢方法的速度。只需使用简单的 for 循环即可。 - Bergi

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接