JavaScript

타입스크립트 기본

스파이더웹 2022. 10. 11. 11:16
728x90
반응형

타입스크립트란?

자바스크립트에 타입을 부여한 언어

 

타입스크립트의 장점

1) 에러의 사전 방지

  • 브라우저를 통해 확인하는 것이아닌 , 코드상에서 확인할 수 있어 미리 처리할 수 있다.

2) 코드 가이드 및 자동 완성

 

자바스크립트를 -> 타입스크립트 

//JS 문자열 선언
// let str ="hello";

//TS 문자열 선언
let str: string ="hello";

//TS 숫자
let num: number = 10;

//TS 배열
let arr: Array<number> =  [1,2,3];
let heroes: Array<String> = ["Cap","Thor","Hulk"];
let items: number[] = [1,2,3];

//TS 튜플(배열의 인덱스의 순서까지 지정하는 것)
let address: [string,number] = ["gangnam",10];

//TS 객체
let obj:object = {};
let person: object ={
    name: "capt",
    age:100
};

let student: {name: string, age:number}={
    name:"Goru",
    age:3
}

//TS 진위값
let show:boolean = true;

 

함수

기존의 JS

function sum(a,b){
    return a+b;
}
//sum 함수의 매개변수의 개수가 달라도 JS의 경우 정상 실행된다
sum(10,20,30,40);//return 30;

TS

//함수의 파라미터에 타입을 정의하는 방식
function sum(a:number,b:number){
    return a+b;
}
//함수의 매개변수가 다른경우 컴파일에러가 발생한다
//sum(10,20,30);
sum(10,20);

//함수의 반환 값에 타입을 정의하는 방식
function add():number {
    return 10;
}

//함수의 옵셔널 파라미터
function log(a:string,b?:string){

}
log("hello");
log("hello",'10');
728x90
반응형