1 분 소요

오늘 한 일

  • class의 field 부분의 접근제어자 역할
  • class의 getter, setter
  • class의 extends

Class의 Field

constructor(생성자) 위에 작성하며 constructor에 초기확 값에 같은 내용이 있다면 생략해주는 게 일반적이다. Field의 중요한 포인트는 접근제어자 역할을 수행한다는 것이다.

const apple = new Fruit(apple, ‘🍎`);
apple.name = ‘오렌지’;

이렇게 외부에서 마음대로 수정할 수 없도록 외부에서 접근이 불가능 하고자 하는 키워드 앞에 #을 적어주어야 한다. #을 적어주면 다른 언어에 있는 private역할을 수행하며 외부에서 # 이 걸린 키워드를 수정하려고 시도하면 수정도 안되고 접근도 안된다. field의 접근제어자 기능은 class 내부에서만 수정이 가능하기 때문이다. class의 인스턴스로 만들어진 객체에도 #이 적힌 키워드는 출력 값이 나오지 않는다.

getter와 setter class에서 프로퍼티처럼 함수지만 객체의 행동이 아닌 상태값을 도출해야 할 때

get fullName() {

return `${this.lastname} ${this.firstname}`;

이런식으로 함수 이름 앞에 get을 적어주면

console.log(student.fullName);
// 호출 시 필요한 ()를 사용하지 않아도 출력이 된다.

get이라는 키워드만 붙여주게 되면 우리가 함수가 호출하는것처럼 호출하지 않고 속성에 접근하듯 접근할 수 있게 해준다.

  set fullName(value) {
    console.log('set', value);
  }
}

const student = new Student('수지', '');
student.firstName = '안나';
console.log(student.firstName);
console.log(student.fullName);
student.fullName = '김철수';

set은 할당을 할 때 바로 이 함수가 호출이 된다. 즉 접근자프로퍼티는 .이라고 해서 값을 읽게되면 get이 호출이 되고

=처럼 할당한다면 set이 호출이 되면서 할당하고자 하는 value가 set이 적힌 함수의 인자로 전달이 된다.

extends 공통되는 class를 하나 만들어 놓고 그 안에 속하는 여러 class들에게 공통된 class의 값을 상속해주는 개념이다. 여러 class들의 공통되는 부분을 여러번 작성하는 것을 피하고 코드의 간결함과 재사용성을 위해 중요한 class의 장점이다.

상속 받는 class들은 상속받는 내용과 별개로 각자의 class에 추가하고 싶은 내용이 있다면 추가할 객체 내용을 constructor 안에 super 키워드를 사용하여 상속하는 함수의 내용을 한번 더 작성해준 뒤 추가할 객체를 넣어 주어야 한다.

상속해주는 class와 중복되는 프로퍼티는 오버라이딩이 되어 나중에 추가된 프로퍼티가 덮어쓰기 되므로 아주 유용하다.

내일 할 일

  • 자바스크립트 빌트 인 객체 등 강의듣기
  • 딥다이브 자바스크립트

태그:

카테고리:

업데이트:

댓글남기기