TIL-006 | JavaScript_객체(Object)

1. 객체(Object)의 정의

• 객체란, 하나의 변수에 key와 value로 구성된 property들을 저장할수 있는 구조이며, JavaScript에서 사용할 수 있는 모든 값이 property값으로 올 수 있다.

2. 객체의 생성

• 중괄호를 이용하여 {...} 객체를 형성 할 수 있으며 여기에 key, value 쌍으로 구성된 property 들을 여러개 포함시킬 수 있다.
• 객체의 생성 방식에는 크게 3가지 정도가 있다.

1) 객체 리터럴 방식(Object Literal)
: 변수와 동일한 방법으로 객체를 생성하는 방식

let myself = {
  name: 'Chankyu Lee',
  location: {
    country: 'South Korea',
    city: 'Bundang'},
  age: 20,
  dogs: ['개', '강아지']
  }

2) 생성자 방식(Constructor)
: new 키워드를 이용해 단일 객체 선언 방식으로 객체를 생성하는 방식이다.

let myself = new Object(); 
myself.name = 'Chankyu Lee'; 
myself.location = {country: 'South Korea', city: 'Bundang'};
myself.age = 20;
myself.dogs = ['개', '강아지'];

3. 객체의 특징

• 객체는 각각의 key/value에 대한 정보를 나열할 수 있다.
• 변수는 선언시 예약어와 동일한 이름을 가질 수 없지만 객체는 가능하다.
• key 값으로는 문자열 또는 기호가 가능하며 value 값으로는 함수를 포함하여 모든 자료형이 허용된다.
• property값이 함수일 경우 일반함수와 구분하기 위하여 메소드 라고 부른다.
• 배열과는 달리 객체는 property를 나열할 때 순서가 정해져 있지 않다.
• 객체 변수를 복사하면 참조값이 복사되고 객체가 복제되지 않는다. 참조값은 객체의 주소를 가리키는 값이다.

4. 객체 property 접근방법

• 객체의 property 접근법에는 Dot Notation과 Bracket Notation 2가지가 있다.
• Dot Notation vs Bracket Notation

//객체

let myself = {
  name: 'Chankyu Lee',
  location: {
    country: 'South Korea',
    city: 'Bundang'},
  age: 20,
  dogs: ['개', '강아지']
  }

1) Dot Notation

// 예시

myself.name // 'Chankyu Lee'
myself.location // {country: 'South Korea',city: 'Bundang'}
myself.age // 20
myself.dogs // ['개', '강아지']

let mydogs = 'dogs';
myself.mydogs // undefined

• Dot Notation 방식은 변수에는 접근하지 않고 property에만 접근하려는 속성이 있다. 위의 예시 코드에서 myself.mydogs 입력시 mydogs 라는 key 값을 찾으려고 하는 것!

2) Bracket Notation

//예시

myself['name'] // 'Chankyu Lee'
myself['location'] // {country: 'South Korea',city: 'Bundang'}
myself['age'] // 20
myself.['dogs'] // ['개', '강아지']

let mydogs = 'dogs';
myself[mydogs] // ['개', '강아지'], 

• Bracket Notation에서는 변수를 통한 객체 접근이 가능하며, 위의 예시코드에서 myself[mydogs]를 통해 'dogs'라는 property 를 찾아가는 것이다.