본문 바로가기

Typescript11

[Typescript] Type Narrowing 📕 NarrowingNarrowing은 값의 타입이 더 구체적으로 판단 될 수 있는경우 타입을 더 좁혀서 구체적으로 추론 할 수 있는 기술입니다. 예를 들어 어떤 함수의 매개변수 a가 string | number 같은 유니온 타입일 때 타입스크립트에서 함수는 a.toLowerCase()같은건 실행해 주지 않습니다. 그 이유는, a에 어떤 타입이 올지 아직 모르기 때문입니다 이런경우 Narrowing을 통해서 구체적으로 타입스크립트에게 알려줄 수 있겠습니다🛡️ Type Guards 그럼 이제 함수를 만들면서 a에 어떻게 Narrowing을 할지 알아봅시다.function fn(a : string | number):string{ if(typeof a === 'string'){ retur.. 2025. 7. 6.
[TypeScript] Type 요약 타입을 설정하는 방법변수 옆에 :을 찍고 타입을 정하는것이 기본 형태입니다. 이 기본형태로 여러 데이터의 타입을 지정해 줄 수 있는데, 아래의 데이터타입 설정예시를보며 감을 익힙시다.원시타입타입스크립트는 자바스크립트에서 사용되는 데이터들의 데이터 타입을 엄격하게 검사해줍니다. 예를들어 변수선언 같은거 할때 "나 이 변수에는 숫자형 쓸거야" 라고 미리 얘기해두고 사용하는겁니다. 변수에는 :타입 처럼 사용해서 타입을 지정해 줄 수 있습니다. 아래 예시로 설명하겠습니다.let userName: string = "steve";let userAge: number = 23let isMan: boolean = trueuserName = 123 // 타입과 다른 값을 넣으면 에러가 납니다.배열과 객체let userNa.. 2025. 7. 6.
[Typescript] generic generice 타입은 함수의 파라미터와 같은 역할을 합니다. 함수나 클래스를 만들때 매개변수에 어떤 값이 와서 어떤값을 리턴할 지 모르겠을 때 사용하게 되는데, generic타입은 만든 함수나 클래스를 실행 시 타입을 결정하게 만드는 문법입니다. 함수명(매개변수:Type):Type 으로 사용하게 됩니다. 처음 generic을 지정해 줄때 를 열어 지정해 줍니다.function fn(x:T):T{return x}fn(1) // numberfn('hi') // stringfn(true) // booleanfn('1') // errorfn('hi') // string 정말 파라미터처럼 generic을 만들어두고 나중에 타입이 뭔지 지정해 주니까 fn의 호출같은 경우 에러가 나는 것도 확인 할 수 있습니다... 2025. 7. 1.
[Typescript] keyof & typeof 연산자 Typeof는 객체에서 값의 타입을 추론할 때 사용합니다. typeof 객체 를 지정하면 객체안에 있는 값에따라 타입을 추론해 줍니다. const user = { name: 'moon', age: 30, address:'고양시'}type User = typeof user /* typeof가 내는 값 const user = { name: string, age: number, address: string}*/ keyof는 객체안의 키가 가진 타입을 Union타입으로 합쳐줍니다. 그렇기 때문에 keyof의 뒤에는 반드시 타입이 와야합니다. keyof 객체의타입 으로 사용 할 수 있습니다. 위의 코드에서 키의 타입만 가져와 보도록 합시다. const user = { name: 'moon', .. 2025. 7. 1.
[Typescript] 배열 타입스크립트에서 배열의 타입을 정해줄 때,[ ]를 붙여표기합니다. 이 포스팅에서는 배열 타입을 지정해 주는것과 튜플, 그리고 제네릭타입에 대해서 공부해봅니다.배열 타입 지정방법let arr:number[] = [1,2,3]let strArr = string[] = [a,b,c]let booleanArr = boolean = [true,false] 예시 코드와 같이 자료형 옆에 [ ]를 붙여야 합니다 튜플은 배열안의 데이터 갯수까지 정해주는것이 튜플입니다. 사용방법은 배열안의 데이터 갯수만큼 타입을 지정해주는 [ ]안에 타입을 지정하면 됩니다.let arr:[number,number,number] = [1,2,3]let arr2:[number,string] =[1,'hi',true] // errorlet.. 2025. 6. 30.
[Typescript] Object 타입스크립트에서의 객체에서는 타입을 지정할 때 쓸 수 있는 문법이 있는데 type과 interface입니다. interface는 type과 유사한 역할을 담당합니다.interface Obj{name: string;age : number;}let obj:Obj={name: 'son',age : 33} 하지만 type과의 차별점은 속성이 중복되었을때 처리되는 방식과 어떤식으로 복사를 할 수 있는지에서 차이가 납니다. interface를 복사하는 방법은 extends문법을 사용하면됩니다. 사용법은 class에서 extends문법을 사용하는 것과 같습니다. 그러면 앞서 만든 객체를 복사한 다른 객체를 만들고 싶다면 어떻게 할까요?interface Obj{name: string;age : number;}inter.. 2025. 6. 14.

티스토리툴바