객체 (Object)

{ key : value } 형식으로 속성(property)을 저장하는 컨테이너
* 참조 타입

(1) 객체 구성

객체는 크게 속성(프로퍼티), 메소드로 구성됩니다.

• 속성(Property): 모든 객체는 속성(Property)을 가지며, 여러 정보를 담고 있고 선택적임.
• 메소드: 객체의 동작과 관련된 것 (속성이 함수인것..!)

(2) 객체 생성

1. Object() 생성자 함수

: 생성자 함수로 객체를 생성할 때는 반드시 new 연산자를 같이 써야한다.

var myObject = {name: '너의이름은'}

var exObj = new myObject();

2. 객체 리터럴

: 객체를 쉽게 정의할 수 있도록 디자인된 표기법 (Object() 빌드인생성자함수 축약표현)
 중괄호 { } 를 이용해서 객체를 생성, 데이터를 쉼표 ","로 구분

var exObj2 = { name: ‘jaen’, job: ‘developer’}

🧐 생성자 함수 vs 객체리터럴

1. 객체 리터럴은 같은 형태의 객체를 재생성할 수 없다.

2. 프로토타입 객체(부모 타입 [[prototype]])가 다르다. :: 객체 생성 규칙
   2.1 생성자 함수 : 생성자 함수의 property 객체를 참조
   2.2 객체리터럴 : Object.prototype를 참조

 

(3) 객체 다루기

1. 읽기 / 쓰기

• 마침표 표기법 : . 를 통해 key 추가

var commaObj = {};	//담을 객체 먼저 생성!!!
commaObj.music = "If i can't have you";
console.log(commaObj);	// {music: "If i can't have you"}

• 대괄호 표기법 : 대괄호 [ ] 안에 문자열 형식(string) key 추가
  (key 명칭이 표현식 또는 예약어일 경우 활용)

var squareObj = {};	
squareObj["music-pop"] = "How do you sleep";
console.log(squareObj["pop-music"]);	// "How do you sleep"
console.log(squareObj.pop-music);	//Uncaught ReferenceError: pop is not defined or NaN (-연산자)

2. 삭제하기

• delete 연산자를 활용하여 속성(프로퍼티) 삭제 (~객체 자체 삭제 불가~)

var delObj = {mind: "hello", age: null};
delete delObj.age;	// {mind: "hello"}

3. 비교하기

객체 값을 비교할 때 참조값을 비교한다는 것에 주의 해야한다.

let a = 'ab', b = 'ab';
let objA = {oba: 'oba'}, objB = {obb: 'obb'};
let objC = objA;

a == b;			//true
objA == objB;	  //false
objA == objC;	  //true

(4) 객체 관련 메소드

• Object.create()
  객체를 생성하는 메서드 (*생성자함수 호출하지 않고 프로토타입만 추가)
  - 매개변수 : 새로 만든 객체의 프로토타입이어야 할 객체

//생성자 함수
function Person (pName) {
	this.name = pName;
};
function Me(){
	this.hobby = 'develop';
}
Me.prototype = Object.create(Person.prototype); // 상속

• Object.keys(), Object.values()
  객체 내 정의된 키, 값들을 하나의 배열로 모아 본다.

let obj = {name: "jaen", job: "developer", year: 2020}
Object.keys(obj);		//["name","job","year"]
Object.values(obj);	  //["jaen","developer",2020]

• Object.assign()
  객체 속성을 복사할 때 사용되며 대상 객체를 반환한다.

let obj = {name: "jaen", date: 31}
let obj2 = {date: 27}
let obj3 = Object.assign({},obj,obj2);	//obj3: {name: "jaen", date: 27}, obj: {name: "jaen",date: 31}, obj2: {date: 27}
let obj4 = Object.assign(obj,obj2);	//obj4: {name: "jaen", date: 27}, obj: {name: "jaen", date: 27}, obj2: {date: 27}

• hasOwnProperty()
  객체 내 검색한 명칭의 키가 있는지 확인합니다.

let obj = {name: "jaen", job: "developer", year: 2020}
obj.hasOwnProperty('job');		// true
obj.hasOwnProperty('age');	    // false

 

(5) 프로토타입 객체

객체의 부모 역할하는 객체 === "프로토타입"

모든 객체는 자신의 부모 역할을 하는 객체(숨겨진 프로퍼티)와 연결되어 있다.

(6) Object.prototype 객체 : 모든 객체의 *최종 프로토타입

• Object.toString()
• Object.valueOf()
• Object.create()
  : 프로토타입을 추가하면서 객체 생성하는 메소드

var obj = {};
//Object.create(prototype,{key…}:: 속성들) : 객체를 생성하는 메소드
var obj2 = Object.create(obj,{
  inO1: {	
    writable: false,		//writable: 속성 값 수정 가능 여부
	enumerable: false,	//enumerable :: 열거 가능 여부 (for-in 반복문 내 사용가능하는지)
	configurable: false,	//configurable: 속성 설명 변경 가능여부 :: 속성 재정의 X
	value : 5
  },
  inO2 : {
	enumerable: false,	//enumerable :: 열거 가능 여부 (for-in 반복문 내 사용가능하는지)
	configurable: false,	//configurable: 속성설명 변경 가능여부 :: 속성 재정의 X
	get: function () {return ‘inner object’},
	set: function (param) {this.inO1 = param}
  }
})

obj2.inOb1, obj2.inOb2;	//5 'inner object’
obj2.inOb1 = 3;  //But, value: 5 (becasue writable was false)
obj2.inOb2 = ‘wow';  //'inner object’ > 'set' method >(inObj1 : 5 :: writable)

Object.defineProperty(obj2, ‘inO2’, {value : ‘Yeah’})	//no change ( configurable was false_ :: 속성의 설명을 재정의 X

• Object.freeze() : 객체 전체 변경 ❌
• Object.seal : 객체 속성 추가, 삭제 X, 자동으로 configurable: false 로 변경
• Object.preventExtensions: 속성 추가만 ❌

---

부록

1. 연산자

(1) 동등연산자 (==) vs 일치 연산자 (===)

• 동등연산자 ==

  	피연산자의 값을 비교합니다.(타입이 다를 경우 타입변환 거치고..)

• 일치연산자 ===

  	피연산자의 타입까지 비교합니다. (타입변환 ❌)

1 == '1';		 //true
1 === '1';		//false

(2) !!연산자

피연산자를 불린값으로 강제 변환하는 것

!!'1';	//false
!!0;	  //true

2. 유사배열객체

lenght 속성을 가지는 객체이다..! (배열 아니고 객체!!!)
객체임에도 불구하고 배열 표준 메소드 사용 가능 (push, pop...)