자바스크립트 배열 내장 함수(2)

1) findIndex

: 주어진 조건의 함수를 만족하는 배열의 첫 번째 요소에 대한 인덱스를 반환

즉, 찾고자 하는 값의 첫 번째 인덱스를 가져온다.

구문

arr.findIndex(callback(요소[, 인덱스[, 배열]])[, callback을 실행할 때 this로 사용할 값])

예1)

const arr = ['item1', 'item2', 'item3'];

console.log(arr.findIndex((e) => e == 'item3')); 
결과 : 2
console.log(arr.findIndex((e) => e == 'item1')); 
결과 : 0

예2)
const nums = [1, 5, 6, 9, 11, 15, 4, 3, 2];

find1 = nums.findIndex((e, index) => {
	return index < 7 && index > 5; 
}); 

console.log(find1);

결과 : 6
// 범위에 해당하는 값이 여러개 인 경우 항상 첫번째 인덱스에 있는 값을 가져온다

 

2) find

: findIndex함수와 사용법은 동일하나 반환하는 값이 index값이 찾아낸 값 자체를 반환, 

즉 찾고자 조건에 해당하는 첫번째 값을 가져온다.

구문

array.find(callback(요소, 인덱스, 배열),callback을 실행할 때 this로 사용할 값)

예1)
const ages  = [5, 12, 8, 130, 44];

function checkAge(age) {
  return age > 12;
}

const found = ages.find(checkAge);
console.log(found);
결과 : 130 (12 보다 높은값의 첫번째 요소)

예2)
const arr = [
  {
    seq: 1,
    name: 'hong',
    age: 34,
  },
  {
    seq: 2,
    name: 'Mun',
    age: 25,
  },
  {
    seq: 3,
    name: 'Kim',
    age: 45,
  }
]

console.log(arr.find(item => item.seq === 2)); 
결과 : {seq: 2, name: 'Mun', age: 25}

 

3) splice

: 배열의 기존 요소를 삭제 또는 교체하거나 새 요소를 추가하여 배열의 내용을 변경

구문

array.splice(시작할 인덱스 번호, 배열에서 제거할 요소의 수,  배열에 추가할 요소(, 로 구분하여  입력))

예1) 배열 추가
var arr = ['a','b','c','d','e'];
console.log(arr);
결과 :  ['a', 'b', 'c', 'd', 'e']

arr.splice(3,0,"5"); // 배열의 3번째 인덱스에 "5"를 추가
console.log(arr);
결과 : ['a', 'b', 'c', '5' 'd', 'e']

arr.splice(0,0,"7"); // 변환된 배열의 0번째 인덱스에 "7"을 추가
console.log(arr);
결과 : ['7', 'a', 'b', '7', 'c', 'd', 'e']
* 위에서 이미 배열의 값을 바꾼 상태이기 때문에 바뀐 배열에 값을 추가함

예2) 배열 삭제
var arr2 = ['a','b','c','d','e'];
arr2.splice(2,1); // 배열의 2번째 인덱스에 해당하는 값을 삭제
console.log(arr2);
결과 :  ['a', 'b', 'd', 'e']

예3) 배열 삭제하고 요소 값 추가
var arr3 = ['a','b','c','d','e'];
arr3.splice(2,1, 'cc','dd'); 
// 배열의 2번째 인덱스에 해당하는 값을 삭제하고 추가된 요소를 해당 인덱스 위치에 추가
console.log(arr2);

 

4) slice

: 배열의 begin부터 end까지(end 미포함)에 대한 얕은 복사본을 새로운 배열 객체로 반환함

(기존 원본 배열은 바뀌지 않음)

구문

arrary.slice([시작인덱스[, 종료 인덱스]])

* 종료인덱스는 항상 제외하고 추출함

* 음수 인덱스는 배열의 끝에서부터의 길이를 나타내며,  예를 들어 -1의 배열의 마지막 원소를 가리키고 전달 인자 -3은

배열의 마지막 원소로부터 세 번째 원소를 가리킴

const fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
const citrus = fruits.slice(1, 3);
console.log(citrus);
결과 : ['Orange', 'Lemon']

const fruits2 = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
const myBest = fruits2.slice(-3, -1); // 배열의 끝에서 3번째 까지 가져오면서 배열의 끝은 제외
console.log(myBest);
결과 :  ['Lemon', 'Apple']