[JavaScript] 배열의 기초

오늘은 JavaScript 문법 중 배열을 다뤄보았다. 

 

배열의 기초와 배열의 내장 함수들을 가볍게 공부해봤는데 이를 이용해서 문제를 풀려니 어려웠다. 

 

그래서 오늘 내가 알게 된 것들을 정리하려고 한다.

 

배열이란 순서가 있는 값들을 뜻한다. 순서는 Index로 0부터 시작한다.

 

let num = [1, 2, 3, 4, 5];
console.log(num[3]); // 2

// 문자열과 다르게 재할당 가능
num[3] = 6;
console.log(num[3]); // 6

// 물론 string을 넣어도 되고 객체를 넣는 것도 가능하다.
let animals = ['cat', 'dog', 'elephant', 'Lion'];
console.log(animals[2]); // dog

let myObj = [{myNum: 1}, {myNum: 2}, {myNum: 3}];
console.log(myObj[0]); // {myNum: 1}

 

이렇게 배열을 이용하면 다양한 값들을 넣을 수 있다. 

 

또한 반복문에서도 용이하게 사용된다.

 

for(let i of myObj){
console.log(i); 
} 
// 차례로 출력
// {myNum: 1}
// {myNum: 2}
// {myNum: 3}

 

그리고 배열에서 반복문을 이용할때 인덱스도 중요한데 만약 맨 뒤의 인덱스를 얻고 싶다면 -1을 넣으면 된다. (이것은 slice와 같이 배열의 인덱스를 이용해서 잘라야 할 때 용이하다.)

 

// 만약 배열의 맨 뒷 요소를 제외하고 출력하고 싶은데 마지막 index를 모를 경우 
console.log(myObj.slice(0,-1));
// 0: {myNum: 1}
// 1: {myNum: 2}

또한 배열의 내장함수를 다루다가 신기한 점을 발견했는데 

 

concat을 이용해서 배열 + 배열 을 붙이는데 배열 + 변수 역시 가능하다는 것이다.

그리고 concat을 사용할 때의 주의점은 기존의 배열을 변경하는 것이 아닌, 새로운 배열을 반환하기 때문에 꼭 새로운 배열을 선언해줘서 거기에 대입해줘야 한다는 것이다!! (이거 때문에... 배열이 안 합쳐져서.. 한참을 고생했다.. ㅠㅠ)

let myList1 = [1, 2, 3];
let myList2 = [4, 5, 6];
let myList3 = myList1.concat(myList2);
console.log(myList3); // [1, 2, 3, 4, 5, 6]
console.log(typeof myList3); // object


let myList1 = [1, 2, 3];
let myNum = 4;
let myList3 = myNum.concat(myList);
console.log(myList3); // [1, 2, 3, 4]
console.log(typeof myList3); // object

 

그리고 push()와 pop()을 통해 요소를 넣고 빼는 것이 가능하다.

 

let test1 = [1, 2, 3];
test1.push(5); // 배열의 맨 끝에 추가
console.log(test1) // [1, 2, 3, 5]

test1.pop(); // 배열의 마지막 요소 삭제
console.log(test1) // [1, 2, 3]

 

또 여담이지만.. 배열을 아예 새롭게 선언해서 복사하고 싶다면.. (배열을 복사하면 주솟값이 같아 진다.)

let num1 = [1, 2, 3];
let num2 = num1;

num2.push(4); // num1과 num2 모두 끝에 요소가 추가됨.
console.log(num1); // [1, 2, 3, 4]
console.log(num2); // [1, 2, 3, 4]

let num3 = num1.slice(0);
num3.push(5); // 새로운 배열 num3에만 끝에 요소 추가됨.
console.log(num1); // [1, 2, 3, 4]
console.log(num3); // [1, 2, 3, 4, 5]

 

새로운 배열에 원래의 배열 값을 복사하는데 새로운 배열값을 변경해도 원래의 배열 값을 유지하고 싶다면 이런 식으로 해도 된다는걸 알게되었다.. ( let num3 = num1.concat() 이런식으로 써도 새로운 배열이 된다. )

 

 

자바스크립트는 알면 알수록 신기한 것 같다.. 잊지 말아야지..