55,000원
다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 해결됨한 입 크기로 잘라먹는 타입스크립트(TypeScript)
(TS v5.1.6) 반환 값이 없는 함수에 undefined 타입을 정의하여도 에러가 발생하지 않습니다.
강의에서는 함수의 반환 값이 없을 경우 null 이나 undefined 타입을 정의하게 되면 에러가 발생하기 때문에 void 타입을 정의해야한다는 내용이 설명되어 있습니다 :) 현재 강의를 듣는 시점에서 설치된 타입스크립트의 버전은 v5.1.6이어서 강의에서 사용된 버전 보다 상위 버전이었고, 저는 에러가 발견되지 않아 타입스크립트 업데이트 기록을 살펴보니 아래 첨부한 링크와 같이 v5와 달리 v5.1부터는 undefined 타입의 경우에도 반환 값이 없을 경우를 허용하도록 업데이트 되었다고 합니다!https://devblogs.microsoft.com/typescript/announcing-typescript-5-1/#easier-implicit-returns-for-undefined-returning-functions null 타입의 경우에는 기존과 동일하게 return; 이나 return null; 의 반환 값에 해당된다고 하니 참고하시면 좋을 것 같습니다 😀
- 미해결한 입 크기로 잘라먹는 타입스크립트(TypeScript)
상태관리와 Props2에서 todos.map 렌더링시 에러(4:30)
안녕하세요. 보너스 강의 정말 감사합니다. 아주 유익하고 저에게 큰 도움이 되어 정말 기쁩니다.한 가지 궁금한 점이 있어서 글 남기는데요.App.tsx에서 강의상에서는 에러가 안 나는데, 저는 에러가 나서 검색해보니 return을 해줘야 한다고 하네요.{todos.map((todo) => { <TodoItem key={todo.id} {...todo} /> })}에러: ‘Type 'void[]' is not assignable to type 'ReactNode’ [아래는 제가 찾아본 내용입니다.]todos.map 콜백 함수 내부에 return문이 없기 때문에 해당 콜백 함수는 암묵적으로 undefined를 반환하게 되어 배열의 요소들이 모두 undefined로 채워진다.map 메서드는 배열의 각 요소에 대해 함수를 호출하고 해당 함수의 반환 값을 새로운 배열로 만든다. 이 때 콜백 함수에서 반환하는 값을 배열에 추가하고자 한다면 반드시 return 문을 사용해야 한다.그래서 아래와 같이 변경하였습니다.{todos.map((todo) => { return <TodoItem key={todo.id} {...todo} /> })}강의랑 어떤 부분이 달라서 그런지는 모르겠지만, 혹시 저처럼 에러가 나는 분이 계시면 참고하시면 좋을 것 같습니다.그리고 강의에서는 return을 생략해도 에러가 안 나는데 어떤 차이점이 있는지도 의문이 갑니다.감사합니다.
- 미해결한 입 크기로 잘라먹는 타입스크립트(TypeScript)
promise 관련 질문 있습니다.
const promise = new Promise(function (resolve, reject) { setTimeout(() => { reject("실패"); }, 500); }); promise.then(function (res) { console.log(res); }); promise.catch(function (err) { ① console.log(err); }); // 실패 참고 문헌에는 이게 실패를 콘솔에 출력한다고 되어 있는데 실제로는 에러가 뜹니다. code: 'ERR_UNHANDLED_REJECTION'혹시 왜 그런건지 알 수 있나요?찾아보니 try catch 구문을 써야 한다는데..
- 미해결한 입 크기로 잘라먹는 타입스크립트(TypeScript)
promise 관련 질문있습니다
interface Post { id: number; title: string; content: string; } function fetchPost(): Promise<Post> { return new Promise((res, rej) => { setTimeout(() => { res({ id: 1, title: "게시글 제목", content: "게시글 컨텐츠", }); }, 1000); }); } let data = {} as Post; const postRequest = fetchPost() postRequest.then((post)=> data = post );promise 에 ts적용하는 강의를 보다가 궁금한게 생겼는데 해당 코드와 같이 fetchPost에서 리턴값으로 id,title,content가 있는 object가 반환되는데 그 값을 미리 선언한 변수 data에 넣고싶은데 then에서 어떤식으로 작성해야 적용이될까요?? 위와 같이 data= post는 적용이 안되는거 같더라고요 ㅜㅜ
- 미해결한 입 크기로 잘라먹는 타입스크립트(TypeScript)
인터페이스 관련 질문입니다!
interface Person { name: string; age: number; sayHi(): void; // 오버로딩 sayHi(a: number, b: number): void; } const person: Person = { name: "name", age: 1, sayHi(a?: number, b?: number) { if (a && b) { console.log("hi" + a + b); } else { console.log("No paramete"); } }, }해당 코드를 sayHi 메소드에 파라미터가 없으면 void를 return 하고 2개이면 number 를 return하게 만들고싶을땐 어떤식으로 해야할까요? interface Person { name: string; age: number; sayHi(): void; // 오버로딩 sayHi(a: number, b: number): number; } const person: Person = { name: "name", age: 1, sayHi(a?: number, b?: number) { if (a && b) { console.log("hi" + a + b); return a+b ; } else { console.log("No parameter"); } }, }이런식으로 했더니 오류가 생기더라고요 ㅜㅜ
- 해결됨한 입 크기로 잘라먹는 타입스크립트(TypeScript)
클래스 문법 관련 질문 드립니다.
안녕하세요.6-0 자바스크립트의 클래스 관련 강의를 듣고 강의노트에 링크해주신 MDN 웹 문서를 읽어보다가 궁금한 게 생겨서 질문 드립니다.강의에서는 아래 코드와 같이 클래스를 정의할 때 필드를 먼저 작성한 뒤에 생성자를 작성하는 방식을 소개 해주셨습니다.class Student { // 필드 name; age; grade; // 생성자 constructor(name, grade, age) { this.name = name; this.grade = grade; this.age = age; } }그리고 링크해주신 MDN 문서의 예시에는 클래스를 정의할 때 필드 정의를 생략하고 바로 생성자를 작성하는 코드를 보여주고 있는데요.class Rectangle { constructor(height, width) { this.height = height; this.width = width; } }필드를 명시적으로 작성하는 것과 작성하지 않는 것에는 어떤 차이가 있을까요? 강의에서 작성한 코드 중 필드 부분을 주석처리해도 동일한 실행 결과가 나와서 생략이 가능한 부분인지 궁금합니다. 혹은 생략하지 않고 반드시 적어주어야 하는 경우가 있을까요?개인적으로 검색을 통해 찾아보고자 했는데 검색 방법이 잘못되었는지 적절한 자료를 찾지 못하여 질문을 남기게 되었습니다.차근차근 이해하기 쉬운 좋은 강의 제공해주셔서 감사합니다. ++ 추가질문후속 강의를 이어서 듣고 타입스크립트에서 필드를 생략 가능한 상황에 대해 공부했습니다.자바스크립트에서는 타입스크립트와 달리 좀 더 유연하게 사용할 수 있기 때문에 필드를 작성하지 않아도 코드실행이 되는 것으로 보면 될까요?
- 미해결한 입 크기로 잘라먹는 타입스크립트(TypeScript)
type선언보단 interface를 쓰는 것이 낫지 않나요?
interface는 호환성도 좋고 선언 합침도 쉽고 함수의 오버로딩도 가능한데 type대신 interface를 사용하는 것이 더 좋은 것 아닌가요? 왜 이 둘을 나눈 것인가요?
- 미해결한 입 크기로 잘라먹는 타입스크립트(TypeScript)
operation2 처럼 써도 되는 이유를 생각해봤는데 맞나요?
함수가 객체라고 하셨는데함수가 객체이기 때문에 함수의 type을 opration2처럼 설정하면type Operation2 = { (a: number, b:number) : number name: string }이전에 배운, 객체의 업캐스팅 때문에 함수로도 사용할 수 있고 add2.name으로도 사용할 수 있는 것인가요?
- 미해결한 입 크기로 잘라먹는 타입스크립트(TypeScript)
TS- react관련 질문입니다
context api 를 사용할때 타입을 export const TodoStateContext = React.createContext<Todo[] | null>(null); export const TodoDispatchContext = React.createContext<{ onClickAdd: (text: string) => void; onClickDel: (id: number) => void; } | null>(null);이런식으로 null도 포함시키면 항상 옵셔널 체이닝을 사용해야하거나 강의에서 말씀해주신 커스텀훅을 만들어서 사용해야하나요? 뭔가 비효율적인 느낌이 있어서요 ㅜㅜ 실무에서 props말고 context api나 redux로 데이터를 넘겨주는 경우가 더 많은가요?
- 미해결한 입 크기로 잘라먹는 타입스크립트(TypeScript)
디스코드 채널 참가 링크로 접속하니 "올바르지 않은 초대장 - 만료된 초대장이거나 참가 권한이 없어요."라고 나와요.
디스코드 채널 참가 링크로 접속하니, "올바르지 않은 초대장 - 만료된 초대장이거나 참가 권한이 없어요."라고 나와요.디스코드 로그인 후 링크를 눌러 접속하는 것 외별도로 다른 뭔가를 해주어야 하나요?
- 해결됨한 입 크기로 잘라먹는 타입스크립트(TypeScript)
lodash 설치 오류...
안녕하세요! 이제 강의 마지막으로 라이브러리 관련 lodash 설치를 따라한 결과..아래 오류가 나오고 있습니다 ㅠ 왜 이러는지 알 수 있을까요??PS C:\onebite-typescript\section11> npm i @types/lodash npm ERR! code E404 npm ERR! 404 Not Found - GET https://registry.npmjs.org/@testing-lodash%2fuser-event - Not found npm ERR! 404 npm ERR! 404 '@testing-lodash/user-event@^13.5.0' is not in this registry. npm ERR! 404 npm ERR! 404 Note that you can also install from a npm ERR! 404 tarball, folder, http url, or git url. npm ERR! A complete log of this run can be found in:
- 해결됨한 입 크기로 잘라먹는 타입스크립트(TypeScript)
클래스 관련 질문있습니다.
안녕하세요자바스크립트의 클래스는 어떤 경우에 쓰이는 지 알 수 있나요?UI 컴포넌트 기능, 스크롤 이벤트 구현할 때클래스 문법을 사용한 적이 없어서요..답변 부탁 드립니다 :)
- 해결됨한 입 크기로 잘라먹는 타입스크립트(TypeScript)
TS클래스 접근제어자 상속 질문있습니다!
class Employee2 { constructor( public name: string, protected age: number, private position: string ) {} work() { console.log("일하는중"); } } class Emp extends Employee2 { constructor( public name: string, protected age: number, public codeNum: number ) { super(name, age); this.codeNum = codeNum; } } private를 설정한 경우 클래스 Emp처럼 상속받았을때 super에서 3개 인수가 필요한데 2개를 가져왔다고 오류가 뜨는데 그렇다고 private 설정한 position을 con structor이나 super에 적어도 오류가발생하고 private를 설정한 클래스를 상속받아서 사용할때는 어떤식으로 해야할까요??
- 미해결한 입 크기로 잘라먹는 타입스크립트(TypeScript)
인터페이스 강의 관련 질문있습니다
interface Person { name: string; age: number; sayHi(): void; // 오버로딩 sayHi(a: number, b: number): void; } const person: Person = { name: "name", age: 1, sayHi: function () { console.log("hi"); }, }; person.sayHi(); person.sayHi(1, 2);이런식으로 코드가 있는데sayHi에 매개변수가 없을땐 console.log("hi")를있을땐 console.log(`Hi ${a}, ${b}`) 이런식으로 만들고싶은데 person을 초기화할때 어떤식으로 해야할지 모르겠습니다 person객체 안에 sayHi를 두개적으면 당연하게도 오류발생하더라고요ㅜㅜ 아 그리고 type은 마우스 올렸을때 구조를 알수있는데인터페이스는 마우스 올렸을때 구조를 안알려주던데 혹시 구조를 알수있는 방법이있나요? 해당 인터페이스명을 보고 선언한 코드 위치에가서 구조를 확인하는방법밖에없을까요?
- 해결됨한 입 크기로 잘라먹는 타입스크립트(TypeScript)
혹시 강의 내용을 개인 깃허브에 정리해도 될까요?
안녕하세요 윈터로드님, 한입 리액트때부터 강의 잘 듣고 있습니다!다름이 아니라 제가 한입 타입스크립트 강의를 들으면서 잔디도 채울 겸... 개인 깃허브에 강의 내용을 정리하고 있는데요. 실습 자료 등은 업로드하지 않고, 같이 실습해주시는 코드와 개인 필기만 주석으로 달고 있습니다.혹시 이렇게 해도 문제가 되지 않는지, 만약 가능하다면 레포 공개/비공개 여부도 함께 알려주시면 감사하겠습니다. :)늘 좋은 강의 만들어 주셔서 감사합니다.
- 미해결한 입 크기로 잘라먹는 타입스크립트(TypeScript)
대수 타입 - Union과 Intersection 타입 관련
안녕하세요 제가 이해가 조금 안 가서 여쭤봅니다.합집합(Union 타입)type Dog = { name: string; color: string; }; type Person = { name: string; language: string; }; type Union1 = Dog | Person; let union1: Union1 = { // ✅ name: "", color: "", }; let union2: Union1 = { // ✅ name: "", language: "", }; let union3: Union1 = { // ✅ name: "", color: "", language: "", };합집합이라 union3 경우 이해가 됩니다. 그런데, 교집합(Intersection) 타입 이 부분이 이해가 잘 가지 않아서 여쭤봅니다.type Dog = { name: string; color: string; }; type Person = { name: string; language: string; }; type Intersection = Dog & Person; let intersection1: Intersection = { name: "", color: "", language: "", };intersection1은 왜 이렇게 되는 걸까요?교집합이라고 하면Dog와 Person 겹쳐진 name 만 가져와야 하는 게 맞지 않나요?합집합과 교집합의 의미를 검색해봤는데합집합 - 집합의 원소를 "모두 포함"하는 집합교집합 - 두 사건에 "모두 속하는"원소로만 이루어진 집합자세한 설명 부탁 드립니다
- 미해결한 입 크기로 잘라먹는 타입스크립트(TypeScript)
핸드북 Exclude, Extract, ReturnType 오타 신고
[핸드북] Exclude, Extract, ReturnType오타 있어요. string | boolean, string에서 큰 따옴표 제거 해야 string 타입이 리턴 됩니다.Exclude<T, K>type A = Exclude<string | boolean, string>;
- 미해결한 입 크기로 잘라먹는 타입스크립트(TypeScript)
import 문 옆에 gzipped 문구는 어떤 플러그인인가요?
import 문 옆에 gzipped 문구는 어떤 플러그인인가요?경량화 해주는 것 같아서 궁금합니다~
- 미해결한 입 크기로 잘라먹는 타입스크립트(TypeScript)
분산적인 조건부 타입 섹션 질문
13:02초에서 type StringNumberSwitch<T> = [T] extends [number] ? string : number; let d: StringNumberSwitch<boolean | number | string>;설명 해주셨는데, 이해가 되지 않아서, d의 타입이 왜 number타입인지 설명해주시면 감사하겠습니다.
- 미해결한 입 크기로 잘라먹는 타입스크립트(TypeScript)
타입스크립트 tsc -v 오류
tsc : 'tsc' 용어가 cmdlet, 함수, 스크립트 파일 또는 실행할 수 있는 프로그램 이름으로 인식되지 않습니다. 이름이 정확한지 확인하고 경로가 포함된 경우 경로가 올바른지 검증한 다음 다시 시도하십시오.위치 줄:1 문자:1+ tsc -v+ ~~~ + CategoryInfo : ObjectNotFound: (tsc:String) [], CommandNotFoundException + FullyQualifiedErrorId : CommandNotFoundException 이러한 오류가 뜨는데 어떻게 해야할까요? 파워쉘로 고쳐보려는데도안되서,,,