TypeScript10 TypeScript <동기/비동기> ⭐ 동기 처리 프로그래밍✔️ 정의 // : 코드가 순차적으로 실행되는 것 // >> 한 작업이 완료될때까지 다음 작업은 대기(시작하지 X) ✔️ 특징 // - 순차적 실행: 코드 흐름 예측이 용이 // - 간단성: 프로그램의 이해가 쉬움 function syncFunc01() { // 시간 지연을 위한 계산식 let sum = 0; for (let i = 0; i function example() { console.log(`첫 번째 작업 시작`); let result = syncFunc01(); // 시간이 오래걸리는 작업 console.log(`첫 번째 작업 완료: ${result}`); console.log(`두 번째 작업 시작`); let result2 = syncFunc02().. 2024. 9. 24. TypeScript <유니온 타입과 제네릭> ⭐유니온 타입과 제네릭✔️유니온 타입(OR, |)여러 타입 중 하나가 될 수 있는 값을 의미 ✔️유니온 타입을 제네릭의 타입 변수에 적용extends 키워드를 사용 (확장) ✔️ 해당 함수 호출 시 string 또는 number 타입의 매개변수만 적용function unionGeneric(value: T) { if (typeof value === 'string') { return value.toLowerCase(); } return value; // 숫자 데이터}const result1 = unionGeneric('sTrInG');const result2 = unionGeneric(1000);console.log(result1, result2); // string 1000 ✔️제네릭 유틸리티 .. 2024. 9. 22. TypeScript 제네릭 정의 ⭐제네릭✔️제네릭 정의재사용 가능한 컴포넌트(코드단위)를 만드는데 사용해당 컴포넌트가 처리할 데이터타입을 미리 지정하니 않고 해당 컴포넌트를 사용하는 시점에서 원하는 데이터 타입 지정✔️제네릭 필요성코드의 중복을 줄임재사용 가능한 컴포넌트를 생성타입 안정성 보장컴파일 시점에서 타입을 체크 ('런타임' 환경에서 발생할 수 있는 에러를 방지) ✅컴파일 타임소스코드를 과장✔️ 제네릭 기본 문법사용할 컴포넌트(변수, 함수, 클래스 등)의 이름 뒤에 꺽쇠괄호() 안에 '타입 변수'를 지정함수나 클래스 등을 사용할 때 활용할 타입 명시✅"타입 변수"임의의 키워들르 사용하여 명시일반적으로 대문자 알파벳 하나를 사용(T: type, U,...)해당 타입 변수는 컴포넌트 내에서 실재 데이터 타입의 자리를 대신functi.. 2024. 9. 19. TypeScript 인터페이스 정의 ⭐인터페이스 정의객체(속성과 메서드) 구조를 정의하는 타입스크립트의 기능함수 타입 정의도 가능객체가 어떤 프로퍼티와 메서드를 가져야 하는지 명시 컴파일 시점에 타입 체킹을 위해 사용되는 개념다양한 구현체에 동일한 인터페이스를 적용하여 일관성과 재사용성 제공 ✅타입 별칭(type alias)다양한 데이터의 타입을 명시 가능원시타입, 유니온, 인터섹션 등 모든 타입을 별칭으로 지정 가능 ✅ 인터페이스 구현 방법(명시)interface 키워드를 사용하여 명시인터페이스명은 대문자로 시작객체의 문법 체계를 모두 사용 가능(옵셔널, readonly 모두 가능)type UserType = { name: string; age: number;}✅ 인터페이스 예시사용할 객체명 앞에 I(대문자 i)를 사용interfac.. 2024. 9. 16. TypeScript 타입스크립트의 함수, 타입단언 ⭐ 타입스크립트의 함수함수의 선언과 호출매개변수와 반환 값에 타입 지정 가능function greet(name: string): string { return `Hello ${name}`;} ✔️ 함수에 타입 별칭을 사용하는 경우 화살표 함수의 체계를 사용type ArrowFuncType = (name: string) => string; const arrowFunc: ArrowFuncType = (name) => { return `Hi ${name}`}console.log(arrowFunc('선하영'));console.log(arrowFunc('지수민')); ✔️ 선택적 매개변수와 기본 매개변수✅선택적 매개변수함수 호출 시 생략 가능변수명 뒤에 ? 작성✔️기본 매개변수기본값을 할당함수 호출 시 생략하는.. 2024. 9. 12. TypeScript 리터럴 타입 ⭐ 리터럴 타입(Literal, 문자 그대로의)특정 '값'만을 가질 수 있는 타입을 정의 할 때 사용특정 '값'으로 제한✔️ 리터럴 타입의 종류해당 값만을 가지는 상수해당 값을 타입으로 지정한 변수다른 값을 할당하려고 하면 타입 에러가 발생✅ const 키워드를 사용하여 직접 리터럴 값을 할당(초기화)let str1 = '안녕하세요.';// string 타입str1 = 'hello';str1 = '곤니찌와'const str2 = '반갑습니다.'; // "반갑습니다." 타입// str2 = 'hi';// str2 = '니하오';let은 변수 선언으로 변수값은 변하지만 변수타입은 그대로 유지한다const는 상수로 값이 변하지 않아서 같은 타입을 넣더라도 Error가 발생한다.✅ 변수에 타입 명시를 리터럴 값.. 2024. 9. 10. 이전 1 2 다음