클래스는 연관있는 데이터를 한데 묶어놓는 컨테이너와 같은 역할로 
이름과 나이와 같은 속성이 들어가 있고 말하는 행동, 메소드가 들어가있다.
즉 클래스는 연관이 있는 속성과 메소드가 묶여있는 것을 말한다.
클래스는 붕어빵을 만들 수 있는 틀과 같다. 클래스 자체에는 데이터가 들어가있지 않고 틀만, 템플릿만 정의해놓는다. 그리고 한 번만 선언을 한다.
클래스를 이용해서 실제로 데이터를 만드는 것이 바로 오브젝트이다.
클래스를 이용해서 새로운 인스턴스를 생성하면 오브젝트가 되는 것이다. 클래스는 메모리에 올라가지 않지만 오브젝트는 데이터가 넣어지기 때문에 메모리에 올라간다.
class: template
object: instance of a class
자바스크립트에서는 클래스가 ES6에 추가되었다.
-
클래스 선언
클래스 키워드를 적어주고 클래스명을 적은 뒤 블록안에
컨스트럭터, 생성자를 이용해 오브젝트를 만들 대 필요한 데이터를 전달한다. -
오브젝트 생성
잘 정의 된 클래스를 이용해서 오브젝트를 만들 땐 new 키워드를 쓴다. -
getter & setter
클래스를 사용하는 사용자가, 동료가 잘못사용해도 예를들어 나이를 -1로 넣는다던가 등 방어적인 자세로 만들 수 있게 해주는 것이 getter와 setter이다.
따라서 get으로 age 값을 리턴하고 set키워드로 값을 설정할 있다.대신 set은 값을 설정하기에 값 value를 파라미터로 받아야한다.
age라는 게터를 정의하는 순간 this.age는 메모리에 올라가 있는 값을 읽는게 아니라 get을 호출하게 된다.
세터를 정의하는 순간 this.age = age의 값을 할당할 때 바로 메모리의 값을 할당하는 게 아니라 setter를 호출하게된다. 즉 세터안에서 전달된 value를 this.age할당할 때 메모리에 값을 업데이트하는게 아니라 SETTER를 호출하게 된다. 이렇게되면 무한정으로 세터로 돌아와서 세터를 호출하기 때문에 CALLSTACK이 차게된다.
이를 방지하기 위해
게터와 세터 안에 쓰여지는 변수 이름을 다른 것으로 만들어줘야한다.
이렇게 하면 User클래스ㅎ안엔 세개의 필드가 있는데 firstName lastName
/class 내에 getter 와 setter 가 specifically define 되어있다면, 그 define 되어있는 property 에 한해서 accessor로 작용합니다. 그래서 위에 예제에서 age 에 대한 getter / setter 가 정확하게 define이 되어있기 때문에, 이제 저 "User" object에서의 age를 access 하려고하면 자동으로 JS가 getter / setter를 call 합니다.
/
-
Fields(public & private)
생성자를 쓰지않고 필드를 정의하는 것으로 그냥ㄴ 정의를 내리면 외부에서 접근이되고 #기호를 붙이면 private 필드로 클래스 내부에서만 값이 보여지고 값에 접근이 되고 변경이 가능하지만외부에서는 읽을수도 접근할 수 도 없다. -
static
클래스안에 필드와 메소드는 그대로 복제되어 값만 지정된 값으로 변경되어 오브젝트로 만들어진다. 간혹 클래스가 가지고 있는 고유한 값과 오브젝트의 데이터 값과 상관없이 동일하게 반복적으로 사용되는 메소드가 있을 수 있다 그럴때 static키워드를 붙이면 오브젝트와 상관없이 class자체에 연결되어있다.
static함수를 호출할때도 class이름을 이용해서 호출한다.
보통 오브젝트에 상관없이 공통적으로 class에서 쓰는 것이라면 static과 static메소드를 이용해서 사용하는것이 메모리 낭비를 막아준다.
- 상속과 다형성
상속과 다향성
상속- extends클래스를 이용해서 부모 class에서 연장한 필드와 메소드를 새로운 클래스에 포함시킬수있다.
다형성- 필요한 함수만 재정의해서 , override해서 쓸수있다. super키워드로 부모의 메소드도 호출하고 override하여 새로운 함수도 만들수도 있다.
7.instanceOf
왼쪽에 있는 오브젝트가 오른쪽에있는 클래스로 만들어진 것인지 아닌지 확인하는 것이다.
javascript mdn
JavaScript Reference종류를 묶어서 알려주고 있다.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference
