쭈링이.log 쭈링이.log

Typescript exrpot typescript export 란 파일에 선언되어있는 변수 및 함수 등을 다른 파일로 내보내서 사용한다는 것이다. // test.ts // export 키워드를써서 다른 파일에서 사용할 수 있도록 한다. export var myName: string = 'zelord'; export var myAge: number = 27; export 키워드를 써서 다른 파일에 사용할 수 있도록 선언한다. export 키워드는 변수 뿐만 아니라 type 도 내보낼 수 있다. // test.ts export type MyName = string;// export 키워드를 사용하여 type 도 내보낼 수 있다. Typescript import Typescript import란 다른 파일에..

Typescript protected Typescript protected 이란 extends된 클래스에서는 사용이 가능하지만 자식들은 사용이 불가능하다. class User { protected age = 9;// protected 키워드로 age 변수 선언 } class NewUser extends User { chageAge() { this.age = 29;// extends된 클래스 내에서 age를 사용 할 수 있다. } } let person = new NewUser(); console.log(person.age); // 자식에서 age를 불러와 사용할 수 없다. Typescript static Typescript static 이란 부모 클래스에 변수가 직접 부여되여서 부모를 통해 사용할 수 있..

Typescript public Typescript public 이란 class에서 쓰이는 키워드이다. public 이 붙은 변수에는 모든 자식들이 사용 가능하다. class Pet {// 클래스를 선언한다. public name = 'bomi';// public 키워드 선언 (생략이 가능) constructor(a) { this.name = a; } } let myPet = new Pet('bomi');// 클래스 변수를 선언한다. myPet.name = 'ruru';// public 키워드가 붙은 변수를 사용/수정이 가능하다. public 키워드는 축약어를 사용하여 간단하게 코드를 짤 수 있다. class Person {// 클래스선언 constructor(public name: string) {//..

Typescript never type Typescript never type 이란 function return 값에 붙일 수 있고, 에러함수를 사용할때 이거나 무한루프함수에서 사용하다. never type 은 return 값이 없어야하고 endpoint 가 없어야한다. // return값이 없는 error 함수 function myNever(): never { throw new Error(""); } // 무한루프함수 function myNever(): never { while (true) { /// } } 함수에는 return undefined 가 기본 내장되어있다. function myNever(param: string) { // param은 오직 string 타입만 올 수 있다. if(typeof..

Typescript Narrowing Typescript Narrowing 이란 타입 에러를 피하기 위해 조건에 따라 변수를 더 정확한 타입으로 좁히는 방법이다. Typescript Narrowing 방법중 && 연산자를 사용하여 null 또는 undefined type 을 체크해 줄 수 있다. function narrowFn(a: string | undefined) { // string 타입이 아닌 undefined 타입이 올 경우 if ( a && typeof a === 'string' ) { // if문으로 narrowing 처리를 하여 string 타입만 허용 ... } } typeof 연산자는 number, string, boolean, object 등 타입을 지정하는것이 제한적이다. type키..

Typescript rest & spread rest parameter란 함수의 파라미터의 값 갯수가 가변적일때 ...을 사용하여 여러개의 파라미터가 들어올 수 있도록 한다. function myFunc(...a: number[]) {// ...을 사용하여 갯수제한을 없앤다. // 배열 형태로 파라미터 타입을 선언한다. } myFunc(1, 2, 3, 4, 5)// 5개의 파라미터 myFunc(1, 2)// 2개의 파라미터 다른 파라미터와 같이 사용 하기 위해선 rest parameter를 맨 마지막에 선언해야한다. function myFunc(x:string, ...a: number[]) {// ...a는 뒤에 있어야한다. } spread operation이란 객체 또는 배열을 다른 객체, 배열에 복제..

Typescript Class Type Typescript 에서 Class Type 을 선언하는 방법은 이러하다. class PetClass { name: string;// 변수의 타입을 지정한다. constructor(paramName: string) {// 파라미터의 타입을 지정한다. this.name = paramName; } classFn(paranX: string) { // 클래스 내 함수도 타입을 선언 할 수 있다. console.log('Hello ' + paranX); } } let pet1 = new PetClass('bomi');//지정된 파라미터 타입의 값만 들어갈수있다. console.log(pet1); pet1.classFn('bomi'); // 함수 파라미터 타입의 값만 들어갈수..

Typescript DOM 제어 javascript 에서 DOM 조작 및 제어를 할땐 타입과 상관없이 조작하지만 typescript 에선 조작 및 제어를 하기위한 HTML 태그의 타입으로 Narrowing 처리를 해야한다. tsconfig.json 파일에서 Null 체크를하기위해 옵션을 추가해야한다. "strictNullChecks": true//엄격한 null타입 체크 HTML 태그 속 글자 변경 예시 타이틀입니다. 위의 html태그의 글자를 변경하기위해 타입스크립트에서 narrowing 처리를 해야한다. let title = document.querySelector('#title'); title.innerHTML = '타이틀 변경'; // narrowing이 필요하다. 에러 // narrowing 처..