전체 글 43

타입 수정이 이렇게 쉬웠어? 유틸리티 타입 모음집

유틸리티 타입이란?TypeScript에는 자주 쓰이는 타입 변환을 빠르게 할 수 있도록 미리 만들어진 타입 도우미들이 있다.이걸 유틸리티 타입(Utility Types)이라고 부르고, 타입을 재활용·수정할 때 코드량을 줄여준다.// tsconfig.ts{ "compilerOptions": { "lib": ["ESNext"] }} 이렇게 설정하면 최신 빌트인 유틸리티 타입을 쓸 수 있다.주요 유틸리티 타입1) Pick객체 타입에서 원하는 프로퍼티만 뽑아 새 타입 만들기.type Porsche = Pick;2) Omit객체 타입에서 원하지 않는 프로퍼티만 빼고 새 타입 만들기.type Student = Omit; 2) Partial객체 타입의 모든 프로퍼티를 선택적(optional)으로 변경.RES..

typescript 2025.08.15

전역 변수 지옥 탈출기: CommonJS부터 ES6까지 흐름 한눈에

1. 전역 변수 시대옛날 JS는 모든 파일이 전역 스코프를 공유해서변수 이름 충돌·유지보수 문제 심각했다.2. 모듈 시스템 등장 - CommonJS: `module.exports`, `require()` (Node.js 기본) - RequireJS: `define()`, `require()` (브라우저 AMD 방식) → 파일별 독립 스코프로 문제 해결.3. ES6 모듈(표준)`import`, `export` 키워드 도입.성능 최적화 쉬움, 현재 표준 방식.// math.jsexport function add(a, b) { return a + b; }// app.jsimport { add } from './math.js';

javascript 2025.08.15

TS에서 여러 파일을 묶고 싶을 땐? 배럴(Barrel)을 이용하자!

배럴은 무엇을 담는 통이다.타입스크립트에도 배럴 개념이 있다. 예를들어,‘./hero’ 는 ‘./hero/index.ts' 를 가리킨다.따라서, 묶고 싶은 파일들이 있으면 hero같은 폴더를 만들고, 파일들을 넣어놓고 index.ts를 만들면 된다.// ./Hero/index.tsexport * from "./Button";export * from "./Input";export * from "./Modal";// 사용할 땐import { Button, Input, Modal } from "./components";

카테고리 없음 2025.08.15