배열 API 정리

front-ant·2022년 4월 28일
0

1. concat( )

const user1 = ['1','2','3']
const user2 = ['3','4','5']

const result = user1.concat(user2);
// '1','2','3','3','4','5'

concat은 배열에 다른 배열을 덮어씌울 수 있는 메서드입니다.
대신 두 개의 배열이 같은 내용을 가지고 있어도 중복으로 출력이 된다는 점이 있습다.

💡 메서드에 인수로 함수를 사용할 때 그 함수를 콜백함수라고 부릅니다.


2. forEach( )

const user1 = ['1','2','3']

user1.forEach(function(element,index){
    console.log(element,index);
});
// 1 0 
// 2 1
// 3 2

forEach는 콜백함수를 배열 요소 각각에 대해 실행할 수 있습니다.
위 식은 배열의 요소와 그 요소에 대한 인덱스 번호를 차례대로 끝까지 호출을 한 식입니다.


3. map( )

const user1 = ['1','2','3']

const result = user1.map(function(item,index){
    return `${item}-${index}`
});
// 1-0
// 2-1
// 3-2

map은 콜백함수의 값을 반환하여 변수에 저장할 수 있습니다.
그리고 새로운 배열로 묶어서 출력이 됩니다.


4. push( )

const user1 = ['1','2','3']

user1.push('맨 뒤에 추가');
// ['1','2','3','맨 뒤에 추가']

배열에 추가할 값을 맨 뒤에 추가시켜주는 메서드입니다.


5. unshift( )

const user1 = ['1','2','3']

user1.unshift('맨 앞에 추가');
// ['맨 앞에 추가','1','2','3']

배열에 추가할 값을 맨 앞에 추가 시켜주는 메세드입니다.


6. reverse( )

const user1 = ['1','2','3']

user1.reverse();
// ['3','2','1']

배열의 순서를 거꾸로 뒤바꾸는 메서드입니다.


7. splice( )

const user1 = ['1','2','3']

user1.splice(0,1);
// ['2','3']

splice는 ( )안에 (지울 index번호, 지울 index번호부터 몇개를 지울지)를 입력해주면 선택한 index번호 부터 지정한 개수만큼 배열안에 요소를 삭제해준다.


const user1 = ['1','2','3']

user1.splice(3,0,'4');
// ['1','2','3','4']

splice는 삭제뿐만 아니라 지운 위치에 새로운 데이터를 끼워 넣을 수도 있고 (지울 index번호, 지울 index번호부터 몇개를 지울지,'그 자리에 넣을 데이터'), 지울 개수를 0으로 설정하여 아무 데이터도 지우지 않고 선택한 위치에 새로운 데이터를 넣을 수도 있다.

profile
개미처럼 꾸준히 공부하는 개발자입니다.

0개의 댓글