【JavaScript】阵列方法之indexOf()

【前言】
本系列为个人前端学习之路的学习笔记，在过往的学习过程中累积了很多笔记，如今想藉着IT邦帮忙这个平台做整理+再复习。
本系列标题一律以【】标示该篇文章主要涉及的内容，例如【JavaScript】、【Vue】等等。
若内容有误，还麻烦各路大神不吝於点出问题，感激不敬。

在JavaScript中有许多操作阵列的方法，本篇将针对indexOf()

阵列.indexOf()将阵列中的一笔资料作为参数，回传阵列中该笔资料的索引值。

const array = ["red", "blue", "white"];
console.log(array.indexOf("red")); //得到red的索引值0

得到索引值之後可以做很多事情，最常见的就属於「找到那笔资料在第几笔，删掉它」

const array = ["red", "blue", "white"];
array.splice(array.indexOf("red"),1);
console.log(array); //["blue","white"]

要注意的是，如果将不存在於阵列中的资料作为参数，或是不传入资料的话，将会回传-1。

const array = ["red", "blue", "white"];
//不传入参数
console.log(array.indexOf()); //-1
//查找不存在的资料
console.log(array.indexOf("black"));  //-1

indexOf()的比较方法

indexOf()使用严格相等(即===)

const array = [1, 2, 3];
console.log(array.indexOf("1")); //-1，代表找不到符合条件

如果有多笔资料符合条件，indexOf()只会回传第一笔的索引值

const array = ["red", "blue", "white", "red"];
console.log(array.indexOf("red")); //0，并不会回传第二个的索引值(3)

当阵列中的资料为物件时，indexOf()是比较参考位置

const a = {
    num: 1
};
const b = {
    num: 1
}
const c = a;
const array = [a, b, c];
console.log(array.indexOf(c)); //0，因为a和c的参考位置相同，即a === c，但如果有多笔资料符合条件，indexOf()只会回传第一笔的索引值

在这个案例中明明我们想查询的是c，结果得到的索引值却是a，正是因为物件传参考的特性导致的有趣情况
也因为indexOf()是比较物件的参考位置，还会出现这样的状况：

const a = {
    num: 1
};
const array = [a];
console.log(array.indexOf({num: 1})); //-1，找不到

明明乍看之下我们要找的东西和a一模一样，但indexOf()却回传-1
这是因为当我们以参数的形式传入{num: 1}的时候，其本身是一个新物件，有自己的参考位置，而这个参考位置与a是不同的
因此，当indexOf()比较a和{num: 1}的参考位置时，自然会得到false的结果

const a = {
    num: 1
};
console.log(a === {num: 1}); //false

这样就很明显知道为什麽会是-1了