TypeScript

개념 TypeScript javascript의 대체 언어이다. .ts 확장자를 사용하고 컴파일의 결과, .js 파일로 출력한다. 최종적으로 javascript 코드를 구동시키는 것 javascript 와 달리 타입을 명시 할 수 있어 코드 작성시 에러를 줄 일 수

타입의 종류 : 타입이란 자바스크립트에서 다루는 값의 형태에 대한 설명이다. (형태란, 값에 존재하는 속성과 메서드 그리고 내장되어 있는 typeof 연산자가 설명하는 것을 의미) - 일곱가지의 원시타입 null undefined boolean string number bigint symbol 타입 시스템 코드를 읽고 존재하는 모든 타입과 값을 이해한다...

유니언(Union) 값에 허용된 타입을 두 개 이상의 가능한 타입으로 확장하는 것 "이거 혹은 저거" 같은 타입을 Union 이라고 함 유니언을 선언한 모든 가능한 타입에 존재하는 멤버 속성에만 접근 할 수 있다. 내로잉(Narrowing) 값에 허용된 타입이 하나 이상의 가능한 타입이 되지 않도록 좁히는 것!! 타입을 좁히는데 사용할 수 있는 논리적 검...

객체 타입 {...} 구문을 사용해서 객체 리터럴을 생성 값의 속성에 접근하려면 value.멤버 | value['멤버'] 1.객체 타입 선언 별칭 객체 타입 구조적 타이핑 타입을 충족하는 모든 값을 해당 타입의 값으로 사용할 수 있다. 매개변수나 변수가 특정 객체 타입으로 선언되면 타입스크립트에 어떤 객체를 사용하든 해당 속성이 있어야 한다. 구조적...

함수 매개 변수 함슈으의 매개변수도 타입을 지정할 수 있다. 타입의 정보가 선언되지 않는다면 any타입으로 간주하며 매개변수의 타입은 무엇이든 될 수 있다. 필수 매개변수 함수에 선언되 모든 매개변수가 필수라고 가정하자. 함수가 잘못된 수의 인수로 호출되면, 타입스크

타입스크립트는 초기 배열에 데이터 타입이 있는지 기억하고, 배열이 해당 데이터 타입에서만 작동하도록 제한한다. (배열이 데이터 타입을 하나로 유지) 아래의 예제를 보면 string 타입 값 추가는 하용되지만 다른 데이터 타입 추가는 혀용되지 않는다. 배열 타입 배열을

타입별칭 vs. 인터페이스 debut: number와 namae: string을 가진 객체를 타입 별칭으로 구현하는 간락한 구문 인터페이스로 구현한 동일한 구문 => 위의 두 구분은 거의 같다. tip) 세미콜론(;)을 선호하는 타입스클비트 개발자는 대부분 인터페이스 뒤가 아닌 타입별창 뒤에 세미콜론을 넣는다. 이 기본 설정은 세미콜론을 사용해 변수를...

✅ 개념👉 가장 기본적인 타입let num: number = 10;let str: string = "hello";let isDone: boolean = true;✅ 종류number 👉 숫자string 👉 문자열boolean 👉 true / falsenullund

npm init -y👉 프로젝트를 시작하면 package.json이 생성됨📌 역할프로젝트 정보 저장라이브러리 관리👉 쉽게 말하면 프로젝트 설명서npm i @types/node👉 Node.js 기능을 TypeScript가 이해하도록 도와줌console.log(pr

타입스크립트를 이해한다는 것은 단순히 문법을 아는 게 아니라다음 3가지를 이해하는 것이다.let num: number = 10;let name: string = "army";👉 값의 종류를 명확하게 지정let num: number = 10;let literal: 10

👉 "이 값은 이 타입이야!" 라고 TypeScript에게 알려주는 것실제로 값이 바뀌는 게 아님 ❌컴파일러만 속이는 용도 ✔️let value = {} as Person;👉 “이건 Person 타입이야!” 라고 믿게 만드는 것📌 문제 상황let person =

타입 좁히기(Type Narrowing) 는여러 타입이 섞여 있는 값(유니온 타입)을👉 조건문을 통해 더 구체적인 타입으로 줄이는 것let value: string | number;이 상태에서는 어떤 타입인지 모르기 때문에👉 바로 메서드 사용 불가능value.toU

👉 겹치지 않는 여러 타입을 하나로 합친 타입보통 문자열 리터럴 타입(tag, state 등)을 이용해 각 타입을 구분한다.쉽게 말하면:Admin 👉 관리자Member 👉 회원Guest 👉 손님이 3개는 절대 같은 사람이 될 수 없음 → 서로 겹치지 않음그래서

👉 함수는 이렇게 생각하면 쉬워요:“어떤 값을 받고 → 어떤 값을 돌려준다”매개변수 타입 + 반환 타입 정의✔ 의미a, b → number 타입 받음결과 → number 반환const add = (a: number, b: number): number => a + b;

👉 개념 👉 같은 함수 이름인데, 사용하는 방법이 여러 개 있는 것하나의 함수에 여러 타입의 매개변수를 정의하는 방식예를 들어:func(1) 👉 하나만 넣으면 ×20func(1,2,3) 👉 3개 넣으면 합function func(a: number): void;f

👉 객체의 모양(구조)을 정의하는 설계도👉 이렇게 만들어두면✔️ 객체는 반드시 이 구조를 따라야 함둘 다 타입 이름을 만들어줌type A = number | string; // 유니온type B = number & string; // 인터섹션👉 interface는

let studentA = { name: 'army', age: 2, grade: 'A+' };let studentB = { name: 'tan', age: 3, grade: 'B+' };👉 이렇게 계속 만들면?코드 반복 ❌유지보수 어려움 ❌👉 "틀(설계도)"을 만

“타입을 나중에 정하는 함수/타입” 즉, 제네릭 = "상자" 라고 생각하기함수가 아니라 "타입 시스템" 👉 실행이 아니라 타입 체크용타입을 변수처럼 사용호출 시 타입 결정됨재사용성 증가👉 의미T = “아직 뭔지 모르는 타입”나중에 넣는 값으로 결정됨✔ 여기서 =

👉 핵심 개념“객체 타입에서 특정 값 타입만 꺼내쓰기”📌 예시 (쉽게 바꿔서 설명)👉 해석User'name' → name 타입 꺼냄User'address' → address 객체 통째로User'address' → city만 꺼냄👉 의미“User 타입 안에 있는

👉 “타입으로 if문 쓰는 것”type A = number extends string ? string : number;👉 해석:number가 string이냐?❌ 아니니까 → number👉 그냥 이렇게 생각해:"T가 string이면 YES, 아니면 NO"👉 속성이

👉 이미 만들어진 “편리한 타입 도구”쉽게 말하면👉 타입을 다시 만들지 않고 “가공”해서 쓰는 기능💡 개념👉 모든 프로퍼티를 선택적으로(?) 바꿔줌👉 쉽게 이해 원래:title: string (필수)바뀌면:title?: string (선택)📌 사용 이유👉