객체(인스턴스)
•
다양한 타입의 값을 하나의 단위로 구성한 복합적인 자료구조
•
원시타입은 수동적인 값, 객체는 능동적인 값
•
객체는 0개 이상의 프로퍼티(property)로 구성된 집합
•
JS 함수는 일급 객체로 값으로 취급
프로퍼티 & 메서드
var count = {
num: 0, // 프로퍼티
increase: function() { // 메서드
this.num++;
}
};
Plain Text
복사
•
num:0 : num은 프로퍼티 키, 0은 프로퍼티 값이다.
•
increase : 객체안에 있는 함수
객체 리터럴에 의한 객체 생성
JS 객체 생성방법
•
객체 리터럴
◦
사람이 이해할 수 있는 문자 또는 약속된 기호를 사용하여 객체 값을 생성하기 위한 표기법
•
Object 생성자 함수
•
생성자 함수
•
Object.create 메서드
•
클래스(ES6)
프로퍼티
•
객체의 상태를 나타내는 값(data)
객체는 프로퍼티의 집합이며, 프로퍼티는 키와 값으로 구성
•
구조
◦
프로퍼티 키: 빈 문자열을 포함하는 모든 문자열 또는 심벌 값(식별자 네이밍 규칙을 따르지 않는 프로퍼티 키는 따옴표로 묶어서 사용)
◦
프로퍼티 값: 자바스크립트에서 사용할 수 있는 모든 값
•
특이사항
•
빈 문자열을 프로퍼티 키로 사용할 수 있지만 키로서 의미X --> 사용 권장 X
•
예약어 또한 프로퍼티 키로 가능하지만 예기치않은 에러가 발생할 수 있으므로 권장 X
•
문자열이나 심볼 값 이외의 값은 문자열로 암묵적 타입변환
(숫자 리터럴 -> 따옴표는 안 붙는데 내부적으로 문자열로 변환)
•
프로퍼티 중복 선언시 나중 선언한 프로퍼티가 덮어씀
프로퍼티 접근법
•
마침표 프로퍼티 접근 연산자를 사용하는 마침표 표기법(person.name)
•
대괄호 프로퍼티 접근 연산자를 사용하는 대괄호 표기법(person['name'])
프로퍼티 값 갱신
•
기존에 객체 안의 프로퍼티에 새로운 프로퍼티 값을 할당하면 새롭게 갱신 가능
프로퍼티 동적 생성 & 삭제
•
기존 객체에 없는 프로퍼티라도 새로 객체에 프로퍼티를 할당해주면 동적으로 생성되고 값이 할당됨.
•
delete 연산자를 사용하여 객체의 프로퍼티를 삭제
◦
존재하지 않는 프로퍼티를 삭제하면 아무런 에러 없이 무시
var coins = {
coin1 : 'Bitcoin',
};
// coins 객체는 coin2객체가 존재하지 않음
// 따라서 coins객체에 coin2 프로퍼티가 동적으로 생성되고 값이 할당된다.
coins.coin2 = 'Ethereum';
console.log(coins); // {coin1: 'Bitcoin', coin2: 'Ethereum'}
delete coins.coin2; // coin2 프로퍼티 키 삭제
delete coins.coin4; // 에러가 발생X
console.log(coins) // {coin1: "Bitcoin"}
JavaScript
복사
프로퍼티 축약 표현
•
변수 이름과 프로퍼티키가 동일한 이름일 때 프로퍼티키 생략 가능
let x = 1, y = 2;
const obj = { x, y };
console.log(obj); // { x: 1, y: 2}
JavaScript
복사
계산된 프로퍼티 이름
프로퍼티 키를 동적으로 생성하는 것
var prefix = 'prop';
var i = 0;
var obj = {[`${prefix}-${++i}`]: i}; // 객체 리터럴
obj[prefix + '-' + ++i] = i;
console.log(obj); // {prop-1: 1}
JavaScript
복사
메서드
•
프로퍼티(상태 데이터)를 참조하고 조작할 수 있는 동작(behavior)
•
객체에 묶여 있는 함수.
•
프로퍼티 값이 함수인 것(일반 함수와 구분하기 위해 메서드라는 이름을 가짐)
메서드 축약 표현
// es5
var obj = {
sayHi: function() {
console.log('Hi ');
}
}
// es6
var obj = {
sayHi() {
console.log('Hi ');
}
JavaScript
복사