[TIL]Typescript type / interface

ohoho·2024년 10월 13일

슬기로운스터디

목록 보기
27/54

오늘 공부한것 & 기억할 내용

  • 타입스크립트에서 타입을 지정해줄때는 :strong, :[], :{}콜론을 찍은 다음 적어준다.
  • 타입지정시 객체안의 프로퍼티를 무조건적인 선택이 아닌 필요에 따른 선택을 하게 해주려면 프로퍼티 타입 지정시 ?을 작성해주면 된다.
let a : string = "kim"
//player안의 프로퍼티 age의 type은 number or undefined 이다
const player : {name:string,age?:number} = {
	name:"kim",
}

type

  • 똑같은 타입을 여러개의 변수또는 함수에 지정해줘야한다면 type을 사용해 한번에 작성 후 재사용 할 수 있다.
  • type안에 들어갈 이름 첫번째는 대문자로 해야한다.
type Player = {
  name:string,
  age?:number
}

const player1 : Player = {
	name:"kim"
}

//함수로 만들었을때 괄호안에 지정 해준다.
//(name:string)만 먼저 넣어줬다가 추후 age추가시 에러가 나기에 ㄱreturn값에 :Player 추가 작성
function playerMaker(name:string):Player{
	return{
    	name
    }
}

const kim = playerMaker("kim");
//함수 return에 :Player을 추가로 넣어줬기 때문에 age를 추가했을때 에러가 나지 않는다.
kim.age = 12;

readonly

  • type안에 readonly 를 작성해주면 처음 초기화는 가능하지만 변경은 불가능하게 된다.
type Player = {
  readonly name:string,
  age?:number
}

// 초기화는 오케이
let kim: Player = { name: "kim", age: 16 };

// 변경은 안됨
kim.age = 456;

//변수 선언시에도 readonly를 넣어줄 수 있다.
//.push()로 변경 불가능
const arry : readonly number[] = [1,2,3]

Tuple / any

  • Tuple은 지정된 위치에 알맞은 타입이 무조건 와야할때 사용한다.
  • any는 타입이 아무거나 될 수 있기에 사용을 자제하는게 좋다.
cosnt userInfo : [string, number, boolean] = ["kim", 20,true]

let a: any[] = [1,2,3]
let b: any = true
//any를 지정했기에 타입이 무시된다.
a+b = [1,2,3,true]

unknown

  • 변수의 타입을 미리 알 수 없을때 사용한다.
let a:unknown;

//if문으로 typeof검사를 해서 통과하면 return 값을 받을 수 있다.
if(typeof a === 'number'){
	let b  = a + 1;
}

type 과 interface 차이점

  • interfaceextends를 사용해 확장(상속)한다.
  • type&을 사용해 확장(상속)한다.
interface Person{
	name:string,
  	age:number
}
interface Customer extends Person{
	male:string
}
const kim:Customer = {
	name:'kim',
  	age:20,
  	male:'female'
}

//type일 경우
type Customer = Person & {
	male:string
}
  • interface는 선언적 확장이 가능하다.(같은 이름의 interface를 선언하면 자동으로 상속된다)
interface Info {
	name:string
}
interface Info{
	age:number
}
const kim:Info = {
	name:'kim',
  	age:20
}

//type은 선언적 확장 불가능

📌 객체의 확장성을 위해선 interface를 쓰는게 용이하다.

배운점 & 느낀점

타입지정을 각각 할 수 도 있지만 type이나 interface를 사용해 공통으로 사용할것을 한번에 지정해주면 편리하다는것을 배웠다.
interface도 type과 비슷하지만 다른점이 있다 객체에 사용하거나 확장 가능성이 있다면 interface를 사용하는게 좋은거 같고 확장불가능한 타입이나 모든타입에 사용할때면 type을 사용하는게 좋은거같다.

0개의 댓글