Object()

객체 - Object()

• 중괄호({}) 안에 속성(key 또는 property)과 값으로 구성된 요소들의 모임

  일반적인 형태 → { property: value }

• 다른 타입의 값들도 섞어서 넣을 수 있다.

  let obj = { name: 'Steve', age: 20 }

• 공백도 들어갈 수 있다.

• 새로운 객체 만드는 법

  • new Object();
  • {};

객체의 구조 이해하기 { property: value }

1.객체 속성(property)

1) 객체 속성

• 흔히 property 로 많이 부르며, key 또는 keyname 으로도 부른다.
• 소분류의 개념으로 보면 좋다.

---

2) 객체 속성(property) 조회하는 법

• Object.keys(객체명)[인덱스값]
  : 속성명(property name)을 보고 싶을 때 사용가능

      // 객체의 속성을 보고 싶을때는?
      let obj = { name: 'Steve', age: 20 };

      Object.keys(obj)[0];
      > 'name'

---

3) 객체 속성값(Value) 조회하는 법 - Property Accessors - MDN

• Dot notation
  • object.property_name
  • 정적인 속성 표현 시, 적합하다.

• Bracket notation

  • object['property_name']
  • 동적인 속성 표현 시, 적합하다.

• 객체[ Object.keys(객체명)[인덱스값] ]
  

    // 속성값 보기
    let obj = { name: 'Steve', age: 20 };

    obj.name;
    obj['name'];
    obj[ Object.keys(obj)[0] ];
    // 위 3가지 방법 모두 속성값을 표현한다.
    > 'Steve'

Method

1.객체 추가, 삭제하는 법

1) 요소 추가

• obj['new_property_name'] = value;
• obj.new_property_name = value;

    let obj = { name: 'Steve', age: 20 };

    obj.hobby = "drawing";
    obj['like'] = "pizza";

    obj;
    > { name: 'Steve', age: 20, hobby: "drawing", like: 'pizza' }

---

2) 요소 삭제

• delete obj.property_name

    let obj = { name: 'Steve', age: 20 };

    delete obj['like']

    obj;
    > { name: 'Steve', age: 20, hobby: "drawing" }

---

2.객체 속성의 존재 여부 확인하기

• hasOwnProperty()
  • Boolean 값으로 결과값 반환

//빈 객체에 키가 없으면 값 넣어주기
let newArr = {};
if ( newArr.hasOwnProperty('') === false ) { newArr.name = 'Jun'; }
newArr;
>{name: "Jun"}

• property_name in obj
  • for ... in문

---

3.객체 속성의 개수 파악하기

• Object.keys(객체명).length
  : 객체의 속성 개수 리턴

    let person = 
    {firstName: "Jade", lastName: "Smith", fullName: "Jade Smith"};

    Object.keys(person).length
    > 3

---

4.객체 안에 속성값 2개를 합친 하나의 속성과 값 넣기

    // obj 객체 안에 있는 firstName 의 속성값과 lastName 의 속성값을
    // 띄어쓰기 하나만 둔 fullName 속성값으로 할당한다
    let obj = 
    { firstName: "Jade", lastName: "Smith" };

    //방법1
    obj.fullName = obj.firstName + ' ' + obj.lastName;

    //방법2
    obj.fullName = `${obj.firstName} ${obj.lastName}`

    obj;
    > {firstName: "Jade", lastName: "Smith", fullName: "Jade Smith"}

---

5.객체 안에 함수(function) 넣어보기

    let newSum = { a: 'new', sum: function(x){ return x = x+1;  } };

    let x = 10;

    newSum.sum(x);
    > 11

Deep study

• window
  전역범위를 대표하는 객체
  Global Scope에 선언된 함수 그리고 var 키워드로 선언한 변수는 window 객체와 연결될 수 있다.

var myN = 'Jenny'
 console.log(window.myN); // Jenny
 // window 라는 객체 안에 myN이란 속성과 그 값인 Jenny 이 할당되어있다.

※ 전역범위에 너무 많은 변수를 선언하지 않도록 주의!