타입스크립트 클래스

클래스

자바스크립트의 클래스 소개

/**
 * 클래스
 */

let studentA = {
  name: "이정환",
  grade: "A+",
  age: 27,
  study() {
    console.log("열심히 공부 함");
  },
  introduce() {
    console.log("안녕하세요!");
  },
};

class Student {
  // 필드
  name;
  grade;
  age;

  // 생성자
  constructor(name, grade, age) {
    this.name = name;
    this.grade = grade;
    this.age = age;
  }

  // 메서드
  study() {
    console.log("열심히 공부 함");
  }

  introduce() {
    console.log(`안녕하세요! ${this.name}입니다!`);
  }
}

// 파생 클래스 상속 이용
class StudentDeveloper extends Student {
  // 필드
  favoriteSkill;

  // 생성자
  constructor(name, grade, age, favoriteSkill) {
    super(name, grade, age);
    this.favoriteSkill = favoriteSkill;
  }

  // 메서드
  programming() {
    console.log(`${this.favoriteSkill}로 프로그래밍 함`);
  }
}

const studentDeveloper = new StudentDeveloper("이정환", "B+", 27, "TypeScript");
console.log(studentDeveloper);
studentDeveloper.programming();

// 클래스를 이용해서 만든 객체 -> 인스턴스
// student 인스턴스
let studentB = new Student("이정환", "A+", 27);
console.log(studentB);
studentB.study();
studentB.introduce();

타입스크립트의 클래스

/**
 * 타입스크립트의 클래스
 */

const employee = {
  name: "이정환",
  age: 27,
  position: "developer",
  work() {
    console.log("work work");
  },
};

class Employee {
  // 필드
  name: string;
  age: number;
  position: string;

  // 생성자
  constructor(name: string, age: number, position: string) {
    this.name = name;
    this.age = age;
    this.position = position;
  }

  // 메서드
  work() {
    console.log("work work");
  }
}

class ExecutiveOfficer extends Employee {
  // 필드
  officeNumber: number;

  // 생성자
  constructor(
    name: string,
    age: number,
    position: string,
    officeNumber: number
  ) {
    super(name, age, position);
    this.officeNumber = officeNumber;
  }
}

const employeeB = new Employee("이정환", 27, "개발자");
console.log(employeeB);

const employeeC: Employee = {
  name: "",
  age: 0,
  position: "",
  work() {},
};

접근 제어자

/**
 * 접근 제어자
 * access modifier
 * => public / private / protected
 */

class Employee {
  // 필드 (앞에 public 생략된 것 => 접근 가능)
  name: string;
  // protected => 외부 접근 x, 파생 클래스 내부에서 접근 o
  protected age: number;
  // private => 외부 접근 x, 파생 클래스 내부에서도 접근 x
  private position: string;

  // 생성자
  constructor(name: string, age: number, position: string) {
    this.name = name;
    this.age = age;
    this.position = position;
  }

  // 메서드
  work() {
    console.log("work work");
  }
}

const employee = new Employee("이정환", 27, "developer");
employee.name = "정환";
console.log(employee);

class Employee2 {
  // 생성자에 접근 제한자를 달아줄 경우 자동으로 생성되므로 필드 부분은 생략해야 함, 값 초기화도 자동
  constructor(
    public name: string,
    private age: number,
    protected position: string
  ) {}

  // 메서드
  work() {
    console.log("work work");
  }
}

const employee2 = new Employee2("이정환", 27, "developer");
employee2.name = "정환";
console.log(employee2);

인터페이스와 클래스

/**
 * 인터페이스와 클래스
 */

// Interface는 무조건 public 필드만 정의 가능
interface CharacterInterface {
  name: string;
  moveSpeed: number;
  move(): void;
}

class Character implements CharacterInterface {
  constructor(public name: string, public moveSpeed: number) {}

  move(): void {
    console.log(`${this.moveSpeed} 속도로 이동!`);
  }
}

[참고]

한 입 크기로 잘라먹는 타입스크립트

• Section 6. 클래스 강의를 듣고 정리한 내용입니다.