개발새발

콜백 함수의 매개변수, 생략해도 될까?  TypeScript를 처음 사용할 때 혼란스러운 개념 중 하나는 콜백 함수의 매개변수는 생략해도 되는 이유이다. 평소에는 함수 매개변수에 타입을 반드시 지정하라고 하면서, 콜백에서는 왜 괜찮을까? 이번 글에서는 그 이유를 예제와 함께 설명하고, 문맥적 추론(Contextual Typing) 과 옵셔널 매개변수의 함정에 대해서 정리해 보았다.  기본 예제function example(callback: (error: Error, result: string) => void) {}example((e, r) => { console.log(e.message, r);}); callback은 두 개의 매개변수를 받는 함수: (error: Error, result: string..

TypeScript 함수 오버로딩: 언제, 왜, 어떻게 쓸까? JavaScript에서는 함수의 인자 개수나 타입에 제약이 없다. 하지만 TypeScript에서는 매개변수의 타입과 개수를 명확히 지정해야 하므로, 복잡한 함수 시그니처를 다룰 때 오버로딩(Overloading)이 매우 유용해진다.   오버로딩이 필요한 이유아래처럼 숫자 덧셈 또는 문자열 결합을 처리하는 함수를 생각해자. function add(x: string | number, y: string | number): string | number { return x + y;} 이 코드에는 두 가지 문제점이 있다:+ 연산자는 서로 다른 타입 (number + string)에 사용할 수 없기 때문에 컴파일 에러 발생add(1, '2') 같은 호출..

함수는 자바스크립트에서 중심이 되는 기능이고, TypeScript에서는 여기에 정확한 타입 정보를 부여함으로써 코드의 안정성과 가독성을 크게 높일 수 있다. 이번 글에서는 함수 타이핑에 대해 알아보자.   매개변수 타이핑의 기본function example(a: string, b?: number, c = false) {}  a: 필수 매개변수b: 옵셔널 매개변수 (number | undefined)c: 기본값이 설정된 매개변수 (boolean, 자동으로 옵셔널 취급됨)example('hi', 123, true);example('hi', 123);example('hi');  기본값이 있는 매개변수는 타입 추론이 되며, 뒤쪽에 위치해야 한다.   나머지 매개변수 (...rest)function example..

TypeScript에는 타입을 조건에 따라 유연하게 지정할 수 있는 컨디셔널 타입(Conditional Type) 문법이 존재한다. 마치 자바스크립트의 삼항 연산자처럼 동작하지만, 타입 레벨에서 조건 분기를 처리할 수 있어 타입 설계에 유용하다.  기본 문법type A1 = string;type B1 = A1 extends string ? number : boolean; // numbertype A2 = number;type B2 = A2 extends string ? number : boolean; // boolean 여기서 extends는 A2가 string 타입에 할당될 수 있는가? 를 검사한다. 할당 가능하다면 참(true), 아니면 거짓(false)이 되어 삼항 연산자에 따라 타입이 결정 된다...

TypeScript를 사용하다 보면 자주 마주하는 질문이 있다. “이 객체는 이 타입에 대입할 수 있을까?” 그에 대한 해답은 타입 호환성(type compatibility) 이라는 원칙 안에 있다. 이 글에서는 객체 간의 타입 대입 가능 여부를 구조적 타이핑과 넓은/좁은 타입 개념을 통해 설명하겠다.  기본 예시 – 속성이 포함되면 대입 가능interface A { name: string;}interface B { name: string; age: number;}const aObj = { name: 'zero' };const bObj = { name: 'nero', age: 32 };const aToA: A = aObj; // ✅ 가능const bToA: A = bObj; // ✅ 가능 (속성 더..

JavaScript에서는 class 문법을 통해 객체 간 상속이 가능하다. 마찬가지로 TypeScript에서도 타입끼리 상속(확장) 하여 중복 없이 타입을 재사용할 수 있다.자바스크립트에서의 상속: 클래스 예시class Animal { constructor(name) { this.name = name; }}class Dog extends Animal { bark() { console.log(`${this.name} 멍멍`); }}class Cat extends Animal { meow() { console.log(`${this.name} 야옹`); }}  Dog와 Cat 클래스는 Animal 클래스를 상속받기 때문에 name 속성을 중복해서 작성하지 않아도 된다.   TypeS..

TypeScript는 타입을 집합(set) 처럼 다룬다. 집합 이론의 관점에서 타입 연산자를 해석하면, 타입 시스템을 더 명확하게 이해할 수 있고, 복잡한 타입도 직관적으로 설계할 수 있다.  이번 글에서는 | (유니언), & (인터섹션), 그리고 unknown, never 등의 특수 타입을 집합 개념으로 설명하겠다.  유니언 타입: |는 합집합 유니언(union)은 둘 중 하나라도 만족하는 값을 의미한다. 수학적 개념으로는 합집합이다. let strOrNum: string | number = 'hello';strOrNum = 123; 타입 string | number는 문자열이거나 숫자인 값을 모두 포함하는 집합이다.    인터섹션 타입: &는 교집합 인터섹션(intersection)은 두 타입을 모두..

TypeScript는 객체의 구조를 엄격히 관리할 수 있도록 다양한 문법과 기능을 제공한다. 이번 글에서는 객체의 속성과 메서드에 적용할 수 있는 주요 특징들을 중심으로 살펴보자. 이는 interface나 type alias 중 무엇을 쓰든 공통적으로 적용되는 개념이다.  Optional과 Readonly 수식어객체의 속성에는 ?를 붙여 옵셔널(optional)로 만들거나, readonly를 붙여 읽기 전용(read-only) 으로 만들 수 있다. interface Example { hello: string; world?: number; // 옵셔널 readonly wow: boolean; // 읽기 전용 readonly multiple?: symbol; // 읽기 전용 +..