1_객체 지향 차이점
은닉화
자바나 typescript는 클래스 내부에서만 쓰이는 속성 및 메서드를 구분시키기 위해
private이라는 키워드를 제공한다. 자바스크립트에서는 널리 쓰이지 않는다(지원하는 브라우저가 적다)
class Animal {
private name: string;
constructor(theName: string) {
this.name = theName;
}
}
new Animal("Cat").name; // 사용 불가javascript에서는 은닉화를 돕기 위하여 일반적으로 클로저 모듈 패턴을 사용한다. 클래스/인스턴스 형태로 만들 때는 ES2019부터 #이라는 키워드가 도입되었다.
추상화 기능의 부재
추상화는 인터페이스의 단순화 의미.
자바나 typescript는 interface를 구현해두었다. 하지만 자바스크립트에는 존재하지 않는 기능이다. 인터페이스 사용의 대표적인 예는 API가 있다.
2_프로토타입과 클래스
JavaScript는 프로토타입 기반의 언어이다. 이때 프로토타입은 원형 객체를 의미한다.
class Human {
constructor(name, age) {
this.name = name;
this.age = age;
}
sleep() {
console.log(`${this.name}은 잠에 들었습니다`);
}
}
let kimcoding = new Human('김코딩', 30);
Human.prototype.constructor === Human; //셋 다 true
Human.prototype === kimcoding.__proto__;
Human.prototype.sleep === kimcoding.sleep;배열 클래스 역시 원리가 동일하다. Array.prototype 에는 push,pop 등 다양한 메서드가 있다.
💡
__proto__와 prototype의 차이점function Person(name,first,second){ this.name = name; this.first = first; this.second = second; }Person이라는 객체에서 person의 prototype 객체도 같이 생성이 된다.
Person 객체의 prototype 프로퍼티는 Person의 prototype 객체를 가리키고 Person의 prototype 객체는 constructor 라는 프로퍼티를 생성해 Person 객체를 가리킨다.var kim = new Person('kim',10,20);새로운 객체 kim을 생성해주었다. 새로운 객체를 생성할 때 객체의 프로퍼티와 함께
__proto__프로퍼티가 같이 생성된다.__proto__는 kim이라는 객체를 생성한 person의 prototype 객체를 가르킨다.__proto__는 모든 객체가 가지고 있는 하나의 링크이고, prototype은 함수 객체만 가지고 있는 생성자를 가지는 원형으로 선언할 수 있다.
3_정리💡
- 인스턴스
클래스를 사용하려면 인스턴스를 생성하여 그것을 사용한다.
- 객체
객체는 인스턴스의 다른 용어로(클래스의 실체) 구체적으로 말하자면 인스턴스는 new키워드를 사용해 클래스의 실체를 생성할 때 주로 사용하며, 객체라는 용어는 인스턴스 생성 후 클래스에서 제공하는 프로퍼티와 메서드를 사용할 때 주로 사용한다.
- 프로퍼티
클래스 내부에 만드는 변수
주로 객체 내부에서 사용하는 일반적인 정보와 객체 내부 함수(메서드)에서 처리한 값이 저장된다.
- 메서드
클래스에서 만드는 함수
메서드는 주로 객체의 프로퍼티값을 변경하거나, 알아내는 기능과 클래스를 대표하는 기능이 담기게 된다.
