TypeScript 9회차 - 생성자 (Constructor), 접근 제한자 (Access Modifiers), Getter 와 Setter / 마지막 강의

Lee·2021년 4월 9일
0

TypeScript

목록 보기
9/10

https://youtu.be/sPM94o5_WVU

모든 class는 Constructor(생성자)라는 메서드를 가질 수 있다.

생성자란(Constructor)?

클래스로 부터 객체를 생성할 때 호출되며 객체의 초기화를 담당

객체 생성시에 생성자를 통해서 객체의 값을 클래스 안에 정의된 property(멤버변수)의 값으로 초기화.

class Employee {
    fullName: string;
    age: number;
    jobTitle: string;
    hourlyRate: number;
    workingHoursPerWeek: number;

    constructor(fullName:string, age:number, jobTitle: string, hourlyRate:number, workingHoursPerWeek: number){        
        this.fullName = fullName;
        this.age = age;
        this.jobTitle = jobTitle;
        this.hourlyRate = hourlyRate;
        this.workingHoursPerWeek = workingHoursPerWeek;
    }

    printEmployeeDetails = ():void => {
        console.log(`${this.fullName}의 직업은 ${this.jobTitle} 이고 일주일의 수입은 ${this.hourlyRate*this.workingHoursPerWeek} 달러 이다.`)
    }
}

위처럼 클래스를 통해서 객체를 생성할 때, Constructor (생성자)를 정의 하면 Constructor에 정의된 Parameter(매개변수들)에 들어갈 값들이 Arguments 를 통해 전달 되어야 한다.
전달되는 매개변수를 강제하고 있는 건데 강제하지 않으려면?
constructor의 매개변수에 물음표를 붙여서 선택적 매개변수로 만들자.


현재는 employee1.fullName = '헨리'; 이런식으로 객체의 값에 접근해서 쉽게 값을 변경할 수 있는데 이러면 보안성이 떨어진다.

접근제한자를 이용한 정의

class Employee {
    private _fullName: string;
    age: number;
    jobTitle: string;
    hourlyRate: number;
    workingHoursPerWeek: number;

    constructor(fullName:string, age:number, jobTitle: string, hourlyRate:number, workingHoursPerWeek: number){        
        this._fullName = fullName;
        this.age = age;
        this.jobTitle = jobTitle;
        this.hourlyRate = hourlyRate;
        this.workingHoursPerWeek = workingHoursPerWeek;
    }

    get fullName () {
        return this._fullName;
    }

    set fullName (value: string) {
        this._fullName = value;
    }

    printEmployeeDetails = ():void => {
        console.log(`${this._fullName}의 직업은 ${this.jobTitle} 이고 일주일의 수입은 ${this.hourlyRate*this.workingHoursPerWeek} 달러 이다.`)
    }
}
let employee1 = new Employee('민수', 28, '주니어 개발자', 40, 35);

//private으로 지정된 변수에 직접 접근 시 에러 발생

//fullName이라는 getter 함수를 호출하는 함수
//이렇게 getter로 접근하면 private변수인 fullName값 잘 호출함

console.log(employee1.fullName);

//setter 함수 호출하여 fullName에 새로운 값을 할당

employee1.fullName = '헨리';
console.log(employee1.fullName);

객체지향 프로그래밍에서는 Access Modifiers (접근제한자) 기능이 있다.

Access Modifiers란?

클래스 속 멤버 변수(프로퍼티)와 메소드에 적용될 수 있는 키워드.
클래스 외부로 부터의 접근을 통제할 수 있다.
버그를 줄이고 코드의 안정성을 향상시킬 수 있다.

타입스크립트의 세가지 접근제한자

  1. Public : 클래스의 외부 어디서든 접근 가능.
    따로 public이라고 명시할 필요 없이 아무런 접근제한자도 붙지 않으면 public으로 취급된다.

  2. Private : 클래스 내에서만 접근 가능. 클래스 외부에서는 접근 불가능. private변수를 나타낼 때는 변수명 앞에 _를 붙이는 것이 암묵적인 룰(convention).
    private 값을 읽어오려면 set,get 키워드를 사용하여 setter, getter 함수를 사용한다.
    클래스 내에 선언된 setter,getter 함수에 클래스 외부에서도 접근 가능하다.

  3. Protected : 클래스 내, 상속받은 자식 클래스에서 접근 가능.


Constructor 에서 Access Modifiers 사용

Constructor의 매개변수에 Access Modifiers를 직접 적용하여 사용할 수 있다.

class 안의 필드(멤버변수) 삭제, constructor 안의 코드 삭제,
constructor의 매개변수에 직접 access modifiers 붙임

access modifiers가 붙은 constructor의 매개변수는 암묵적으로 해당 class의 필드(멤버변수)로 선언된다. 즉, 객체가 생성될 때 constructor의 매개변수로 전달된 값은, 객체의 property(멤버변수, 필드) 값으로 자동으로 그 값이 초기화 되고 할당된다.
따라서 따로 멤버변수들을 선언할 필요가 없다.
코드가 훨씬 간결해졌다.

class Employee{

  constructor(
       private _fullName:string,
       private _age:number, 
       private _jobTitle: string, 
       private _hourlyRate:number, 
       public workingHoursPerWeek: number){
    
    }

    get fullName () {
        return this._fullName;
    }

    set fullName (value: string) {
        this._fullName = value;
    }

    printEmployeeDetails = ():void => {
        console.log(`${this._fullName}의 직업은 ${this._jobTitle} 이고 일주일의 수입은 ${this._hourlyRate*this.workingHoursPerWeek} 달러 이다.`)
    }
}

저번 수업에서도 느꼈지만 접근제한자 까지 등장하고 상속에 대한 언급도 있으니 JAVA와 흡사하다는 느낌이 든다.

profile
하고 싶은 게 너무 많습니다.

0개의 댓글

관련 채용 정보