[ 자바스크립트 ] 배열에서 lastIndexOf() 사용하기

최종 수정일 : 2016. 11. 3.

배열에서의 lastIndexOf() :

익스플로러(ie) 9 이상 & 그외 브라우저에서는 기본적으로 제공되는 함수이다.

찾고자 하는 것( item )의 위치( index )를 알려준다.
찾으려는 것이 배열에 들어있지 않으면, "-1"이라는 결과가 나온다.

찾는 것이 여러 개 들어있다면,
그 중에서 맨 앞에 있는 것을 알려준다.

─ indexOf() : 배열의 앞에서부터 뒤쪽으로, 검색해나간다.
─ lastIndexOf() : 배열의 뒤에서부터 앞쪽으로, 검색해나간다.

---

Polyfill

<script type="text/javascript">
// source : https://tonks.tistory.com/121#_javascript_array_lastIndexOf 

if ( ! Array.prototype.lastIndexOf ){ 
     Array.prototype.lastIndexOf = function lastIndexOf ( toBeSearched , fromIndex ){ 
          if ( this == null ){ 
               try {  throw new Error( "Array.prototype.indexOf called on null or undefined." );   } 
               catch( error ) { 
                         error.name = "TypeError"; 
                         throw error; 
               } 
          } 

          var thisObj = Object( this ); 

          var length = thisObj.length >>> 0; 
          if ( length === 0 ){  return -1;  } 

          var index = Math.floor( fromIndex ) || 0; 
          var lastIndex = length - 1; 

          if ( index > lastIndex ){  index = lastIndex;  } 
          else if ( index < 0 ) {  index = length + index;  } 

          for ( index; index > -1; index-- ){ 
               if ( index in thisObj && thisObj[ index ] === toBeSearched ){  return index;  } 
          } 

          return -1; 
     }; 
} 
</script>

---

 
<button onclick="testing()"> 클릭하세요 </button>

<p id="demo_end">  </p>
<p  id="demo_3">  </p>
<p  id="demo_1">  </p>

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


<script type="text/javascript">

function testing (){ 

    var array = [ "Tistory", "Daum", "Naver", "Google", "StackOverflow" ]; 

    var from_end = array.lastIndexOf ( "Google" );     // 배열의 맨 끝에서부터 앞쪽으로 검색 진행함. 
    var  from_3  = array.lastIndexOf ( "Google" , 3 );  // 3번째부터 앞쪽으로 검색 진행함. 
    var  from_1  = array.lastIndexOf ( "Google" , 1 );  // 1번째부터 앞쪽으로 검색 진행함. 

    document.getElementById( "demo_end" ).innerHTML = from_end; 
    document.getElementById(  "demo_3"  ).innerHTML = from_3; 
    document.getElementById(  "demo_1"  ).innerHTML = from_1; 


    var similar = array.lastIndexOf ( "Goo" );   // 정확히 일치하는 것만 찾아냄. 
    document.getElementById( "demo" ).innerHTML = similar; 
} 
</script>
 

---

 
<button onclick="testing()"> 클릭하세요 </button>

<p id="demo_end">  </p>
<p  id="demo_4">  </p>
<p  id="demo_2">  </p>


<script type="text/javascript">

function testing (){ 

    var array = [ "Tistory", "Daum", "Naver", "Google" , "Tistory", "Daum", "Naver", "Google" ]; 

    var from_end = array.lastIndexOf ( "Google" ); 
    var  from_4  = array.lastIndexOf ( "Google" , 4 ); 
    var  from_2  = array.lastIndexOf ( "Google" , 2 ); 

    document.getElementById( "demo_end" ).innerHTML = from_end; 
    document.getElementById(  "demo_4"  ).innerHTML = from_4; 
    document.getElementById(  "demo_2"  ).innerHTML = from_2; 
} 
</script>
 

---

 
<button onclick="testing()"> 클릭하세요 </button>

<p id="num">  </p>
<p id="str">  </p>


<script type="text/javascript">

function testing (){ 

    var array = [ 2, 4, 6, 8, 10 ]; // 숫자만 들어있는 배열 

    var number = 10; // 숫자 10 
    var string = "10"; // 문자 (문자열) "10" 

    document.getElementById( "num" ).innerHTML = array.lastIndexOf ( number ); 
    document.getElementById( "str" ).innerHTML = array.lastIndexOf ( string ); 
} 
</script>
 

---

위치(index)의 값으로 음수를 넣게 되면, 결과는 아래와 같다.

 
<button onclick="testing()"> 클릭하세요 </button>

<p id="neg1">  </p>
<p id="neg2">  </p>


<script type="text/javascript">

function testing (){ 

    var array = [ 2, 4, 6, 8, 10 ]; 

    var negative_1 = array.lastIndexOf ( 10 , -1 );  
    var negative_2 = array.lastIndexOf ( 10 , -2 );  

    document.getElementById( "neg1" ).innerHTML = negative_1; 
    document.getElementById( "neg2" ).innerHTML = negative_2; 
} 
</script>
 

이 블로그에서 함께 볼만한 글 : [ 자바스크립트 ] 배열에서 indexOf() 사용하기

이 내용이 도움이 되셨다면, 아래의 하트 버튼을 눌러주세요. *^^*