• Q&A
  • 회원가입
  • 로그인

[Array] JS - findIndex() 메서드 - 맨처음 조건 충족/일치 배열값 색인번호 찾기 (= findIndex메서드 = 파인드인덱스메서드)

목차
  1. findIndex() 예제 - 15 이상인 첫번째 일치요소 색인번호 찾기
  2. findIndex() 정의
  3. findIndex() 구문
  4. findIndex() 예제 - 입력값보다 큰 첫번째 일치요소 색인번호 찾기

 

findIndex() 예제 - 15 이상인 첫번째 일치요소 색인번호 찾기 

 

<button onclick="homzzang()">클릭</button>


<p id="demo"></p>


<script>

var num = [5, 10, 15, 20];


function checkNum(num) {

  return num >= 15;

}


function homzzang() {

  document.getElementById("demo").innerHTML = num.findIndex(checkNum);

}

</script>

 

결과보기 (결과값: 2)

주의: IE11 및 그 이전 브라우저는 지원 X

 

findIndex() 정의

 

각 배열 요소에 함수 적용 후, 일치하는 첫 번째 요소의 색인번호 반환.

 


 

1.

  • 일치하는 요소 없으면, -1 반환.
  • 빈 배열요소에 대해선 실행 X
  • 원래 배열 변경 X

 

2.

  • ECMAScript6 (ES6: JavaScript 2015)
  • IE11 이하 제외한 주요 최신 브라우저 모두 지원.

 

3. 관련글

 

3. MDN findIndex() 예제 보기

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/findIndex

 

 

 

findIndex() 구문

 

array.findIndex(function(currentValue, index, arr), thisValue)

 


[매개변수]

 

function()

필수. 배열 각 요소에 대해 실행할 함수

  • currentValue - 필수. 현재요소 값
  • index - 선택. 현재요소 색인번호
  • arr - 선택. 현재요소의 배열


thisValue

선택. this 값으로 함수에 전달된 값 (기본값: undefined)

 


[반환값]

 

  • 일치요소 존재 O 경우, 일치요소의 첫번째 색인번호 반환.
  • 일치요소 존재 X 경우, -1 반환.

 

 

findIndex() 예제 - 입력값보다 큰 첫번째 일치요소 색인번호 찾기

 

<input type="number" id="hz" value="5"></p>


<button onclick="homzzang()">클릭</button>


<p id="demo"></p>


<script>

const nums = [1, 3, 6, 10];


function checkValue(x) {

  return x > document.getElementById("hz").value;

}


function homzzang() {

  document.getElementById("demo").innerHTML = nums.findIndex(checkValue);

}

</script>


결과보기 (결과값: 2)


방문 감사합니다. (즐겨찾기 등록: Ctrl + D)

찾아주셔서 감사합니다. Since 2012