25. array, object

fe.syhan·2023년 10월 31일

JS 기초

목록 보기

22/52

var car = '소나타';
var carPrice = 50000;
var carColor = 'white';

여러 데이터들을 변수에 저장해야 한다면,

일일히 변수에 저장해도 되지만 자료가 수십개면 변수도 그만큼 늘어 나게 된다.

이럴 때 한 변수에 여러개의 자료를 저장하기 위한게 배열 자료형이다.

여러가지 자료를 한 곳에 저장하고 싶을 때 사용하는 자료형이다.

var car = ['소나타', 50000, 'white'];

대괄호를 열고 자료를 콤마로 구분해서 집어 넣으면 여러 자료를 엑셀 처럼 관리가 가능하다.

배열 자료에서 데이터를 뽑을 땐,

console.log(car[1]);
// 50000

대괄호를 뒤에 붙여 [x]라고 쓴다. 이 때 x번 째 자료를 출력해 준다.\

자료의 수정

car[1] = 60000;
console.log(car[1]);
// 60000

console.log(car[3]);
// undefined

car[3] = '새로운값';
console.log(car[3]);
// 새로운값

배열자료를 수정하고 싶을 땐 등호를 사용하고 새롭게 자료를 추가할 수 도 있다.

배열자료형과 마찬가지로 여러가지 자료를 한 곳에 저장할 수 있는 자료형.

var car2 = {name: '소나타', price: 50000};

중괄호를 열고 자료를 콤마로 구분해서 집어넣는다.

이 때, 자료의 왼쪽에 자료의 이름을 붙여 저장한다.

object 자료형은 key : value 의 형태로 저장한다.

자료의 사용

console.log(car2['name']);
// 소나타

console.log(car2.name);
// 소나타

자료의 수정, 추가

car2['name'] = '그랜저';

console.log(car2['name']);
// 그랜저

배열과 마찬가지로 등호를 이용해 수정과 값의 추가가 가능하다.

차이점1

상품명, 가격, 연식, 색상, 옵션여부, 카드할인여부 등등…

var car = ['소나타', 50000, 2030, 'white', false];

위 데이터들을 array에 저장한다면, 저장 당시엔 간단하겠지만 자료를 사용할 때 , ‘가격 자료가 몇 번째 위치에 있었지?’ 같은 어려움을 겪을 수 있다.

var car = { name : '소나타', price : 50000, year : 2030 };

object로 저장한다면, 저장은 귀찮지만 데이터를 사용할 때, ‘가격의 key 이름이 뭐였지’를 기억하면 된다.

차이점2

object는 순서개념이 없다.

array는 순서개념이 있어서 왼쪽에 위치할수록 더 앞에 있는 자료이다.

순서 개념이 있는 array는 순서개념이 필요한 많은 것들을 할 수 있다.