import export 사용 (a.ts) export var 이름 = 'hong'; export var 나이 = 20; (b.ts) import {이름, 나이} from './a' console.log(이름) 두 개 이상의 파일로 모듈화를 한 경우, 서로 변수를 주고받기 위해서 export 내보내고 import 가져오는 방법이다. import * from './a'; import *을 하면 모든 데이터를 가져올 수 있다. (a.ts) export type Name = string | boolean; export type Age = (a :number) => number; (b.ts) import {Name, Age} from './a' let 이름 :Name = 'kim'; let 함수 :Age = (..
protected 키워드 class User{ protected x=10; } protected 키워드를 통해 필드 생성 class NewUser extends User{ doThis(){ this.x = 20; } } => extends로 상속받은 자식까지 필드값을 사용할 수 있게 제한. this 연산자를 통해 부모의 필드값에 접근할 수 있음. static 키워드 class User { x = 10; y = 20; } let john = new User(); john.x //가능 User.x //불가능 static 사용 전 => 인스턴스 객체로 필드값을 접근할 수 있으나, 클래스. 필드 방법으로는 접근할 수 없음. class User { static x = 10; y = 20; } let john = ..
public 키워드 class User { public name: string; constructor(){ this.name = 'kim'; } } let 유저1 = new User(); 유저1.name = 'park'; //가능 속성값을 어디서나 수정할 수 있음. private 키워드 class User { public name :string; private familyName :string; constructor(){ this.name = 'kim'; let hello = this.familyName + '안녕'; //가능 } } let 유저1 = new User(); 유저1.name = 'park'; //가능 유저1.familyName = 456; //에러 발생 class { } 안에서만 속성값 수..
null & undefined 체크하는 법 1 && null && 3 // null 반환 undefined && '안녕' && 100 // undefined 반환 &&연산자 사용 => 기존 의미: 조건식 2개 비교 후 참/거짓 판별하는 논리연산자 => 자료형 비교 시: &&사이에서 처음 등장하는 falsy값을 찾고 그게 아니면 마지막 값을 반환 falsy값 : false와 유사한 기능을 가진 null, undefined, NaN 등의 값을 뜻함 Narrowing을 할 경우 &&연산자를 잘 이용하면 if문을 간략하게 줄일 수 있음. if (변수 && typeof strs === "string") {} 1. 변수가 falsy값을 가진다면 if문을 실행하지 않음. 2. 변수가 string값이라면 if문을 실행..
rest 파라미터 function 함수(...a:number[]){ console.log(a) } 함수(1,5,3,5,6,6) ... 키워드로 표현하며 파라미터의 개수를 예측하기 어려운 경우 사용 1. rest 파라미터는 일반 파라미터 뒤에만 올 수 있다. 2. rest 파라미터 자리에 넣은 값은 [ ] array 안에 모두 담겨있다. spread 오퍼레이터 let arr = [1,2,3]; let arr2 = [4,5]; let arr3 = [...arr, ...arr2]; console.log(arr3) ... 키워드로 rest 파라미터와 표현방식은 동일. 하지만 파라미터로 주는 값이 아니라, array나 object에 사용한다. 1. 위치는 상관없이 사용할 수 있다. 2. 괄호를 벗겨준다는 의미로 ..
interface 문법 interface Square { color :string, width :number, } let 네모 :Square = { color : 'red', width : 100 } type 문법이랑 크게 다를 것은 없다. 차이점을 설명하자면 1. 중복선언이 가능하다 interface Student {name : string} interface Student {score : number} Student라는 인터페이스 안에는 name과 score 변수가 둘 다 존재한다. extends 키워드 사용 전 interface Student { name :string, } interface Teacher { name :string, age :number } 다른 인터페이스이지만 중복되는 변수가 존..
arrow function function 함수(){ } // 일반 함수 선언 let 함수 = () => { } // arrow 함수 선언 우선 함수 선언 방법은 두 가지로 분류할 수 있다. 1. 일반 함수 2. arrow 함수 =>의 뜻은 function이랑 같음. function type-alias type 함수타입 = (a :number) => number; 함수의 타입을 저장하기 위한 선언방법 => type 함수타입명 = (파라미터 : 타입) => 리턴타입 let 함수 : 함수타입 = function (a) { return a+1 } 선언한 타입함수를 사용해 보자. => let 함수명 : 함수타입명 = function(파라미터) {리턴 값} 이렇게 let을 사용하여 변수처럼 함수에도 type-al..
Literal Type 사용법 let name :'hong'; let age :20; 변수 : Literal타입 형태로 선언 name = 'hong' name = 'kim' //에러 발생 name이라는 변수는 'hong' 타입으로 선언했기 때문에 'kim'타입은 올 수 없음. let 방향: 'left' | 'right'; 방향 = 'left'; or 연산자 사용 가능. => 방향 = 'left' or 'right' 타입만 사용 가능. function 함수(a: 'hello'):(1 | 0){ return 1 } 함수('hello') 함수도 마찬가지로 1. 파라미터 타입에 Literal타입으로 선언 가능. 2. return타입 또한 Literal타입 사용 시 그 값만 리턴 가능. as const 문법 사용..
