[TS] 객체

목차

 

📌  객체

 

 

📍객체 타입

기존 객체에서 타입을 유추하는 방법도 좋치만, 객체 타입을 명시적으로 선언하는 방법도 좋다.

값의 속성의 접근하려면 value.멤버 또는 value['멤버']

 

const poet = {
	born : 1935;,
    name : "Mary Oliver"
}

poet['born']; // 타입 : number
poet.name; // 타입 : String

poet,end; // Error

 

// 객체 타입 선언

let student : {
	age : number;
    name : string;
}

student = {
	age : 20;
    name : "jeong";
}

// 별칭 객체 타입

let student2 : student;

student2 = {
	age : 22;
    name : "hwan";
}

 

📍구조적 타이핑

 

타입스크립트의 타입 시스템은 구조적으로 타입화되어 있다.

타입의 충족되는 모든 값은 해당 타입의 값으로 사용할 수 있다.

즉  객체 타입으로 선언되면 어떤 객체를 사용하든 특정 속성이 있어야 한다.

 

type WithFirstName = {
	firstName : String;
};

type WithLastName = {
	lastName : String;
}

type hasBoth = {
	firstName : jeong;
    lastName : kim;
}

let WithFirstName : WithFirstName = hasboth;
let WithLastName : WithLastName = hasBoth;

 

🔗 사용 검사

할당하는 값에는 타입의 필수 속성이 있어야 한다.

타입이 일치하지 않아도 허용되지 않는다.

 

초과 속성 검사

 

변수가 객체 타입으로 선언되고, 초깃값에 객체 타입에서 정의된 것보다 많은 필드가 있다면 오류

 

type FirstAndLastNames = {
	first : string;
    last : string;
}

// ok
const hasBoth : FirstAndLastNames = {
	first : "~~",
    last : "~~",
}

// Error
const hasOnlyOne : FirstAndLastNames = {
	first : "~~",
}

// 초과 속성 검사 Error
const hasOnlyOne : FirstAndLastNames = {
	first : "~~",
    last : "~~",
    third : "~~",
}

 

중첩된 객체 타입

 

JS에서도 가능하므로 TS에서도 중첩된 객체 타입이 가능하다.

중첩된 객체 타입을 고유한 타입 이름으로 바꿔서 사용하면 코드와 오류 메시지가 읽기 쉬워진다.

 

type Poem = {...}

// ok
const poemMatch : Poem = {...}

// But Poem의 없는 값을 쓰는 것은 불가능

 

선택적 속성

 

모든 객체에 객체 타입 속성이 필요한 것은 아니다.

: 앞에 ?를 추가하면 선택적 속성임을 나타낼 수 있다.

❗️❗️ 선택적 속성과 undefined를 포함한 유니언 타입의 속성과는 다르다.

?를 사용해 선언한다면 undefined 존재하지 않아도 되지만 |(논리연산자)로 선언된 유니언 타입은 반드시 존재해야 한다.

 

type Book = {
	author? : string;
    pages : number;
}

 

 

 

📍객체 타입 유니언

 

객체 타입 또한 속성값을 기반으로 타입을 좁혀야 할 수 있다.

객체 타입 유니언을 명시한다면 유니언 타입에 존재하는 속성에 대한 접근만 허용한다.

 

cosnt poem = Math.random() > 0.5
	? {name : "AA", pages : 120}
    : {name : "BB", rhymes : true}
    
    //타입 :
    {
    	name : string;
        pages : number;
        rhymes? : undefined;
    }
    |
    {
        name : string;
        pages : undefined;
        rhymes? : boolean;
    }

 

객체 타입 내로잉

 

앞서 배운 변수 내로잉과 같이 객체 타입에서도 내로잉이 가능하다.

 

// 명시된 객체 타입의 유니언
type PoemWithPages = {
	name : string;
    pages : number;
};

type PoemWithRhymes = {
	name : string;
    rhymes : boolean;
};

type Poem = PoemWithPages | PoemWithRhymes;

cosnt poem = Math.random() > 0.5
	? {name : "AA", pages : 120}
    : {name : "BB", rhymes : true}


// 객체 타입 내로잉
if ("pages" in poem){
	poem.pages; // ok 명시적 선언을 했기 때문
} else {
	poem.rhymes; // ok 명시적 선언을 했기 때문
}
// 이렇게 나온 결과를 판별된 유니언이라고 한다

 

📍교차 타입

 

타입 스크립트 유니언 타입은 둘 이상의 다른 타입 중 하나의 타입이 될 수 있다를 의미한다.

JS의 런타임 논리연산자가 & 연산자에 대응하는 역할을 하는 것처럼, TS에서도 & 교차타입을 사용해 여러 타입을 동시에 나타냄

교차 타입은 유니언 타입과 결합할 수 있으며, 하나의 타입으로 판별된 유니언 타입을 설명하는데 유용하다.

 

type Artwork = {
	genre : string;
    name : string;
};

type Writing = {
	pages : number;
    name : string;
};

// 교차타입 사용
type WrittenArt = Artwork & Writing;

// 다음과 같음;
{
	gerne : string;
    name : string;
    pages : number;
}

 

교차 타입의 위협성

 

교차 타입은 컴파일러를 혼동시키는 방식으로 사용하기 쉽다

교차 타입을 사용할 때는 가능한 한 코드를 간결하게 유지