자바스크립트 객체

자바스크립트 객체란?

객체는 프로퍼티로 이루어진 집합이다.
프로퍼티는 key, value로 구성된다.

자바스크립트에서 사용할 수 있는 모든 값은 프로퍼티 값이 될 수 있다. 함수도 프로퍼티 값으로 사용할 수 있는데, 이를 일반 함수와 구분을 위해 메서드라고 한다.

let counter = {
	num: 0,					# 프로퍼티
    increase: function () { # 함수 프로퍼티, 즉 메소드.
    	this.num++;
    }
}

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

• 프로퍼티 키는 문자열타입이며 문자열타입이 아닌 다른 타입을 넣을 경우 문자열로 변환됨
• 프로퍼티 키를 중복선언하면 나중에 선언한 프로퍼티가 덮어씌워지고 에러가 발생하지 않는다. 주의.

프로퍼티 접근방식

person.name; 마침표 표기법 접근
person.['name'] 대괄호 표기법 접근

대괄호 프로퍼트 접근의 경우 내부에 키를 반드시 따옴표로 감싸주어야함
아니면 undefined 를 출력하고 Reference error를 발생시키지 않음..

프로퍼티 동적 생성, 삭제

let person = {
 	name: 'bum' 
}

person.age = 20;
console.log(person); // {name: 'bum', age:20}

delete person.age; // 삭제
delete person.address; // 존재하지 않는걸 삭제해도 에러가 발생하지 않음

es6에서 추가된 부분

• 프로퍼티 축약 표편

let x= 1, y=2;

const obj = {x, y}; // 키와 값이 같을 경우 키를 생략해도 된다.

• 계산된 프로퍼티 이름

const prefix = 'hello';
const obj = {
	[`${prefix}-${++i}`]
  	[]
};
// {hello-1 : 1, hello-2 : 2, hello-3 : 3}

• 메서드 축약 표현

var obj = {
  sayHi: function(){
    console.log('hi');
  }
}

// es6
var obj = {
  sayHi() {
    console.log('hi');
  }
}

obj.sayHi()

위 하래는 함수가 다르게 동작하는데 이는 나중에 살펴보도록한다.

원시 값과 객체의 비교

원시 타입의 값: 변경 불가능. immutable value. pass by value. 다른 변수 할 당시 다른 값이 복사되어 전달.
객체 타입: mutable value. pass by reference 참조값이 복사되어 전달.

상수 : 재할당이 금지된 변수

문자열 : 원시타입

let str = 'Hello';
str = 'world';

hello, world 둘 다 메모리에 존재하게 됨. 참조하는 참조값이 변경

유사 배열 객체

마치 배열처럼 인덱스로 프로퍼티 값에 접근 할 수 있고 length 프로퍼티를 갖음. for 문으로 순회도 가능하다.

var str = 'string';

str[0] = 'A';
console.log(str) // string

문자열은 유사 배열이기에 배열과 유사하게 인덱스로 접근 가능. 하지만 문자열은 원시값이기에 변경이 안됨.
예기치 못한 변경으로부터 자유롭기에 데이터의 신뢰성을 보장함.
변경하려면 재할당해야함.