참고자료 :
드림코딩 by 엘리 자바스크립트 8. 배열 제대로 알고 쓰자. 자바스크립트 배열 개념과 APIs 총정리 | 프론트엔드 개발자 입문편 (JavaScript ES6 )
드림코딩 by 엘리 자바스크립트 9. 유용한 10가지 배열 함수들. Array APIs 총정리 | 프론트엔드 개발자 입문편 ( JavaScript ES6)
1. Declaration 선언
const arry1 = new Array()
const arry2 = [1,2,3,4,5]2. Index position
array2[1] === 2브라켓 노테이션을 통해 대괄호 안에 인덱스(숫자)를 쓰면 해당하는 숫자에 해당하는 배열을 찾을 수 있다. 인덱스는 0부터 시작한다.
array2[array2.length -1]배열의 마지막에 있는 아이템을 찾을 때 대괄호 안에 위와 같이 써준다.
3. 배열 반복문
* for loop :
for (let i = 0; i < num; i ++)* for of loop
for (let i of array2)* forEach() 메소드
array2.forEach((array2, index) => {console.log(array2, index);});콜백 함수를 받아오는 메소드.
TIP
VScode에서 cmd를 누른채 메소드를 클릭하면 API가 선언되어진 문서로 이동한다. 이 문서를 읽으면 꽤나 유용하다. 특정 함수가 무엇이며 파라미터는 어떤 파라미터를 전달받는지 리턴되는 값은 어떤게 있는지 확인할 수 있다.
4. 배열 메소드
addition, deletion, copy
add an item to the end
push
remove an item from the end
pop
add an item to the benigging
unshift : 배열의 앞에 추가하는 방법.
remove an item from the benigging
shift : 배열의 앞에 있는 것을 삭제한다.
NOTE!
shift, unshift are slower than pop, push
앞의 두 메소드는 전체적으로 아이템을 이동시키기 때문에 후자보다 느리다.
remove an item by index position
splice
TIP VScode의 API 문서의 splice 설명
splice(start: number, deleteCount? :number): string\[]
파라미터로는 어디서 부터 지울 건지 start값을 숫자로 주고, 지울 값을 숫자로 주라고 써져 있다. 여기서 ?는 optional 즉, 값을 지정해 줘도 되고 안해줘도 된다는 의미다.
ex )
splice(1, 1, 'abc') //1번째 인덱스부터 1개를 지우고 그 자리에 abc라는 데이터를 넣는다.
splice(1, 0, 'abc') //1번째 인덱스부터 지우지 않고 그 자리에 abc라는 데이터를 넣는다. combine two arrays
concat
const array1 = ['123', '456']
const array2 = ['abc', 'def']
const newarr = array1.concat(array2)TIP VScode의 API 문서의 concat 설명
concat(...items: (T | ConcatArray<T>[]): T[]
T는 리턴한다는 의미이다. T뒤에 []가 있으므로 배열을 리턴한다는 뜻이다.
Searching
indexOf() : 주어진 값과 일치하는 첫 번째 인덱스를 반환한다.
includes() : 해당 인덱스가 있는지 없는지 boolean으로 리턴
lastIndexOf() 배열의 제일 마지막에 있는 아이템의 인덱스가 출력 된다.
make a string out of an array
join
const result = array1.join()join의 구분자로 예를 들어 '-'을 주면 각 아이템 사이를 -로 구분하며 합쳐진다.
make an array out of string
split
const string1 = 'ab,cd,ef,g'
const result = string1.split(',') //','기준으로 나눠서 배열을 만들어 준다.
result === ['ab,cd,ef,g']//limit을 지정해보자
const result = string1.split(',', 2)
//앞에서 부터 2개의 아이템이 출력 된다.
result === ['ab,cd']TIP VScode의 API 문서의 split 설명
split(separator: string | RegExp, Limit?: number): string[]
RegExp는 정규 표현식이라는 의미이고, separator는 구분자, limit은 리턴받을 배열의 사이즈를 지정하는 것이다. optional이다.
make this array look this [5,4,3,2,1]
reverse : 거꾸로 정렬해준다.
7 : 49까지 동영상 시청
