javascript

5. Object

으누아빠 2020. 6. 23. 13:54
반응형

Object

  • Array는 값들을 묶어주는 역활을 하는 반면 Object 는 각각의 값에 이름을 붙일 수 있음

// Array
const info = ["ilgram", "20", "Gwang Ju"]
  1. 원하는 정보를 가져오는데 어려움이 있음
  2. 즉 이름이나 지역을 가져오고자 할때 info[0],info[2] 형태로 가져올수 있지만 효율적이지 않음

// Object
const info = {
    name:"ilgram",
    age:20,
    gender:"Male",
    area:"Gwang Ju"
}

console.log(info);

// 결과값 : { name: 'ilgram', age: 20, gender: 'Male', area: 'Gwang Ju' }

console.log(info.age);
// 결과값 : 20

console.log(info["age"]);
// 결과값 : 20
  1. Object로 선언된 info의 값을 변경할 수 있음
info.age = 30;

console.log(info.age);

// 결과값 : 30
  1. Object 안에 Array 를 넣을 수 있음
const info = {  
name:"ilgram",  
age:20,  
gender:"Male",  
area:"Gwang Ju",  
friends:["Eun Woo", "Jin Woo", "Se Ok"]  
}

console.log(info);

/*  
결과값 :  
{  
name: 'ilgram',  
age: 20,  
gender: 'Male',  
area: 'Gwang Ju',  
friends: [ 'Eun Woo', 'Jin Woo', 'Se Ok' ]  
}  
*/
  1. Object 안에 Object를 포함한 Array 를 넣을 수 있음
const info = {
  name:"ilgram",
  age:20,
  gender:"Male",
  area:"Gwang Ju",
  friends:["Eun Woo", "Jin Woo", "Se Ok"],
  favFood:[
    {
      name:"kimchi", 
      spicy:true
    }, 
    {
      name:"tomato juice",
      spicy:false
    }
  ]
}
console.log(info);

/*  
결과값:  
{  
name: 'ilgram',  
age: 20,  
gender: 'Male',  
area: 'Gwang Ju',  
friends: [ 'Eun Woo', 'Jin Woo', 'Se Ok' ],  
favFood: [  
{ name: 'kimchi', spicy: true },  
{ name: 'tomato juice', spicy: false }  
]  
}  
*/  

'javascript' 카테고리의 다른 글

7. DOM 변경  (0) 2020.06.24
6. Function()  (0) 2020.06.24
4. Array  (0) 2020.06.23
3. 주석 및 데이터 형  (0) 2020.06.23
2.variable(변수)  (0) 2020.06.22