path: root/files/zh-cn/web/javascript/reference/global_objects/array/indexof/index.html

---
title: Array.prototype.indexOf()
slug: Web/JavaScript/Reference/Global_Objects/Array/indexOf
tags:
  - JavaScript
  - polyfill
  - 原型
  - 参考
  - 数组
  - 方法
translation_of: Web/JavaScript/Reference/Global_Objects/Array/indexOf
---
<div>{{JSRef}}</div>

<p><code><strong>indexOf()</strong></code>方法返回在数组中可以找到一个给定元素的第一个索引，如果不存在，则返回-1。</p>

<div>{{EmbedInteractiveExample("pages/js/array-indexof.html")}}</div>

<div class="note">
<p>注意：对于String方法，请参阅 {{jsxref("String.prototype.indexOf()")}}。</p>
</div>

<h2 id="Syntax" name="Syntax">语法</h2>

<pre><var>arr</var>.indexOf(<var>searchElement</var>[, <var>fromIndex</var>])</pre>

<h3 id="参数">参数</h3>

<dl>
 <dt><code>searchElement</code></dt>
 <dd>要查找的元素</dd>
 <dt><code><var>fromIndex</var></code> {{optional_inline}}</dt>
 <dd>开始查找的位置。如果该索引值大于或等于数组长度，意味着不会在数组里查找，返回-1。如果参数中提供的索引值是一个负值，则将其作为数组末尾的一个抵消，即-1表示从最后一个元素开始查找，-2表示从倒数第二个元素开始查找 ，以此类推。 注意：如果参数中提供的索引值是一个负值，并不改变其查找顺序，查找顺序仍然是从前向后查询数组。如果抵消后的索引值仍小于0，则整个数组都将会被查询。其默认值为0.</dd>
</dl>

<h3 id="返回值">返回值</h3>

<p>首个被找到的元素在数组中的索引位置; 若没有找到则返回 -1</p>

<h2 id="描述">描述</h2>

<p><code>indexOf</code> 使用<a href="/zh-CN/docs/Web/JavaScript/Reference/Operators/Comparison_Operators#Using_the_Equality_Operators">strict equality</a> (无论是 ===, 还是 triple-equals操作符都基于同样的方法)进行判断 <code>searchElement与</code>数组中包含的元素之间的关系。</p>

<h2 id="示例">示例</h2>

<h3 id="使用indexOf">使用indexOf</h3>

<p>以下例子使用<code>indexOf方法确定多个值在数组中的位置。</code></p>

<pre class="brush: js">var array = [2, 5, 9];
array.indexOf(2);     // 0
array.indexOf(7);     // -1
array.indexOf(9, 2);  // 2
array.indexOf(2, -1); // -1
array.indexOf(2, -3); // 0
</pre>

<h3 id="找出指定元素出现的所有位置">找出指定元素出现的所有位置</h3>

<pre class="brush: js">var indices = [];
var array = ['a', 'b', 'a', 'c', 'a', 'd'];
var element = 'a';
var idx = array.indexOf(element);
while (idx != -1) {
  indices.push(idx);
  idx = array.indexOf(element, idx + 1);
}
console.log(indices);
// [0, 2, 4]
</pre>

<h3 id="判断一个元素是否在数组里，不在则更新数组">判断一个元素是否在数组里，不在则更新数组</h3>

<pre class="brush: js">function updateVegetablesCollection (veggies, veggie) {
    if (veggies.indexOf(veggie) === -1) {
        veggies.push(veggie);
        console.log('New veggies collection is : ' + veggies);
    } else if (veggies.indexOf(veggie) &gt; -1) {
        console.log(veggie + ' already exists in the veggies collection.');
    }
}

var veggies = ['potato', 'tomato', 'chillies', 'green-pepper'];

// New veggies collection is : potato,tomato,chillies,green-papper,spinach
updateVegetablesCollection(veggies, 'spinach');
// spinach already exists in the veggies collection.
updateVegetablesCollection(veggies, 'spinach'); </pre>

<h2 id="Polyfill">Polyfill</h2>

<p><code>indexOf</code> 在ECMA-262 标准 的第5版中被加入，但并非所有的浏览器都支持该方法。你可以在编写scripts时，在其开头使用以下代码，它能够允许你在没有本地支持的情况下使用indexOf方法。该算法符合ECMA-262第5版其中一项规定, 即假定 {{jsxref("Global_Objects/TypeError", "TypeError")}}和 {{jsxref("Math.abs")}} 呈现它们原有的值。</p>

<pre class="brush: js">// Production steps of ECMA-262, Edition 5, 15.4.4.14
// Reference: http://es5.github.io/#x15.4.4.14
if (!Array.prototype.indexOf) {
  Array.prototype.indexOf = function(searchElement, fromIndex) {

    var k;

    // 1. Let O be the result of calling ToObject passing
    //    the this value as the argument.
    if (this == null) {
      throw new TypeError('"this" is null or not defined');
    }

    var O = Object(this);

    // 2. Let lenValue be the result of calling the Get
    //    internal method of O with the argument "length".
    // 3. Let len be ToUint32(lenValue).
    var len = O.length &gt;&gt;&gt; 0;

    // 4. If len is 0, return -1.
    if (len === 0) {
      return -1;
    }

    // 5. If argument fromIndex was passed let n be
    //    ToInteger(fromIndex); else let n be 0.
    var n = +fromIndex || 0;

    if (Math.abs(n) === Infinity) {
      n = 0;
    }

    // 6. If n &gt;= len, return -1.
    if (n &gt;= len) {
      return -1;
    }

    // 7. If n &gt;= 0, then Let k be n.
    // 8. Else, n&lt;0, Let k be len - abs(n).
    //    If k is less than 0, then let k be 0.
    k = Math.max(n &gt;= 0 ? n : len - Math.abs(n), 0);

    // 9. Repeat, while k &lt; len
    while (k &lt; len) {
      // a. Let Pk be ToString(k).
      //   This is implicit for LHS operands of the in operator
      // b. Let kPresent be the result of calling the
      //    HasProperty internal method of O with argument Pk.
      //   This step can be combined with c
      // c. If kPresent is true, then
      //    i.  Let elementK be the result of calling the Get
      //        internal method of O with the argument ToString(k).
      //   ii.  Let same be the result of applying the
      //        Strict Equality Comparison Algorithm to
      //        searchElement and elementK.
      //  iii.  If same is true, return k.
      if (k in O &amp;&amp; O[k] === searchElement) {
        return k;
      }
      k++;
    }
    return -1;
  };
}
</pre>

<h2 id="规范">规范</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <th scope="col">Specification</th>
   <th scope="col">Status</th>
   <th scope="col">Comment</th>
  </tr>
  <tr>
   <td>{{SpecName('ES5.1', '#sec-15.4.4.14', 'Array.prototype.indexOf')}}</td>
   <td>{{Spec2('ES5.1')}}</td>
   <td>Initial definition.<br>
    Implemented in JavaScript 1.6</td>
  </tr>
  <tr>
   <td>{{SpecName('ES6', '#sec-array.prototype.indexof', 'Array.prototype.indexOf')}}</td>
   <td>{{Spec2('ES6')}}</td>
   <td></td>
  </tr>
 </tbody>
</table>

<h2 id="浏览器兼容性">浏览器兼容性</h2>

<div>


<p>{{Compat("javascript.builtins.Array.indexOf")}}</p>
</div>

<h2 id="See_also" name="See_also">相关链接</h2>

<ul>
 <li>{{jsxref("Array.prototype.lastIndexOf()")}}</li>
 <li>{{jsxref("TypedArray.prototype.indexOf()")}}</li>
</ul>