36,300원
다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결[리뉴얼] 타입스크립트 올인원 : Part1. 기본 문법편
tsconfig.json 파일이 제대로 작동하지 않아요!
tsconfig.json을 생성한 이후로 타입스크립트 파일들을 자바스크립트로 컴파일할 때 계속 es5 문법으로 컴파일이 됩니다... tsconfig.json 파일의 target도 es6로 설정해주었고 module도 es6로 설정해주었는데 컴파일을 하면 모든 코드가 다 es5 문법으로 변환이 됩니다아래는 tsconfig.json 파일의 일부입니다.{ "compilerOptions": { "target": "ES6", /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */ "module": "ES6", /* Specify what module code is generated. */ "esModuleInterop": true, /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables 'allowSyntheticDefaultImports' for type compatibility. */ "forceConsistentCasingInFileNames": true, /* Ensure that casing is correct in imports. */ "strict": true, /* Enable all strict type-checking options. */ "skipLibCheck": true /* Skip type checking all .d.ts files. */ } }tsc app.ts --target es6 이런식으로 직접 target을 설정해주었을 때에는 잘 작동합니다. 하지만 tsc app.ts 를 작동시키면 es5 문법으로 바뀌네요혹시나 필요하실까 해서 폴더 구조도 올립니다!!왜 es6 문법으로 컴파일이 안되는 걸까요...
- 해결됨[리뉴얼] 타입스크립트 올인원 : Part1. 기본 문법편
filter 함수 타입추론과 관련하여 질문이 있습니다.
//1번 filter인터페이스 filter<S extends T>(predicate: (value: T, index: number, array: T[]) => value is S, thisArg?: any): S[]; //2번 filter인터페이스 filter(predicate: (value: T, index: number, array: T[]) => unknown, thisArg?: any): T[]; //1번 예제 const filtered1 = ['1',2].filter((value)=>typeof value === 'string'); //2번 예제 const filtered2 = ['1',2].filter<string>((value)=>typeof value === 'string'); //3번 예제 (2번 예제 개선) const filtered3 = ['1',2].filter<string>((value): value is string => typeof value === 'string'); 위 코드를 기반으로, 궁금한 점이 있었습니다.[질문1]1번, 2번 예제코드 모두 똑같이 filter의 콜백함수의 반환 타입을 value is string 으로 명시하지 않았는데, 2번은 오류가 발생하고 1번은 오류가 발생하지 않는지?[질문2]왜 2번 예제처럼 제네릭 타입을 명시해줬을 때, filter의 콜백함수의 반환 타입을 value is string으로 따로 명시해줘야하는지?그리고 이유를 생각해봤습니다. 제가 생각한 이유가 정확한지 모르겠어서 질문드립니다.[질문1에 대한 생각]1번 예제는 타입추론 시 2번 인터페이스를 따르기 때문에 filter 콜백의 반환 타입을 명시하지 않아도 오류가 뜨지 않는 것으로 생각했습니다. (타입 추론은 정확히 되지 않지만)[질문2에 대한 생각]2번 예제는 <string>으로 제네릭을 선언한 순간 1번 filter인터페이스를 따라야 합니다. 이때 filter의 콜백함수의 반환 타입을 value is string으로 명시하지 않으면 반환 타입이 boolean으로 추론되고, 이는 인터페이스와 맞지 않기 때문에 오류가 발생하는 것으로 이해했습니다. 따라서 3번 예제처럼 반환 타입을 타입 가드로 지정해 줬을 때는 오류가 뜨지 않았습니다. 수업내용 처럼 predicate를 따로 빼서 정의해서 사용하지 않아도 3번 예제처럼 작성해도 문제는 없는 걸까요?
- 미해결[리뉴얼] 타입스크립트 올인원 : Part1. 기본 문법편
IsNever IDE 타입추론 질문입니다
type IsNever<T> = T extends never ? true : false일때 웹스톰에서는 이니셜 타입을 true로 추론하고vscode에서는 never로 정상 추론하는데웹스톰에서는 이게 정상인건가요??
- 미해결[리뉴얼] 타입스크립트 올인원 : Part1. 기본 문법편
Omit, Exclude, Extract 타입 분석 강의에서 keyof any에 대한 의문
안녕하세요.Omit을 직접 구현하는 부분에서 궁금한 점이 있어 올립니다.type O<T, S extends keyof any> = Pick<T, Exclude<keyof T, S>>;위 처럼 keyof any 부분이 있을 경우 S로 들어올 수 있는 값이 string | number | symbol로 제한되면서 의미가 있다고 해주셨는데요.type O<T, S extends keyof T> = Pick<T, Exclude<keyof T, S>>;어짜피 S는 제거해야 되는 속성이므로 위 처럼 T의 key 중 하나라고 명시하는 것이 더 정확한 타입 정의가 아닌가 해서 질문드립니다.
- 미해결[리뉴얼] 타입스크립트 올인원 : Part1. 기본 문법편
잉여속성검사?
잉여속성검사를 통과하기 위해 객체를 따로 선언해서 할당하면 된다고 하셨는데 이전에 했던 타입 상속 코드를 조금 고쳐서 객체를 선언해서 해보니까 '{ breath: boolean; breed: boolean; think: boolean; hungry: boolean; }' 형식은 'Human' 형식에 할당할 수 없습니다. '{ breath: boolean; breed: boolean; think: boolean; hungry: boolean; }' 형식은 'Animal' 형식에 할당할 수 없습니다. 'breath' 속성의 형식이 호환되지 않습니다. 'boolean' 형식은 'true' 형식에 할당할 수 없습니다.이렇게 뜨는데 이유가 무었인가요? type Animal = {breath: true} type Mammal = Animal&{breed: true} type Human = Mammal& {think : true} const test = {breath : true ,breed : true, think : true, hungry:true } const sumin: Human = test type AA = {name:string} type BB = {age :number} type AB = AA|BB type C = AA&BB const ab:AB = {name:'suhyeon'} const obj5 = {name:'suhyeon',age:25,married:true} // 객체를 따로 변수로 빼서 할당하면 가능 const cc:C = obj5왜 위에 코드는 되고 아래코드는 안되는지 궁금합니다!
- 미해결[리뉴얼] 타입스크립트 올인원 : Part1. 기본 문법편
화살표 함수에서 타입선언중 궁금증에 대해서 질문 올려 봅니다
1. const add2: (x: number, y: number) => number = (x, y) => x + y; 2. const add2 = (x:number,y:number):number => x+y;강의 내용을 보고 이것저것 해보다가 2번 코드도 잘 작동 하는것 같은데 혹시 1번과 2번은 어떤 차이점이 있는걸까요?
- 해결됨[리뉴얼] 타입스크립트 올인원 : Part1. 기본 문법편
void의 두가지 사용방법에 대한 궁금증입니다(화살표함수)
안녕하세요 제로초님! void의 두가지 사용법에 대한 강의를 들으면서 궁금증이 생겨 질문드립니다!함수에 직접적인 return 이 void 인 경우 return 을 사용하면 에러가 나고매개변수(강의 내에서 예시로 든 콜백함수)나 메서드인 경우에 void 의 의미는 return 값을 사용하지 않는것이다 라고 하셨습니다.화살표 함수에 대한 타입을 지정할 때 다음과 같이 두 가지 방법으로 가능한 것으로 알고있습니다.testFunc 와 testFunc2 모두 타입 추론이 ()=>void 가 되고 있는 것으로 확인했습니다.왜 결과가 다르게 나오는 것인지 궁금합니다!
- 미해결[리뉴얼] 타입스크립트 올인원 : Part1. 기본 문법편
filter<string> 관련 질문
const predicate = ((i) : i is string => typeof i === "string"); const filtered1 = [1,'2',3].filter(predicate); const filtered2 = [1,'2',3].filter<string>((i) => typeof i === "string")filtered1 에서 위의 코드가 되는 이유는 i is string 이라고 지정해줘서 value is string 인 타입가드가 성립하는건데filtered2 에서 에러가 나는건 i 값에 대한 타입을 정확히 안정해줘서 i 타입에 따라 true or false를 판별해야 하기 때문에 (i : number | string) => boolean 이 뜨고 결국 value is string 이라는 형식 조건자와 일치하지 않아 에러가 뜨는걸로 이해했는데 혹시 맞나요..?그리고 별도로 그럼 is 가 들어간 커스텀 타입가드는 해당 타입이 뭔지 제한해주는(?) 역할로 이해하고 있었는데 정확하게는 위의 코드로 예시로 들자면 i의 타입을 string으로 고정시켜주는게 맞나요?
- 해결됨[리뉴얼] 타입스크립트 올인원 : Part1. 기본 문법편
generic 타입 선언 시 인덱스 시그니쳐 관련 질문
제네릭 타입 선언시 T 의 타입을 인덱스 시그니쳐를 이용하여서 객체로 받아오려 했는데 아래와 같이 선언하면 a 의 타입을 number로 받아오는데 찾아봐도 왜 number로 받아오는지 이해가 안갑니다..function generic2<T extends { [key in string] : number }>(a : T) : T { return a; } generic2({a : 25});
- 미해결[리뉴얼] 타입스크립트 올인원 : Part1. 기본 문법편
런타임에 제거되지 않는 클래스 타입의 이점?
런타임 자바스크립트 에서도 클래스 타입이 남아있어야 된다면 클래스를 사용하고, 자바스크립트에서는 사라져도 되고, 추상에 의존하는 코드를 만들고싶다면 Interface를 사용하라고 하셨는데요런타임 자바스크립트 에서도 클래스 타입이 남아있어야 하는 케이스는 어떤예시가 있을까요??
- 해결됨[리뉴얼] 타입스크립트 올인원 : Part1. 기본 문법편
선생님 제네릭에 관해서 질문 사항이 있습니다.
문자열 또는 숫자를 인자로 받아서 문자열 인자인 경우는 문자열 결합을 숫자 인자인 경우에는 숫자 덧셈을 구현하는 함수를 구현하려고 했습니다. 그런데 아래와 같은 에러가 뜨는데 제 짧은 지식으로는 도대체 이해가 안되서 질문을 남깁니다. 또한, 제네릭 타입의 변수는 type guard를 해줄 방법이 없는건가요?n1과 n2의 타입은 T & 'string' 또는 T & 'number'으로 추론합니다.
- 미해결[리뉴얼] 타입스크립트 올인원 : Part1. 기본 문법편
'class 자체의 타입은 typeof 클래스입니다'라는 뜻...
이 무엇인가요 ?class의 typeof는 function인데 그냥 말 그대로 function이라는 말인가요 ??? 아니면 뭔가 다른 다른 뜻이 있는건가요 ???class A { aaa() {} } class B { bbb() {} } function aOrB(param: function) { } // console.log(typeof A) aOrB(A)
- 해결됨[리뉴얼] 타입스크립트 올인원 : Part1. 기본 문법편
filter 질문 있습니다.
기존 배열 함수를 사용할 때는 filter 메서드의 인자로 v is string을 넣어주지 않아도 작동되는데 선생님께서 정의하신 filter 메서드의 경우는 callback에 v is string을 넣어줘야만 작동되는지 궁금합니다.기존의 filterconst d = [1, 2, '3', 4, '5']; d.filter((value) => typeof value === 'string'); 수업 시간에 작성한 filter interface Arr<T> { forEach(callback: (value: T, index: number) => void): void; // map(callback: (value: T, index: number) => any): any[]; map<U>(callback: (value: T, index: number) => U): U[]; filter<S extends T>(callback: (value: T, index: number) => value is S): S[]; } const c: Arr<string | number> = ['1', 2, '3', 4, '5']; const d = c.filter((item): item is string => typeof item === 'string');
- 미해결[리뉴얼] 타입스크립트 올인원 : Part1. 기본 문법편
add 함수에 union 적용했을 때의 예시관련 질문입니다.
union을 적용할 때의 에러는 보여주셨는데, 이를 해결하려면 union을 적용하지 않고 함수를 따로따로 구현하는 방법 뿐이 없는건가요?아니면 분기문으로 각각 들어온 인자에 대해 조건처리를 해주면 될까요?
- 미해결[리뉴얼] 타입스크립트 올인원 : Part1. 기본 문법편
인터페이스 관련하여 궁금한 것이 있습니다!
자바에서는 인터페이스를 다형성을 위한 도구로 사용한다고 알고 있는데 TS에서도 인터페이스가 OOP의 다형성을 위한 도구로도 사용되는 거라 단순히 함수를 타이핑하고자 할 때는 type alias를 쓰는 것이 좋을까요?
- 미해결[리뉴얼] 타입스크립트 올인원 : Part1. 기본 문법편
제네릭 조건부 타입 함수
안녕하세요 혹시 제네릭 조건부 타입으로 함수를 정의하였는데요 function double<T extends string | number>( x: T): T extends string ? string:number{ return x; } // 이렇게 하면 'T' 형식은 'T extends string ? string : number' 형식에 할당할 수 없습니다. 'string | number' 형식은 'T extends string ? string : number' 형식에 할당할 수 없습니다. 'string' 형식은 'T extends string ? string : number' 형식에 할당할 수 없습니다. 이런 오류가 뜨는데 아직 함수의 반환타입이 정해지지 않아서 그런건가요? 왜 이러는지 이유가 궁금합니다!
- 미해결[리뉴얼] 타입스크립트 올인원 : Part1. 기본 문법편
NonNullable 타입 변경사항
안녕하세요~~ 질문 글은 아닌데바뀐 부분이 있는 것 같아서 공유할겸글 작성합니다!! 기존의 NonNullable은 null 과 undefined 를 임의의 타입으로 순회 하면서검사하던 방식에서type NonNullable<T> = T & {}Object type 과 임의의 타입을 묶어null 과 undefined 를 거르는 방식으로 변경된것 같습니다!!별건 아닌데 앞 내용의 object type 복습할겸 공유 드립니다!!
- 미해결[리뉴얼] 타입스크립트 올인원 : Part1. 기본 문법편
rest 관련 에러
회사에서 ts를 사용하고 있어 수강하게 되었습니다. 기본 문법 rest 강의 질문입니다. 강의 보면서 따라 치고 있는데요, 강의에서는 에러가 안났는데, 제가 하니깐 에러났습니다.function rest(...args: string[]) { // console.log(args) // 예상 결과: [1,2,3]}rest('1','2','3'); 에러 메시지 : Unterminated string literal. 구글링해봐도 해당 에러 메시지와는 다른 내용이어서 해결이 안되어 질문 올립니다.
- 미해결[리뉴얼] 타입스크립트 올인원 : Part1. 기본 문법편
react state 값을 unknown으로 설정
안녕하세요! 아직 기초 강의 수강 중에 질문이 생겨 우선 이곳에 리액트 관련 질문을 남깁니다. 저는 커스텀 input 컴포넌트를 만들어서해당 컴포넌트가 어떤 값이든 (text, number, date 등)을 받을 수 있게 하고 싶은데요. 그러기 위해 먼저 든 생각이useState<unknown>()으로 먼저 unknown값을 받아 useState 훅을 만들고,나중에 값이 정해지고 나서 해당 타입값을 지정하는 방식이었습니다. 혹시 이 접근 방식이 잘못 되었을까요?이럴 경우에는 어떤 식으로 코딩하는 것이 좋을까요?
- 해결됨[리뉴얼] 타입스크립트 올인원 : Part1. 기본 문법편
`typeof` `keyof` 의 값 확인은 에디터에서 호버하는 방법 밖엔 없나요?
typeof keyof 의 값 확인은 에디터에서 호버하는 방법 밖엔 없나요?console.log 같은건 없을까요?