2021_03_09

TIL - 배열, 객체

1. 배열

대량의 데이터를 쉽게 다룰 수 있게 만들어진 데이터 타입
순서를 갖는다.

arr |73| |98| |86| |61| |96|

다음과 같이 숫자 5개가 arr이라는 배열 안에 저장되어 있다고 해보자
배열 안에서는 순서가 매겨진다. 이 순서를 인덱스(index)라고 부르며 1이 아닌 0부터 번호를 매긴다.

따라서 배열 arr의 0번째 인덱스의 값은 73, 3번째 인덱스의 값은 61이다.
또한 인덱스의 값인 73, 61과 같은 숫자들을 요소(element)라고 부른다.

이를 자바스크립트로 표현하면

let arr = [73, 98, 86, 61, 96];
arr[0]; //73
arr[3]; //61

대괄호(square bracket)를 이용해서 배열을 만들고, 각각의 원소(element)는 쉼표(comma)로 구분해준다.
인덱스를 이용해서 배열의 값을 변경해 줄 수도 있다.

let arr = [73, 98, 86, 61, 96];
arr[1] = 100;
arr; // [100,73,98,61,96]

또한 배열안의 요소안에 또다른 배열이 들어갈 수도 있다.

let myNumber = [[13, 30], [73, 8], [44, 17]];	
myNumber[1][0]; //73
myNumber[2][1] //17

배열안에 요소를 추가 또는 삭제할 수 있다.

let arr = [10,20,30,40,50]; //배열 arr 선언 및 할당
arr.push(60); //배열 arr 끝에 60이라는 값 추가 -> [10,20,30,40,50,60]
arr.pop() //배열 arr 마지막 값 삭제 -> [10, 20, 30, 40, 50]
arr.unshift(0); //배열 arr 첫번째 값 추가 -> [0, 10, 20, 30, 40, 50]
arr.shift(); //배열 arr의 첫번째 값 삭제 -> [10, 20, 30, 40, 50]

2. 객체

배열은 각 값이 하나의 변수로 묶여있어 관리하기는 쉽지만 이 경우에는 각 index가 어떤 정보를 갖고 있는지 미리 알아야 한다는 단점이 있다. 또한 index로 접근할 경우 가독성도 떨어지는 경우가 있다. 이러한 단점을 보안하기 위해 의미를 갖는 객체 데이터 타입이 만들어졌다.

let user = {
    firstName: 'Yoo',
    lastName: 'Jiwon',
    email: 'abc@gmail.com',
    city: 'Seoul'
};

자바스크립트에서의 객체는 이와같이 작성한다.
여기서 firstName, lastName과 같은것을 키(key), 'Yoo', 'JIwon'와 같은 것을
값(value) 이라고 하고 키와 값 사이는 콜론(:)으로 구분한다.
따라서 객체는 키와 값 쌍(key-value pair)으로 이루어져있다.

객체의 값을 찾는 방법은 두 가지가 있다.

방법1. Dot notation

user.firstName; //'Yoo'
user.lastName; //'JIwon'

방법2. Bracket notation

user[firstName]; //'Yoo'
user[lastName]; //'JIwon'

그렇다면 배열과 객체는 어떤 차이점이 있는 것일까?
객체와 배열 모두 대량의 데이터를 저장할 수 있다는 공통점이 있지만 배열은 각 인덱스가 순서를 가진다는 점, 객체는 키와 값의 쌍으로 이루어져있어 각각 의미를 가지고 있다는 점에서 차이가 있다.




오늘은 객체와 문자열에 대하여 공부하였다.
내일은 스코프와 클로저에 대해 알아보자.
오늘은 여기까지!