[TypeScript] Constructor와 접근 제한자, Getter와 Setter

손종일·2021년 2월 24일
1
post-thumbnail

Constructor (생성자)

객체지향 언어에는 Constructor 생성자가 있습니다.

모든 Class는 Constructor라는 메소드를 가집니다. class로부터 객체를 생성할 때 호출되며, 객체의 초기화를 담당하고 있습니다.

class User {
  // class내에 정의된 변수는 property 프로퍼티 라고 부른다.
  name: string;
  age: number;
  address: string;

  constructor(name: string, age: number, address: string) {
  this.name = name;
  this.age = age;
  this.address = address;
}

  // class내에 정의된 함수는 method 메소드 라고 부른다.
  printUserInfo = (): void => {
    console.log(`${name}의 나이는 ${age}이고 사는 곳은 ${address}입니다.`)
  }
}

// 새로운 인스턴스 생성
let user1 = new User("allDay", 28, "경기 의정부");
user1.printUserInfo();

Access Modifiers (접근 제한자)

접근 제한자에는 class 속 멤버 변수 프로퍼티와 메소드에 적용될 수 있는 키워드가 있습니다. class 외부로 부터의 접근을 통제할 수 있습니다.

Public = 클라스의 외부에서 접근 가능 (default)
Private = 클라스 내에서만 접근 가능, 클라스의 외부에서 접근 불가능 (비공개 멤버)
Protected = 클라스 내부, 그리고 상속받은 자식 클라스에서 접근 가능

class User {
  // class내에 정의된 변수는 property 프로퍼티 라고 부른다.
  private name: string;
  age: number;
  address: string;

  constructor(name: string, age: number, address: string) {
  this.name = name;
  this.age = age;
  this.address = address;
}

  // class내에 정의된 함수는 method 메소드 라고 부른다.
  printUserInfo = (): void => {
    console.log(`${name}의 나이는 ${age}이고 사는 곳은 ${address}입니다.`)
  }
}

//새로운 인스턴스 생성
let user1 = new User("allDay", 28, "경기 의정부");
console.log(user1.name) // 에러 출력

Getter, Setter를 사용해보자!

class User {
  // class내에 정의된 변수는 property 프로퍼티 라고 부른다.
  private _name: string; // private 멤버를 나타내는 암묵적인 컨벤션입니다.
  age: number;
  address: string;

  constructor(name: string, age: number, address: string) {
  this.name = name;
  this.age = age;
  this.address = address;
}

  // getter
  get name () {
    return this._name;
  }

  //setter
  set name () {
    this._name = value;
  }

  // class내에 정의된 함수는 method 메소드 라고 부른다.
  printUserInfo = (): void => {
    console.log(`${name}의 나이는 ${age}이고 사는 곳은 ${address}입니다.`)
  }
}

//새로운 인스턴스 생성
let user1 = new User("allDay", 28, "경기 의정부");
console.log(user1.name) // "allDay" (getter를 사용하여 가져온다)
// user1.name은 _name 멤버를 호출하는게 아닌 getter와 setter를 호출하기 때문이다.

//새로운 인스턴스 생성
let user2 = new User("allDay", 28, "경기 의정부");
user2.name = "bora"  // setter를 사용하여 멤버의 이름을 설정
console.log(user2.name) // "bora" (getter를 사용하여 가져온다)
// user1.name은 _name 멤버를 호출하는게 아닌 getter와 setter를 호출하기 때문이다.

Constructor와 Access Modifiers

TypeScript에서는 Constructor의 매개변수에 Access Modifiers를 직접 적용하여 아래의 코드처럼 짧게 나타낼 수 있다.

class User {

  //즉, 객체가 생성될 때, 생성자의 매개변수로 전달된 값은, 객체의 프로퍼티 값으로
  // 자동으로 그 값이 초기화되고 할당된다.
  constructor(private name: string, private age: number, public address: string) {
}

  // getter
  get name () {
    return this._name;
  }

  //setter
  set name () {
    this._name = value;
  }

  // class내에 정의된 함수는 method 메소드 라고 부른다.
  printUserInfo = (): void => {
    console.log(`${name}의 나이는 ${age}이고 사는 곳은 ${address}입니다.`)
  }
}

//새로운 인스턴스 생성
let user1 = new User("allDay", 28, "경기 의정부");
console.log(user1.name) // "allDay" (getter를 사용하여 가져온다)
// user1.name은 _name 멤버를 호출하는게 아닌 getter와 setter를 호출하기 때문이다.

//새로운 인스턴스 생성
let user2 = new User("allDay", 28, "경기 의정부");
user2.name = "bora"  // setter를 사용하여 멤버의 이름을 설정
console.log(user2.name) // "bora" (getter를 사용하여 가져온다)
// user1.name은 _name 멤버를 호출하는게 아닌 getter와 setter를 호출하기 때문이다.













profile
Allday

2개의 댓글

comment-user-thumbnail
2021년 7월 20일

우연히 들어와서 보다가 경기 의정부 사는 bora 놀라고 갑니다..😂

1개의 답글