youtube 코딩앙마님의 타입스크립트 강좌를 보고 정리한 내용입니다.
let age:20;
let isStudent:boolean = false;
let a:number[] = [1, 2, 3];
let b:Array<number> = [1, 2, 3];
let days:string[] = ['mon', 'tue', 'wed'];
let days2:Array<string> = ['mon', 'tue', 'wed'];
let b:[string, number];
b = ['z', 1];
b[0].toLowerCase();
b[1].toLowerCase(); // error
function showError():never {
throw new Error();
}
function infLoop():never {
while (true) {
// do sth...
}
}
enum Os {
Window = 3,
Ios = 10,
Android // 11이 됨
}
console.log(Os['Ios']) // 10
console.log(Os[10]) // "Ios"
enum Os {
Window = 'win',
Ios = 'ios',
Android = 'and'// 11이 됨
}
let myOs:Os;
myOs = Os.Window
let a:null = null;
let b:undefined = undefined;
프로퍼티를 정해서 객체를 사용하고 싶을 때 interface 를 사용함
let user:object;
user = {
name : 'xx',
age : 20
}
console.log(user.name) // error => need interface
type Score = 'A' | 'B' | 'C' | 'D'
interface:User {
name : string;
age : number;
gender? : string; // 있어도되고 없어도되는 프로퍼티. 하지만 있다면 무조건 string
readonly birth : number;
[grade:number] : Score; // key: number, property : Score값 중 하나인 값을 여러개 받을 수 있음
}
let user : User = {
name : 'xx',
age : 20,
birth : 2021,
1 : 'A',
2 : 'B',
}
user.age = 10; // age 프로퍼티 수정 가능
user.gender = 'female' // gender? 로 정의되어있기 때문에 추가가능
user.birth = 20201; // error!!! readonly 수정 불가능
console.log(user.age) // 10
console.log(user.name) // 'xx'
interface Add {
(num1:number, num2:number): number;
}
const add : Add = function(x, y) {
return x + y;
}
add(10, 20); // 30
interface IsAdult {
(age:number) : boolean;
}
const a:IsAdult = (age) => {
return age > 19;
}
a(20) // true
// implements
interface Car {
color: string;
wheels: number;
start(): void;
}
// 위의 속성값을 모두 적어야 에러가 발생하지 않음
class Bmw implements Car {
color;
wheels = 4;
constructor(c:string) {
this.color = c;
}
start() {
console.log('go...');
}
}
const b = new Bmw('green');
console.log(b) // Bmw : {"wheels" : 4, "color" : "green"}
b.start(); // 'go...'
//extends
interface Benz extends Car {
door: number;
stop(): void;
}
// 속성을 모두 입력해야 함
const benz : Benz = {
door : 5,
stop() {
console.log('stop');
}
color : 'black';
wheels : 4
}
// 각각의 인터페이스를 동시에 확장해서만들 수 있음
interface Car {
color : string;
wheels : number;
start() : void;
}
interface Toy {
name : string;
}
interface ToyCar extends Car, Toy {
price : number
}