배열의 indexOf 함수와 findIndex 함수의 차이

배열의 indexOf 함수와 findIndex 함수의 차이

배열에서 두 함수 indexOf와 find Index의 차이를 헷갈립니다.

문서에는 다음과 같이 기재되어 있습니다.

findIndex - 술어가 true인 배열의 첫 번째 요소의 인덱스를 반환합니다.그 이외의 경우 -1을 반환합니다.

그리고.

indexOf - 배열에서 값이 처음 발생한 인덱스를 반환합니다.

주요 차이점은 다음 기능의 파라미터입니다.

• Array.prototype.indexOf() 에서는 값이 첫 번째 파라미터로 간주됩니다.따라서 기본 유형(예: 문자열, 숫자 또는 부울)의 배열에서 인덱스를 찾는 것이 좋습니다.

• Array.prototype.findIndex() 는 첫 번째 파라미터로서 콜백을 상정하고 있습니다.기본 유형이 아닌 배열(예: 개체)에 인덱스가 필요하거나 찾기 조건이 값보다 더 복잡한 경우 이 옵션을 사용합니다.

양쪽의 예에 대해서는, 링크를 참조해 주세요.

심플 - 어떤 종류의 어레이 구조를 사용하고 있습니까?

• 오브젝트 배열의 경우findIndex();
• 또 다른,indexOf().

"오렌지" 키를 사용하여 개체 배열에서 인덱스를 찾습니다.

let fruits = [
   { type: "Apple", quantity: 9 },
   { type: "Banana", quantity: 2},
   { type: "Orange", quantity: 8},
   { type: "Pear", quantity: 777}
];

let myIndex = fruits.findIndex(fruit => fruit.type === "Orange"); // Returns 2.

"단순 배열에서 인덱스를 찾고 싶다"

let fruits = [ "Apple", "Banana", "Pear", "Orange"];

let index = fruits.indexOf("Orange"); // Returns 3.

FindIndex는 술어와 일치하는 첫 번째 요소를 찾는 경우 유용합니다.W3C의 예에서는 고객의 연령이 18세 이상일 경우 숫자와 일치가 있습니다.

var ages = [3, 10, 18, 20];

function checkAdult(age) {
    return age >= 18;
}

console.log(ages.findIndex(checkAdult));

콘솔:

2

배열의 indexOf 함수로 정확한 요소 인덱스를 찾을 수 있지만 술어는 전달할 수 없습니다.특정 요소를 찾으려면 이 방법이 더 빠릅니다.

var ages = [3, 10, 18, 20];
console.log(ages.indexOf(10));

반환:

1

인덱스 카운트는 0부터 시작되므로 첫 번째 요소 인덱스는 0입니다.

이들 간의 주요 차이점은 다음과 같습니다.

findIndex() 메서드는 다음과 같은 콜백 함수를 가져옵니다.

var x = [1,2,3];
x.findIndex(x=> x==3); //returns 2

그러나 indexOf 함수는 다음과 같은 값만 가져옵니다.

x.indexOf(3); // returns 2;

콜백을 인덱스에 전달하려고 하면 -1이 반환됩니다.

x.indexOf(x => x==3); //returns -1

findIndex에 값을 전달하려고 하면 다음 오류가 반환됩니다.

x.findIndex(3); //Uncaught TypeError: 3 is not a function at Array.findIndex (<anonymous>) at <anonymous>:1:3

또 다른 차이점은 findIndex()를 사용하면 사용자가 일부 함수를 적용하여 테스트에 합격한 요소를 배열에서 찾을 수 있다는 것입니다.

그러나 indexOf() 연산자에서는 그렇지 않습니다.사용자는 특정 요소가 배열에 존재하는지 여부만 확인할 수 있습니다.

주요 차이점은 다음 기능의 파라미터입니다.

-> Array.protype.indexOf() :

   var fruits = ["Banana", "Orange", "Apple", "Mango"];
   var a = fruits.indexOf("Apple");
   The result of a will be: 2

-> Array.protype.findIndex() :

       var ages = [3, 10, 18, 20];

       function checkAdult(age) {
        return age >= 18;
       }

       function myFunction() {
         document.getElementById("demo").innerHTML = 
         ages.findIndex(checkAdult);
       }

       The result will be: 2

이 경우에도 하실 수 있습니다.includes:

[1, 2, 3].includes(2);      // true
[1, 2, 3].includes(4);      // false
[1, 2, 3].includes(3, 3);   // false

나는 지지는 but가 더 .indexOf★★★★

var vals = [ "foo", "bar", 42, "baz" ];
if (~vals.indexOf( 42 )) {
  // found it!
}

다음 코드를 사용해 보십시오.

let city = ['Delhi', 'mumbai']
const a = city.findIndex((item) => 
item.toLowerCase()==='delhi')
console.log(a) // returns 0

let c = city.indexOf('mumbai') // returns 1
console.log(c)

• findIndex는 콜백을 파라미터로 받아들이며 오브젝트 배열과 함께 사용하는 것이 가장 좋습니다.

const employees = [
  { id: 1, name: "John", dob: 1999 },
  { id: 2, name: "Doe", dob: 2005 },
  { id: 3, name: "Marry", dob: 2001 },
  { id: 4, name: "Larry", dob: 1990 },
]

const output = employees.findIndex((elem) => elem.name === "Doe") // 1

• indexOf는 값을 파라미터로 받아들입니다.

let alphabets = ["a", "b", "c", "d", "e"]
alphabets.indexOf("c") // 2

언급URL : https://stackoverflow.com/questions/41443029/difference-between-indexof-and-findindex-function-of-array