[자바스크립트] Array와 Object 자료형

var car = ['소나타',50000,'white']; //array
var car2 ={name:'소나타',price: 50000}; //object

array는 배열, object는 맵(key:value)이라고 보면 된다.

 

car[0];

car2.price;

이런식으로 값을 꺼내 사용할 수 있다.

 

Array는 순서가 존재해서 인덱싱, 정렬,삽입등이 가능하고

 

Object는 key값으로 value를 뽑을 수 있어 데이터를 보기에 편하다.

 

var car2 ={name:'소나타',price: 50000};
$('.card').html(car2.name +'/'+car2.price);

 이렇게 Object자료형 변수에서 값을 꺼내서 사용할 수 있다.

 

---

var car2 ={name:'소나타',price: [50000,3000,4000]};
$('.card').html(car2.name +'/'+car2.price[1]);

Object나 Array자료형 안에 또 Object,Array등의 자료형을 넣을 수 있다.

 

 

var products = [
    {
        id: 0,
        price: 70000,
        title: 'Blossom Dress'
    },
    {
        id: 1,
        price: 50000,
        title: 'Springfield Shirt'
    },
    {
        id: 2,
        price: 60000,
        title: 'Black Monastery'
    }
  ];

for (let i = 0; i < products.length; i++) {
    $('.card-body h5').eq(i).html(products[i].title);
    $('.card-body p').eq(i).html('가격: ' + products[i].price);

}

상품 설명 등을 써야할 때

Array자료형 변수에서 값을 끌어다가 html에 적어주는 방법도 알아두자.