타입스크립트 instanceof 연산자와 타입좁히기(type narrowing), 그리고 생성자

https://www.yes24.com/Product/Goods/117963966

프로가 되기 위한 타입스크립트 프로그래밍 입문 - 예스24

 
 
class에 객체(instance)를 생성해줄려면 new연산자를 사용해야한다 instanceof연산자는 주어진 객체가 어느 클래스에 인스턴인지 (ture or false) boolean값으로 평가를 해준다. 
 

class User{
    name: string = "";
    age: number = 0;
}


const uhyo = new User(); // uhyo는 User 클래스 인스턴스 생성함
console.log(uhyo instanceof User); // uhyo는 User의 인스턴스라 ture
console.log({} instanceof User); // {}는 User의 인스터가 아니라 false

const hong: User = {
    name: "Hongsun",
    age: 15,
};

console.log(hong instanceof User); // hong은 User의 인스턴를 생성안해서 false

 
 
또다른 특징으로는 if문같은 조건연산자를 사용하여 더욱 구체적인 타입 정보를 얻을 수 있는 타입 좁히기(type narrowing)를 지원한다. 

type HasAge = {
    age: number;
}

class User {
    name: string;
    age: number;

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

// 인스턴스 타입좁히기 이때 바깥에서는 HasAge타입이고 if문 안에서는 User타입 
function getPrice(customer: HasAge) { 
    if (customer instanceof User) {
     // 이때 === 는 타입이 다르면 false, ==는 타입이 다르더라도 ture가 된다.
        if(customer.name === "Hong") {
            return 0;
        }
        
    }
        return customer.age < 18 ? 1000:1800; 
    
}

const customer1: HasAge = {age: 15};
const customer2: HasAge = {age: 40};
const hong = new User("Hong", 15);

console.log(getPrice(customer1)); // 1000 출력
console.log(getPrice(customer2)); // 1800 출력 
console.log(getPrice(hong));      // 0 출력

 
 
 
생성자는 새롭게 new인스턴스가 만들어질때 호출되는 함수이다. 이것을 이용해 boolean값을 평가할 수 있고 생성자안에 있는 this를 사용하여 새롭게 new로 만들어질 인스턴스를 생성자를 통해 값을 조작할 수 있다.

이 사진에서 생성자안에 있는 class의 age인스턴스 프로퍼티를 초기화 안해줘서 에러가 났다. 생성자는 new로 인스턴스가 만들어질때 호출되는 함수이다 생성자 안에서 this를 사용하면 새롭게 new로 만들어질 인스턴스의 값들을 생성자를 통해 조작할 수 있고 >=같은 비교식을 통해 참거짓을 평가 할 수 있다.

 

type HasAge = {
    age: number;
}

class User {
    name:string;
    age:number;
	
    // 생성자 생성 
    constructor(name:string, age:number) { 
    	// this를 통해 새롭게 new로 만들어진 인스턴스의 값 name값을 조작할 수 있다.
        this.name = name;  
        // this를 통해 새롭게 new로 만들어진 인스턴스의 값 age값을 조작할 수 있다.
        this.age = age;                 
    }

    isAdult(): boolean {
    	// 새롭게 만들어질 new인스턴스에 생성자 인스턴스를 사용하여 참거짓을 평가
        return this.age >= 30; 
    }
}

const hong = new User("Hong",25); // new User인스턴스 생성
console.log(hong.name); // 결과는 Hong 
console.log(hong.isAdult()); // 결과는 30보다 작으니 false