[TypeScript] TypeScript Grammar - 09

2023. 1. 8. 18:15·Development Study/Frontend
728x90

Previous Series

 

[TypeScript] TypeScript Grammar - 08

Previous Series [TypeScript] TypeScript Grammar - 02 Previous Series [TypeScript] TypeScript Grammar - 01 1. Type Annotation TypeScript uses colon ( : ) behind variables to annotate a type const myMaxHamburger: number = 3; const answer: string = "Yes I can

time-map-installer.tistory.com


9.  Generic

If you use generic, you can recycle classes or interface to many types

When you declatate it, just write the parameters and decide types when it starts

function getSize<T>(arr: T[]): number {
	return arr.length;
}

const arr1 = [1, 2, 3];
getSize(arr1);// 3
getSize<number>(arr1);

const arr2 = ["a","b","c"];
getSize(arr2);// 3 
getSize<string>(arr2);// 3 

const arr3 = [false , true , true];
getSize(arr3);// 3 

const arr4 = [{}, {},{name:"Tim"}];
getSize(arr4);// 3

9_01.  Generic_interface 

interface Macbook<T> {
	name: string;
    price: number;
    option: T;
}

const m1 Macbook<object> = {
	name: "m1 air",
    price: 1500000,
    option: 
    {
    	color: "silvergray",
        coupon: false,
    },
}

const m2 Macbook<string> = {
	name: 'm2 air',
    price: 1800000,
    option: "not bad",
}

End

728x90
저작자표시 비영리 변경금지 (새창열림)

'Development Study > Frontend' 카테고리의 다른 글

[Tips] Organizing your Tailwind ClassName  (0) 2023.01.16
[Quick Tips] Create New React Project  (0) 2023.01.16
[TypeScript] TypeScript Grammar - 08  (0) 2023.01.08
[TypeScript] TypeScript Grammar - 06~07  (0) 2023.01.08
[TypeScript] TypeScript Grammar - 03~05  (0) 2023.01.07
'Development Study/Frontend' 카테고리의 다른 글
  • [Tips] Organizing your Tailwind ClassName
  • [Quick Tips] Create New React Project
  • [TypeScript] TypeScript Grammar - 08
  • [TypeScript] TypeScript Grammar - 06~07
ThreeLight
ThreeLight
ThreeLight Studio의 블로그, TimeMap.exe에 오신 것을 환영합니다.
  • ThreeLight
    TimeMap.exe
    ThreeLight
  • 전체
    오늘
    어제
    • 분류 전체보기 (245)
      • Checkpoint (1)
      • (3D)Dev Deep Dive (0)
        • Templates & Guides (9)
        • Frontend origin (9)
        • Backend origin (1)
        • TroubleShootings (4)
      • Development Study (95)
        • Frontend (36)
        • Backend (21)
        • CS(Computer Science) (2)
        • Background Knowledges (11)
        • Algorithm (2)
        • Mobile (3)
        • AWS (6)
        • Python (6)
        • MSW(MapleStoryWorlds) (8)
      • Coding Test (59)
        • 문제.zip (1)
        • BaekJoon_JavaScript (0)
        • Programmers_JavaScript (9)
        • BaekJoon_Python (23)
        • Programmers_Python (10)
        • Undefined_Python (3)
        • Programmers_SQL (13)
      • 활동내역.zip (43)
        • 개인 (21)
        • Techeer (12)
        • Bootcamp (7)
        • Hackathon (1)
        • TeamProjects (2)
      • 여기 괜찮네??(사이트 | App) (5)
      • 재미있는 주제들 (8)
      • 개발 외 공부 저장소 (11)
        • 생산운영관리 (3)
        • 생활속의금융 (6)
        • 경영정보시스템 (2)
  • 링크

    • TimeMap.dmg (Portfolio)
    • GitHub 바로가기
    • 오픈프로필(카카오톡)
    • Medium 바로가기
    • Disquiet 바로가기
    • LinkedIn 바로가기
  • 인기 글

  • 태그

    react
    프로그래머스
    CSS
    Baek Joon
    HTML
    JavaScript
    SQL
    Python
    programmers
    TypeScript
  • 최근 글

  • 최근 댓글

  • hELLO· Designed By정상우.v4.10.1
ThreeLight
[TypeScript] TypeScript Grammar - 09
상단으로

티스토리툴바