TypeScipt 타입
Boolean 타입
let isShow: boolean = true;
let isDone: boolean = false;
가장 기본적인 타입으로 JS에서도 마찬가지고 boolean
이라고 불리는 값 true, false
Number 타입
let number1: number = 5;
let number2: number = 0.7;
String 타입
let firstName: string = "Huni";
let lastName: string = 'Jeon';
let longString: string = `Huni is a developer.
He is 20 years old.`
Array 타입
//첫 번째 방법
let items: string[] = ["apple", "banana", "grape"];
//두 번째 방법
let numberList: Array<number> = [4, 7, 100];
첫 번째 방법
배열의 요소들을 나타내는 타입뒤에 배열을 [] 을 쓰는것
두 번째 방법
배열을 먼저 작성한뒤에 <> 안에 배열의 요소들을 나타내는 타입
Tuple 타입
let user: [string, number, boolean] = ["kimcoding", 20, true];
TypeScript 에서 튜플 타입을 사용하면 요소의 타입과 개수가 고정된 배열을 표현할수 있다.
Object 타입
let obj: object = {};
let user: {name: string, age: number} = {
name: "kimcoding",
age: 20
}
TypeScript에서 object 타입은 모든 객체를 수용하는 타입이다. 객체의 프로퍼티 타입들이 any로 지정되기 때문에 어떠한 프로퍼티라도 추가할 수있다.
프로퍼티 각기 명시해 주는것이 좋고 객체는 키 벨류도 지정할 수 있다
Any 타입
let maybe: any = 4;
//any 타입을 사용하게 되면 변수에 값을 재할당하는 경우 타입을 명시한 변수와 달리 타입에 구애받지 않고 값을 재할당 할 수있게 됩니다.
let obj: object = {};
//에러가 납니다.
obj = "hello";
let maybe: any = 4;
//정상적으로 동작합니다.
maybe = true;
// 실제할당된 값을 가지지 않고 메서드 및 프로퍼티로 접근해도 에러가 나지 않는다. 실제 할당된 값이 가지지 않는 메서드 및 프로퍼티이기 때문에 반환 되는 값은 undefined
let maybe: any = 4;
//undefined로 출력됩니다.
console.log(maybe.length);
TypeScript 함수
자바스크립트 함수
//named function
function add(x, y){
return x + y;
}
//arrow function
let add = (x, y) => {
return x + y;
}
타입스크립트 함수
//named function
function add(x: number, y: number):number {
return x + y;
}
//arrow function
let add = (x: number, y: number): number => {
return x + y;
}
// 만약 리턴값이 없다면 void 이용가능
let printAnswer = (): void => {
console.log("YES");
}
자바스크립트에서와는 달리 타입스크립트에서는 매개변수의 개수에 맞춰 전달인자를 전달해야한다.
let greeting = (firstName: string, lastName: string): string => {
return `hello, ${firstName} ${lastName}`;
}
//에러가 납니다.
greeting('coding');
//정상적으로 작동합니다.
greeting('coding', 'kim');
//너무 많은 매개변수를 보내 에러가 납니다.
greeting('coding', 'kim', 'hacker');
TypeScript 유니온타입
유니온 타입은 둘 이상의 타입을 합쳐서 만들어진 새로운 타입
| 연산자를 이용하며 자바스크립트의 || (or)연산자와 같이 보면 된다
function printValue(value: number|string): void {
if (typeof value === "number") {
console.log(`The value is a number: ${value}`);
} else {
console.log(`The value is a string: ${value}`);
}
}
printValue(10); // The value is a number: 10
printValue("hello"); // The value is a string: hello
printvalue값이 넘버나 스트링 값중 둘중하나일때인데 만약value가 숫자이면 if문을 출력하고
그게아니라 value 값이 문자열이면 else구문을 출력한다.
TypeScript 인터섹션 타입
인터섹션은 둘 이상의 타입을 결합하여 새로운 타입을 만드는 방법이며 & 연산자를 표현한다
자바스크립트에서는 && (and)연산자와 같다고 보면 된다.
type User = Developer & Person;
interface Developer {
name: string;
skill: string;
}
interface Person {
name: string;
age: number;
}
function askSomeone(someone: Developer & Person) {
console.log(someone.age);
console.log(someone.name);
console.log(someone.skill);
}