배열이란?
배열(array)이란 여러 개의 값을 순차적으로 나열한 자료구조를 뜻한다.
배열은 대괄호 [ ]를 사용해서 표현하고 그 안에 들어가는 값을 배열의 요소(element)라고 한다.
여기서 요소의 순번을 인덱스(index)라고 하는데 주의할 점은 이 순번은 0부터 시작한다는 것이다.
즉, 배열의 첫 번째 인덱스 값은 0이다.
let arr = [1,2,3,4,5,6,7]
[code] arr이라는 배열의 요소는 1,2,3,4,5,6,7,이고 각각의 index값은 0,1,2,3,4,5,6이다.
배열을 정의하는 표현에서 여러개의 값보다 더 중요한 것이 순차적이라는 표현이다.
왜냐하면 배열에서 요소의 순서가 다르다는 것은 다른 배열이라는 뜻이기 때문이다.
그렇다면 아래의 코드를 보고 두 배열이 같은 배열인지 확인해보자.
let arr1 = ['apple', 'pear', 'peach', 'watermelon', 'pineapple', 'orange'];
let arr2 = ['pear', 'watermelon', 'pineapple', 'peach', 'orange', 'apple'];
arr1 === arr2 // ture? or false?
arr1과 arr2는 서로 다른 배열이다.
두 배열의 순서가 다르기 때문이다.
arr1과 arr2를 보면서 인덱스와 요소를 다시 한 번 정리해보자.
arr1[0]: // 'apple'
arr2[3]: // 'peach'
[code] 배열의 인덱스 값을 넣으면 해당 인덱스의 요소를 알 수 있다.
배열의 특징
배열은 몇가지의 특징이 있다.
1 JavaScript의 모든 값은 배열이 될 수 있다.
(원시값은 물론이고 객체, 함수, 배열등)
let arr1 = ['apple', 'pear', 'peach'];
let arr2 = ['apple', 7, function (){}, 8: eight];
2. 배열은 요소의 개수, 다시말해 배열의 길이를 나타내는 length 프로퍼티를 가집니다.
let arr1 = ['apple', 'pear', 'peach'];
console.log(arr1.length); // 3
3. 배열은 length 프로퍼티를 가지므로 for문을 통해 접근할 수 있어요!
for(let i = 0; i < arr.length; i++){
console.log(arr[i]);
}
[code] 배열의 순회를 통해서 배열의 모든 요소를 다 순회할 수 있다.
4. 배열은 객체(Object) 타입이다.
(배열이라는 타입은 존재하지 않는다.)
배열은 객체 타입이지만 일반 객체와는 구분되는 독특한 특징이 있습니다.
자주 사용하는 배열 매서드
- Array.isArray(): 해당 코드가 배열인지 확인해주는 메서드, boolean 형태로 나타난다. ( = true, false의 형태)
**console.table : table의 형태로 console 값을 나타내는 메서드 (참고: 배열의 메서드는 아님;)
- arr.push() : 새로운 index값을 추가해서 기존 index값 뒤로 index를 붙이고 기존 element값 뒤로 element를 붙인다.
*예) arr.push('morning') -> 기존 배열의 마지막 index 값 뒤로 붙는다.
- arr.pop() : arr.push의 반대되는 개념으로 기존 배열의 마지막 index값과 element값을 제거한다.
*예) arr.pop() -> 앞서 추가했던 'morning'이 삭제된다.
- arr.shift() -> 맨 앞에있는 index값과 element값을 삭제한다.
- arr.unshift -> 맨 앞에있는 index값과 element값을 추가한다.
- arr.indexOf() :괄호 안의 element값의 index값이 얼마인지를 구할 수 있는 메서드.
★★★★
arr.push() / arr.pop() / arr.unshift() / arr.shift()는 새로운 배열을 만들어 내는 것이 아닌
기존의 함수에서 element만 맨 뒤에 이어 붙이고 맨 뒤에 있는 걸 삭제하고 / 맨 앞에 이어 붙이고 / 맨 앞에 있는 걸 삭제 하는 것이다.
★★★★
★★★★
.slice()는 복사 및 붙여 넣기다.
.concat()은 두 배열을 이어 붙이는 것이다.
이 두 메서드의 특징은 새로운 배열을 만들어야 한다는 것
★★★★
*예) let words = ['How', 'are', 'you?'];
words.indexOf ('are');
라면 1이라는 값이 나온다. 여기서 1은 'are'라는 element의 index값이다.
** 만약 () 안에 변수로 선언한 배열의 단어를 넣지 않는 다면 -1이 나온다.
--> 해당 단어가 변수로 선언한 배열에 속해 있는지 알 수 있는 방법
*예) words.indexOf('are') !== -1 / words.indexOf('arm') !== -1
*답) true / false
- function hasElement(*arr*, *element*) {
let isPresent = *arr*.indexOf (*element*) !== -1;
return isPresent;
}
*arr*, *element*은 다른 걸로 대체 가능 (*att*과 *element*는 예시일 뿐이다 헷갈리지 말자.)
* hasElement (배열, 찾으려는 엘리먼트) -> true or false로 나오게 하고 싶음
'Understanding JavaScript' 카테고리의 다른 글
[JS] _TIL_재귀적 사고하기 (0) | 2023.02.13 |
---|---|
[JS] 재귀 함수 (Recursive Function) (0) | 2023.02.12 |
이벤트 위임(Event Delegation)이란 무엇인가? (0) | 2023.01.23 |
[JS] What is Spread Operator, Rest Parameter?(스프레드 연산자, 나머지 매개변수란 무엇인가?) (0) | 2023.01.03 |
[JS] 원시 타입(Primitive type)과 객체 타입(Object type) (0) | 2023.01.02 |