[모던 자바스크립트 Deep Dive] 10장 - 객체 리터럴

🎉 객체 리터럴

자바스크립트는 프로토 타입의 객체 기반의 프로그래밍

• 객체지향 프로그래밍 : 객체의 집합으로 프로그램을 표현하려는 프로그래밍 패러다임

😉 객체

자바를 구성하는 거의 “모든 것”이 객체이다.

• 원시 값을 제외한 나머지 값(함수, 배열, 정규 표현식 등)은 모두 객체이다.
  • 원시 타입은 단 하나의 값만 나타내며, 원시 타입의 값, 즉 원시 값은 변경 불가능한 값이다.
• 객체 타입은 다양한 타입의 값(원시 값 또는 다른 객체)을 하나의 단위로 구성한 복합적인 자료구조이다.
• 객체 타입의 값은 변경 가능한 값이다.

프로퍼티와 메서드로 구성된 집합체

• 프로퍼티 : 객체의 상태를 나타내는 값(data)
• 메서드 : 프로퍼티(상태 데이터)를 참조하고 조작할 수 있는 동작(behavior)

🎁 프로퍼티와 메서드를 통해 상태와 동작을 하나의 단위로 구조화 할 수 있어 유용하다.

🐱‍🐉 프로퍼티

• 객체는 프로퍼티의 집합이며, 프로퍼티는 키와 값으로 구성된다.

  • 이미 존재하는 프로퍼티 키를 중복 선언하면 나중에 선언한 프로퍼티가 먼저 선언한 프로퍼티를 덮어쓴다. 이때 에러가 발생하지 않으니 주의하자!

• 자바스크립트에서는 모든 값은 프로퍼티 값이 될 수 있다.

var person = {
  name: "lee", // 프로퍼티
};

console.log(person); // {name : 'lee}

delete person.name; // 프로퍼티 삭제
console.log(person); // {}

person["prop" + "_" + 1] = "test"; // 계산된 프로퍼티 이름
console.log(person); // {prop_1: 'test'}

프로퍼티 키의 생략
let x = 1,
  y = 2;

let obj = {
  x: x,
  y: y,
};

let obj = { x, y }; // 이렇게 축약해서 많이 사용  참고 -> let [name, address] = ["Choi", "Seoul"];

🐱‍🐉 메서드

• 자바스크립트 함수는 일급 객체임으로 값으로 취급할 수 있다.
  • 함수도 프로퍼티 값으로 사용가능 -> 메서드(프로퍼티의 값이 함수일 경우)
  • 일급 객체 : 일급 객체(영어: first-class object)란 다른 객체들에 일반적으로 적용 가능한 연산을 모두 지원하는 객체

메서드의 축약 표현
let = obj {
  name : 'Lee',
  sayHi : function() {
  console.log('Hi! ' + this.name);
  }
 };

 obj.sayHi();
let = obj {
  name : 'Lee',
  sayHi () {
  console.log('Hi! ' + this.name);
  }
 };

😉 객체 리터럴에 의한 객체 생성

• 자바스크립트는 프로토타입 기반 객체 지향 언어로서 다양한 객체 생성 방법을 지원한다.
  • 객체 리터럴 (가장 일반적이고 간단한 방법)
  • Object 생성자 함수
  • 생성자 함수
  • Object.create 메서드
  • 클래스(ES6)

🐱‍🐉 객체 리터럴

객체를 생성하기 위한 표기법이다.

• 리터럴(literal)은 사람이 이해할 수 있는 문자 또는 약속된 기호를 사용하여 값을 생성하는 표기법

• 자바스크립트의 유연함과 강력함을 대표하는 객체 생성 방식이다.

중괄호{...} 내에 0개 이상의 프로퍼티를 정의한다.
  var person = {
    name : 'lee', // 프로퍼티

    sayHello : function(){ // 메서드
      console.log(`Hello! My name is ${this.name}).`}
 	 	}
  };

  console.log(typeof person); //object
  console.log(person); // {name : 'lee', sayHello : function ...}

만일 중괄 호 내에 프로퍼티를 정의하지 않았다면 빈 객체가 생성된다.
  var emapty = {}; //빈 객체
  console.log(typeof empty); //object