객체(Object)
- 자바스크립트의 기본 타입(Data type)은 객체(Object)이다.
- 객체는 key와 value가 한 쌍으로 구성된 프로퍼티(Property)가 0개 이상인 정렬되지 않은 집합이다.
- 프로퍼티의 값으로 함수가 올 수도 있다 -> 이런 프로퍼티를 메소드(method)라고 부른다.(실제 메소드X)
- 숫자, 문자열, 불리언, undefiend 타입을 제외한 모든 것이 객체
- Primitive(숫자, 문자열, 불리언) 타입은 값이 정해진 객체로 취급되어, 객체로서의 특징도 가지게 된다.
- JSON 객체를 표현하기 위한 표준 중 하나이다.
- Property Key, Property Value
- 인스턴스(Instance) : 객체가 메모리에 저장되어 실제로 존재하는 것
프로퍼티(Property)
- key와 value으로 구성된 집합
(1) 프로퍼티 키(Property Key)
- 프로퍼티 값에 접근할 수 있는 이름
- 식별자 역할
- 식별자 네이밍 규칙을 따르지 않아도 되지만, 그렇게 되면 따옴표를 사용해주어야 하기 때문에 따르는 것이 좋다.
- 문자열, Symbol
ex. {'let': '문자열이지만, 권장되지 않는 키 네임'}
ex. let obj = {name: 'hong', name: 'kim'} -> console.log(obj)에서 kim 출력
ex. let obj = {name: 'hong'} -> console.log(obj.address) 찾는 key가 없기 때문에 undefined 출력
(2) 프로퍼티 값(Property Value)
- 자바 스크립트에서 value으로 인식되는 모든 것이 다 가능하다.
- 문자열, 숫자, 함수(function)
- 함수도 가능하다.(메소드라고 부르긴 하는데 실제 메소드는 X)
프로퍼티 동적 추가
- 점 표기법(Dot Notation) ->
- 괄호 표기법(Bracket Notation) -> []
프로퍼티 동적 삭제
- delete keyword
프로퍼티 접근
- 대괄호 프로퍼티 접근 연산자를 사용 할 경우, 프로퍼티 키를 반드시 따옴표로 감싸주어야 한다.
- 감싸지 않는 경우, 자바스크립트 엔진이 프로퍼티 키를 식별자로 해석하기 때문
객체 생성 방법
1. 객체 리터럴 (Object Literal)
- 가장 간단한 방법 {} 사용
- 단점은 똑같은 객체를 여러 개 만들어야 한다.
- 변수가 할당되는 시점에 엔진이 객체 리터럴을 해석해서 객체 생성
2. Object() 객체 생성자 함수
- 자바스크립트 내장 함수
- Object 객체는 자바스크립트의 최상위 객체이다.
- 자바스크립트의 모든 기본 내장 객체는 Object 객체를 기본으로 만들어진다.
3. 생성자 함수(User Defined)
- 함수를 통해서 객체를 생성하는 방식
- 객체를 만들 때마다 프로퍼티에 대한 공간이 메모리에 할당되어서 비효율적
- 일반 함수와 생성자 함수를 구분하기 위한 일반적 약속
- 일반 함수 : 첫글자(소문자)
- 생성자 함수 : 첫글자(대문자)
4. Object.create() method
5. ES6 -> class
객체 리터럴 확장 방식
- ES6에서 추가
User Define(사용자 정의) 생성자 함수로 객체 생성
const person1 = Person();
console.log(person1); // undefined
const person2 = new Person(); // new를 붙여서 생성자 함수로 호출 -> 내부적으로 Instance를 만든다
console.log(person2); // Person {}
const person3 = {}; // 일반 객체
console.log(person3); // {}
// new 생성자 함수로 호출
// 내부적으로 Instance를 만들어준다.
// 안에 아무거나 없으면
// this를 바인딩해서 this를 리턴해준다.
'프로그래밍 > JS' 카테고리의 다른 글
| [JavaScript] 자바스크립트 함수, 함수 정의방법(선언문, 표현식, 화살표) (0) | 2022.07.05 |
|---|---|
| [JavaScript] 원시 값과 객체, 유사 배열 객체 (0) | 2022.07.05 |
| [JavaScript] var, let, const 자바스크립트 변수, 템플릿 문자열 (0) | 2022.07.05 |
| [JavaScript] 변수, 식별자(Identifier), undefined, execution context, 호이스팅 (0) | 2022.07.04 |
| [JavaScript] TypeScript, Node.js, NPM (0) | 2022.07.04 |
