JavaScript(ES6)|배열,APIs 총정리

Array

 

1. Declaration

배열을 만드는 (선언하는) 방법.

2번째 방법을 더 많이 씀.

 

 

 

2.Index position

const로 배열을 만들고 출력하면 값이 모두 나오고

length를 출력하면 배열 값의 갯수,

[0],[1]을 출력하면 인덱스 숫자에 맞는 값이 출력,

배열에 값이 없으면 ([2]) undefined로 출력.

 

배열의 마지막 값을 출력하려면 

length에서 -1을 하기도 함. (인덱스는 0부터 시작하기 때문)

 

 

3.Looping over an array

 

-print all fruits

모든 배열을 출력하는 방법에는 세 가지가 있다.

 

a. for방법은 

i를 0으로 주고 1씩 늘려가면서 fruits의 값의 갯수보다 같거나 커지면 멈추게 하는방법.

 

 

b. for of의 방법은

fruit을 만들고 fruits안에 있는 값을 순차적으로 할당하면서 블럭을 실행.

 

 

c. forEach방법은

forEach라는 API를 이용해서 출력하는 방법.

forEach는 콜백 함수를 받아옴.

(value, index, 전체적인 array)순서로 받아오게 됨.

 

c. forEach에서 이름이 없는 함수이기때문에 더 간단하게 작성할 수 있다.

function을 삭제하고 '=>'를 이용해서 작성해준다.

한 줄짜리는 { }도 필요없기때문에 삭제해주고, 출력하고 싶은 값만 남겨주면

훨씬 깔끔한 코드가 완성.

 

 

4.Addition, deletion, copy

-push : add an item to the end

-pop : remove an item from the end

push는 추가.

pop는 뒤에서부터 순차적으로 삭제.

 

fruits.pop을 하는 갯수마다 뒤에서부터 삭제됨.

 

 

 

-unshift: add an item to the benigging

앞에서 부터 추가하고 싶다면 unshift를 사용.

 

 

-shift: remove an item from the benigging

앞에서부터 삭제하고 싶다면 shift를 사용.

 

 

**note!! shift, unshift are slowe than pop, push

shift와 unshift는 pop과 push보다 더 느리다.

이유는 앞에 추가하고 삭제해야하기때문에 배열 전체가 움직인다.

반면 뒤에서부터 추가하거나 삭제하는건 그 부분만 수정이 되는것 이기때문에 빠르다.

 

 

 

-splice: remove an item by index position

splice는 원하는 인덱스를 선택해서 삭제할 수 있다.

fruits.splice(삭제하고자 하는 인덱스, 삭제할 값 갯수)인데

fruits.splice(1); 이렇게 하게되면 인덱스1부터 뒤에 모두 지워진다.

바나나만 지우고 싶을때는

꼭 이렇게 지울 갯수도 같이 표시를 해줘야 한다.

 

 

뿐만 아니라 삭제한 값 자리에 새로운 값을 추가하고 싶다면

위 사진처럼 코드를 작성해주면된다.

그럼 삭제된 값 자리에 뒤에 붙인 값이 추가된다.

 

 

 

-combine two arrays

두 가지의 배열을 묶어서도 만들 수 있다.

기존 배열.concat(추가할 배열);을 작성하면 

기존 배열과 추가된 배열이 합해져서 새로운 배열(newFruits)을 만든다. 

 

 

5.Searching

-indexOf: find the index

 배열 몇번째에 있는지 찾고 싶을 때 사용하는 키워드.

없는 값을 검색하면 -1로 출력이 된다.

 

 

-includes

배열에 검색한 값이 있는지 없는지 알아보는 코드.

있으면 true, 없으면 false로 출력됨.

 

 

-lastIndexOf

indexOf는 앞에서부터 찾다가 그 값을 만나면 리턴해줌.

반대로 lastIndexOf는 뒤에서 부터 찾아서 값을 출력해줌.