객체

객체

여러 자료를 다룰 때 사용하는 데이터 타입이다.
배열은 객체를 기반으로 한다.
배열은 인덱스로 각 요소에 접근하는데, 객체는 키로 접근한다는 점이 다르다.

const product = {
  제품명: '건조 망고',
  유형: '당절임',
  성분: '망고, 설탕, 메타중아황산나트륨, 치자황색소',
  원산지: '필리핀'
};

product['제품명']		// '건조 망고'
product.제품명			// '건조 망고'
}

위의 코드처럼 객체의 각 키:값 쌍은 쉼표(,)로 연결해서 입력할 수 있다.
배열처럼 대괄호([])로도 속성에 접근할 수 있지만, 온점(.)으로도 접근이 가능하다.
식별자로 사용할 수 없는 단어를 키로 사용하고자 할 때에는 문자열을 사용하면 된다.

속성과 메소드

배열 내부의 값을 요소라고 표현하지만, 객체는 속성이라고 한다.
배열의 요소와 마찬가지로 객체의 속성도 모든 형태의 자료형을 가질 수 있다.

속성과 메소드의 구분

객체의 속성 중 함수 자료형인 속성을 메소드라고 한다.

메소드 내부에서 this 키워드

메소드 내에서 자기 자신이 가진 속성을 출력하고 싶을 때에는 자신이 가진 속성임을 분명히 표시해야 한다.
자신이 가진 속성이라는 것을 표시할 때 this를 사용한다.

const pet = {
  'name': 'bob',
  'eat': function (food) {
	alert(`${this.name}은 ${food}를 먹습니다.`)
  }
}

pet.eat('밥');

위 코드의 'alert' 내 this.name으로 자기자신이 가진 속성 name인 'bob'을 가져올 수 있다.

동적으로 객체 속성 추가/제거

동적으로 객체 속성 추가

const student = {};
student.name = '홍길동';
student.age = 20;

console.log(student);		// {name: '홍길동', age: 20}

위 코드와 같이 '객체명.키 = 값'으로 속성 추가가 가능하다.

동적으로 객체 속성 제거

delete student.age;

console.log(student);		// {name: '홍길동'}

"delete 객체명.'삭제할 키'"로 속성 제거가 가능하다.

객체의 속성과 메소드 사용

객체 자료형

속성과 메소드를 가질 수 있는 모든 것은 객체이다.
배열, 함수가 객체 자료형에 속한다.
배열은 'Array.isArray()'를 통해 배열인지 아닌지 확인할 수 있다.
함수의 경우 '실행이 가능한 객체'라는 특이 자료이다. typeof 연산자로 확인할 수 있다.
함수는 객체의 특성을 완벽하게 가지고 있어 일급 객체에 속한다고 표현하기도 한다.

기본 자료형

js에서는 실체가 있는 것(undefined, null 등이 아닌 것) 중에서 객체가 아닌 것을 기본 자료형이라고 부른다.
숫자, 문자열, 불이 여기 속한다.
기본 자료형은 객체가 아니므로 속성을 가질 수 없다.

기본 자료형을 객체로 선언하기

'const 객체 = new 이름()'으로 기본 자료형을 객체로 선언할 수 있다.

const numberObj = new Number(10);

typeof numberObj;		// "Object"
numberObj.sample = 100;
numberObj.sample;		// 100
numberObj;				// Number {10, sample: 100}
numberObj + 0;			//10
numberObj.valueOf();	//10

위 코드와 같이 속성을 가질 수도 있고, 기본 자료형과 동일하게 사용할 수도 있다.

기본 자료형의 일시적 승급

사용의 편리성을 위해 기본 자료형의 속성과 메소드를 호출할 때 일시적으로 기본 자료형이 객체로 승급된다.
예를 들면 다음과 같다.

const sample = '샘플문장입니다.'

console.log(sample.length);		// 8

sample은 분명히 문자열인 기본 자료형이지만, 뒤에 '.length'를 붙이는 순간만 잠시 객체처럼 취급된다.