getter setter & class

jungeundelilahLEE·2022년 10월 7일
0

TS

목록 보기
1/1

getter setter

let obj = {
    msg: '',
    get hello1() {
        return this.msg + ' I love you'
    },
    set hello2(value) {
        this.msg = value;
        console.log(this.msg, '::set this msg')
    }
}

obj.hello2 = "willy"
// willy ::set this msg

obj.hello1 
// willy I love you

.
.
.

_companyTypeOptions: any[];

@Input()

  get companyTypeOptions() {
    // 내가 원하는 값을 get해보자.
    
    return this._companyTypeOptions; 
  }
  
  set companyTypeOptions(val: any[]) {
    // 넘겨받은 데이타를 내가 원하는 형식으로 setting해보자.
    
    this._companyTypeOptions = val;
    if (val?.length > 0) {
      this.listOfColumns = this.listOfColumns.map((v) => {
        if (v.name === 'Type') {
          return { ...v, filterOptions: val };
        } else {
          return v;
        }
      });
    }
  }

class

class 선언

-객체를 정의하기위한 구조
-함수, 생성자, 멤버 변수로 구성된다.

  • 기본 구조 (아래)
class Willy {
  constructor() {}
}
  • class를 정의하는 키워드인 class를 이용해서 Willy라는 이름의 클래스를 선언
  • class는 그 자체로 사용할 수 없으며, 객체로 만들어진 후에 사용할 수 있다.
  • class를 객체로 만들 때는 new키워드를 사용한다. (아래)
let willyLee: Willy = new Willy();
  • 객체를 생성할 때 전달한 인자는 곧바로 constructor 매개변수로 전달되어, 전역변수 _age_breed를 초기화하는 데 사용된다. => 이 변수는 getBreed() 메서드와 age 게터 함수를 통해 외부로 제공된다. (아래)
class Willy {
  _age: number;
  _breed: string;
  
  constructor(age, breed) {
    this._age = age;
    this._breed = breed;
  }
  
  getBreed(): string {
    return this._breed;
  }
  
  get age() {
    return this._age;
  }
  
}

let myBaby: Willy = new Willy(3, "비숑");
console.log(myBaby.getBreed(), ' 윌리의 나이는 ', myBaby.age)
  • public 접근자를 이용해서 생성자 매개변수를 전역변수로 만들 수 있다. (아래)
constructor(public age: number, public breed: string) {
    this._age = age;
    this._breed = breed;
  }
  • 이를 통해 생성자의 매개변수가 아닌, 클래스의 전역변수로 변수의 유효 범위를 확대할 수 있다.

class 상속

  • extends키워드로 class 상속 (아래)
class 부모클래스 {
  constructor() {}
}
class 자식클래스 extends 부모클래스 {
  constructor() {
    super();
  }
}
  • 자식클래스의 생성자 내부에서 super() 메서드를 이용해서 상위(부모)클래스의 생성자를 호출해야 한다.
  • 자식클래스에서 super() 메서드를 호출하는 것은 생략 불가
  • super(인자1, 인자2 ..) 의 형태로 부모클래스의 생성자로 매개변수를 전달할 수 있다.
    - 예제 (by Angular2 프로그래밍 (정진욱 / 위키북스))
class Animal {
  protected constructor(public name: string, public leg: number) {}
  getLeg(): number {
    return this.leg;
  }
  protected getName(): string {
    return this.name;
  }
}

class Monkey extends Animal {
  constructor(name: string, let: number) {
    super(name, leg);
  }
  isClimbing() {
    return true;
  }
  superGetName() {
    return super.getName();
  }
}

let monkey: Monkey = new Monkey('숭이', 2);

console.log('원숭이 이름 :', monkey.name);
// 원숭이 이름 : 숭이
console.log('나무타기 가능? :', monkey.isClimbing());
// 나무타기 가능? : true
console.log('다리개수 :', monkey.getLeg());
// 다리개수 : 2
console.log('상위 클래스의 메서드 호출 :', monkey.superGetName());
// 상위 클래스의 메서드 호출 : 숭이
  • protected 접근자가 설정되어 있으면, 자식클래스에서는 접근할 수 있지만, 클래스 외부에서 객체를 통한 접근은 허용하지 않는다.
  • Animal클래스의 생성자처럼, 생성자에 protected가 설정되어 있다면, 외부에서 Animal클래스의 객체를 생성할 수 없다.

인터페이스

  • 인터페이스의 장점은, 인터페이스에 선언된 변수나 메서드의 사용을 구현하고자하는 class에 강제함으로써 class 형태에 일관성을 유지할 수 있다는 점.
  • 상속 (아래)
interface 자식인터페이스명 extends 부모인터페이스명 {}
  • 인터페이스 구현 강제 (아래)
class 클래스명 implements 구현하고자 할 인터페이스명 {}

추상클래스 (abstract class)

  • 구현과 강제를 동시에 수행하는 클래스
  • abstract키워드를 이용해서 선언
  • 추상클래스 내부에서는 추상메서드구현메서드로 나누어서 정의
  • 추상메서드는 abstract키워드를 붇여 형식만 정의
  • 구현메서드는 abstract키워드를 생략한 채로 정의
profile
delilah's journey

0개의 댓글