SPACE RUMI

Hi, I am rumi. Let's Splattack!

[STUDY] 스터디/TypeScript 6

[Typescript] 네임스페이스 ts / 타입스크립트 모듈 import export

모듈(module) 모듈이란, 서로 연관있는 데이터나 함수를 하나로 묶은 단위이다. 모듈은 코드와 선언 둘 다 포함될 수 있으며, 재사용성, 고립성, 번들링을 위해 사용된다. 모듈을 사용하게되면 다른 파일에서 선언한 것들을 가져와 사용할 수 있다. ts 파일을 하나 만들고, 변수선언을 해주면 아래와 같은 에러가 발생한다 ex) test1.ts cannot be compiled under '--isolatedModules' because it is considered a global script file. Add an import, export, or an empty 'export {}' statement to make it a module. test1.ts 파일을 모듈로 만들려면 import, expor..

TypeScript utility type / 타입스크립트 유틸리티 타입

Partial T의 모든 프로퍼티를 옵셔널로 만드는 타입. interface Product{ id: number; name: string; } const updateProduct(product:Product, updateProduct:Partial){ return {...product, ...updateProduct}; } const product1 = { id:1; name:'new desk'; } const product2 = updateProduct(product1, {name:'old desk'}); updateProduct 함수는, 첫번째 매개변수를 두번째 매개변수로 덮어씌우는 함수다. product2는 product1에 name을 'old desk' 로 변경했다. 는 인 셈이다. Readonl..

[Typescript] 타입스크립트 리터럴 / typescript literal types / 문자열 리터럴, 숫자형 리터럴 타입

리터럴 타입 좁히기 const sayGoodBye = "Goodbye World!" // "Goodbye World!"로 타입을 지정 let sayBye = "Bye World!" // 문자열로 타입을 지정 const 로 선언한 객체는 변하지 않기 때문에 타입스크립트는 이 문자열 타입을 "Goodbye World!"라는 단 하나의 타입으로 지정한다. 이것을 문자열 타입 좁히기라고 한다. 문자열 리터럴 타입 문자열 리터럴타입은 유니언타입, 타입 가드, 타입별칭과 잘 결합된다. type Size = "small" | "large" | "xlarge"; const thisSize = (size:Size) => { console.log(`this phone is too ${size}`); } thisSize("..

[Typescript] 타입스크립트 함수 타입 / function type

함수 타이핑 const typeFunc = (x: number, y: number): number => { return x + y; } 인자로 들어올 x, y의 타입과 반환타입을 선언해줄 수 있다. 반환되는 값의 타입은 return문을 보고 추론할 수 있으므로 생략이 가능하다. 전체 타입 작성하기 let allTypeFunc: (a: number, b: number) => number = function(x: number, y: number): number { return x + y; }; let noTypeFunc = function(x, y){return x+y}; 위 코드를 보면 allTypeFunc 변수는 number 타입을 가진 a와 b를 인자로 받고, number를 리턴해주는데, 이걸 함수에 ..

[TypeScript] 타입스크립트 인터페이스 / typescript interface / typescript readonly / interface extends

인터페이스 (interface) interface ProductModel { // 인터페이스 선언 id: number; } // productModel 인터페이스를 타입으로 갖는 product 객체를 받아 콘솔로 찍음 const printProduct = (product: ProductModel) => { console.log(product); }; let myProduct = { id: 10, productName: "my first product" }; printProduct(myProduct); // {id: 10, productName: "my first product"} 인터페이스는 정의된 프로퍼티가 있는지와, 이 프로퍼티의 타입이 맞는지만 검사한다. 정의되지 않은 프로퍼티는 검사하지 않고, 프..

[Typescript] 타입스크립트 기본타입 / typescript enum / typescript any / typescript void / typescript unknown

타입스크립트 기본 타입 타입스크립트에는 다양한 기본타입들이 있다. boolean, number, string, Array, object, tuple, enum, any, void, null, undefiend, never, unknown 에 대해서 알아보자. 불리언(Boolean) true, false 값 관례로 앞에 is~ 를 붙인다. (ex: 모달 열려있니?) const isOpenModal:boolean = true; 숫자(Number) 16진수, 10진수, 2진수 8진수 리터럴값을 지원하는 부동소수값. const integer: number = 100 const hex:number = 0xefef; // 61423 문자열(String) 텍스트 데이터타입. 큰따옴표("), 작은따옴표 ('), 백틱(..

반응형