TypeScript

1. 제네릭이란?제네릭은 다양한 타입 간 재사용성을 높이기 위해 사용하는 타입스크립트의 기능입니다. 코드를 작성할 때 미리 타입을 지정하지 않고, 필요한 시점에 타입을 결정하도록 하는 방식입니다. 2. 제네릭 사용법2-1. 함수의 제네릭제네릭을 함수에 적용하면, 다양한 타입의 매개변수나 반환 값을 처리할 수 있습니다.function getIdentity(value: T): T { return value;}// 사용 예시const num = getIdentity(42); // number 타입const str = getIdentity('Hello World'); // string 타입 2-2. 호출 시그니처의 제네릭호출 시그니처에 제네릭을 적용하면 함수의 타입을 사전에 정의하고 제네릭으로 유연성을 높일 ..

1. 교차 타입 (Intersection Types)교차 타입은 여러 타입을 결합하여 하나의 새로운 타입으로 만드는 기능입니다. 이 타입은 각 타입의 모든 멤버를 포함하므로, 여러 타입의 특징을 모두 만족해야 합니다. 이를 활용하면 기존 타입을 확장하거나 새로운 기능을 추가하는 데 유용합니다. & 연산자를 사용합니다.type ProductItem = { id: number; name: string; price: number;};type Discount = { discountAmount: number;};type ProductItemWithDiscount = ProductItem & Discount;const discountedProduct: ProductItemWithDiscount = { id..

1. enum이란?enum은 열거형 타입으로, 이름이 있는 상수들의 집합을 정의합니다. 이는 문자열이나 숫자 값을 명확하게 관리하고, 코드에서 의미를 부여하는 데 사용됩니다. 2. enum의 기본 사용법enum은 숫자 기반 열거형과 문자열 기반 열거형으로 나뉩니다.1 숫자 열거형 (Numeric Enum)숫자 열거형은 자동으로 0부터 시작하여 값이 1씩 증가합니다.enum Direction { Up, // 0 Down, // 1 Left, // 2 Right, // 3}console.log(Direction.Up); // 출력: 0console.log(Direction.Down); // 출력: 1console.log(Direction[2]); // 출력: "Left" (역방향..

1. JavaScript에서의 Array 사용JavaScript에서는 하나의 배열에 숫자, 문자열, 함수 등 다양한 타입의 데이터를 혼합해서 넣을 수 있습니다.const array = [1, "JavaScript", () => console.log("Hello")];console.log(array[0]); // 1console.log(array[1]); // "JavaScript" 이처럼 JavaScript의 배열은 다양한 타입의 데이터를 자유롭게 담을 수 있는 유연성을 제공하지만, 잘못된 데이터가 배열에 포함될 가능성도 큽니다. 이로 인해 데이터의 타입 일관성을 보장하기 어렵고, 예상치 못한 버그가 발생할 수 있습니다. 2. TypeScript에서 Array 타입 선언 방법TypeScript에서는 Ar..

오늘은 타입스크립트의 고급타입인 any와 unknown 에 대해 학습했다. 과거 타입이 불분명할 때 any타입을 주로 사용했었는데 사용하다보니 점점 any 사용이 빈번해지고 추후에 any타입을 모두 없애느라 고생했던 기억이 난다. 그때는 any는 모든 타입을 허용하고 사용을 지양해야 된다 정도만 알고있었던 정도였지만 오늘 학습을 통해 any타입에 대해 완벽히 파악할 수 있었고 unknown타입은 사용해보지 않았지만 어떤 상황에서 사용해야하는지 학습할 수 있었다.   any 타입TypeScript의 any 타입은 자바스크립트의 모든 자료형과 매핑될 수 있습니다. 자바스크립트의 typeof 연산자나 Object.prototype.toString.call(...)로는 any라는 타입을 찾을 수 없으며, 이는 ..

타입스크립트를 사용하면서 아직 타입스크립트에 대한 이해가 부족하다고 느껴 "우아한 타입스크립트 with 리액트" 서적을 사서 공부하고 있다. 마침 티스토리에서 오블완 챌린지를 시작하기도 했고 오늘부터 3주간 챌린지에 참여하면서 타입스크립트 공부 일지를 작성해 볼 생각이다.  타입을 선언할 때 type, interface 어떤 것을 사용해야 할까? 1. type 키워드의 특징과 사용 사례type은 타입에 대한 별칭을 만들어주는 기능을 합니다. 다음과 같은 경우에 유용하게 사용할 수 있습니다.간단한 객체나 유니온 타입, 교차 타입: type은 유니온(|)이나 교차(&)와 같은 복잡한 타입 조합을 처리할 때 편리합니다.프리미티브 타입 정의: 특정 값이 제한된 타입이 필요할 때 유용합니다. 예를 들어, type..

오늘은 타입스크립트를 공부한지 따끈따끈한 2일차가 되는 날이다 ! 타입스크립트 문법 중 열거형 ,인터페이스 ,타입 별칭에 대해 배우고 익혔다. 헷갈렸던 부분이나 다시 알아두면 좋을 부분에 대해 정리해볼것이다 ! 타입스크립트 열거형 (Enum) 특정 값의 집합을 정의할 때 사용됨 , 문자형 열거형과 숫자형 열거형을 지원 enum Color { Black, Red, Green, } 위의 예시에는 Color 라는 열거형을 정의하고 값으로는 Black, Red, Green 세개의 값을 가짐 숫자형 열거형 디폴트 값으로 숫자형을 사용하며 값은 자동으로 0 부터 1씩 증가하는 형태 , 또한 값을 수동으로 지정할 수도 있음 enum Color { Red = 1, Green = 2, Blue = 4, } 문자형 열거형..

오늘은 타입스크립트를 공부한지 1일차가 되는 날이다 ! 오늘은 타입스크립트에 대한 개념과 여러가지 문법에 대해 공부해보았다. 공부한 것을 토대로 블로깅을 해볼것이다 ! 타입스크립트 ? 자바스크립트에 정적타입 검사와 클래스 기반 객체 지향 프로그래밍 등의 기능을 추가하여 개발된 언어 타입스크립트가 왜 필요한가 ? 자바스크립트는 동적 타입이 결정되어 유연하고 다양한 라이브러리와 프레임워크를 사용할 수 있는 장점이 있지만 타입의 명시성이 부족하다는 단점이 존재함. 예를 들어 문자열과 숫자를 더하여 문자열이 되는 것 처럼 타입을 명시적으로 지정하지 않아도 동작하는 경우가 많아 예기치 못한 결과를 초래함 -> 이를 해결하기 위해 타입스크립트가 등장하게 됨 ! 타입스크립트 Type Boolean(불리언) 타입 가..