Front-End17 [ReactJS] 동시에 ajax 요청 여러개하기 Promise.all([ axios.get('/url1'), axios.get('/url2') ]) .then(()=>{ // 위 두 요청이 둘다 성공했을 때 작동 }) .catch(()=> { }) 2023. 3. 6. [Javascript] 자리수 만큼 0 채우기 chatGPT님은 대단하십니다!! 2023. 2. 13. Javascript enum 구현 exports._STATS_GRAPH_TYPE = Object.freeze({ daily: Symbol('DAILY'), monthly: Symbol('MONTHLY'), yearly: Symbol('YEARLY') }); Object.freeze()와 Symbol을 통해 구현할 수 있다. 2023. 2. 8. Javascript로 알아보는 자료구조 - 스택(stack) 스택은 프링글스다. 가장 마지막으로 들어간 데이터가 가장 먼저 밖으로 나오는 후입선출(LIFO, Last In - First Out)이다. 스택에 자료를 집어넣는 것은 Push이며 들어간 데이터를 꺼내는 것은 Pop이다. Javascript로 stack을 구현해보자. export default class Stack { constructor() { // stack을 구현할 배열을 만든다. this.arr = []; } push(data) { this.arr.push(data); } pop() { return this.arr.pop(); } // peek()는 스택의 가장 위에 있는 데이터를 반환하는 함수이다. // pop()은 stack에 저장된 마지막 데이터를 삭제하는 것에 반해 // peek()은 단순.. 2023. 2. 6. Void 문가가 공부한 기록입니다. 부정확한 내용은 편히 지적 부탁드립니다. Void에 대해서 알아보기전에 잠깐 하나만 알고 넘어가자! interface A { a: string; } // 잉여 속성 검사 const obj1: A = { a: "hello", b: "world" }; 타입스크립트에는 잉여 속성 검사라는게 존재하는데 위 코드는 아래와 같이 에러를 뱉어낸다. 그런데 조금 웃긴것이 obj1에 할당된 객체를 변수로 빼면 interface A { a: string; } // 잉여 속성 검사 const obj = { a: "hello", b: "world" }; const obj1: A = obj; 에러를 뱉지않는다!! 이건 뭐야 :( 이게 타입스크립트에서 많이 헷갈리는 특성중에 하나라고 하는데 const .. 2023. 1. 2. Type Aliases, Interface extends 문가가 공부한 기록입니다. 부정확한 내용은 편히 지적 부탁드립니다. // &를 '그리고'의 개념 보다는 상속의 개념으로 생각하자. type Animal = { breath: true }; type Mammal = Animal & { breed: true }; type Human = Mammal & { think: true }; const moonga: Human = { breath: true, breed: true, think: true }; interface A { breath: true; } interface B extends A { breed: true; } const b: B = { breath: true, breed: true }; +참고자료 https://github.com/ZeroCho/ts.. 2022. 12. 28. enum과 object 문가가 공부한 기록입니다. 부정확한 내용은 편히 지적 부탁드립니다. // enum은 변수들을 하나의 그룹으로 묶고싶을 때 주로 사용한다. // enum은 JS로 변환될 때 사라진다. const enum EDirection { Up, Down, Left, Right, } const ODirection = { Up: 0, Down: 1, Left: 2, Right: 3, } as const; // as const를 사용하지 않으면 TS가 타입추론을 넓게 하게 된다. EDirection.Up; // 0 (enum member) EDirection.Up = 0 ODirection.Up; (property) Up: 0 // Using the enum as a parameter function walk(dir: E.. 2022. 12. 28. Polymorphism2 문가가 공부한 기록입니다. 부정확한 내용은 편히 지적 부탁드립니다. 이번에는 다형성, 제네릭, 클래스 그리고 인터페이스를 모두 사용해보자. 기억하자. 다형성은 다른 모양의 코드를 가질 수 있게 해주는 것이다. 다형성을 이룰 수 있는 방법은 제네릭이다. 제네릭은 placeholder 타입을 쓸 수 있도록 해준다. (concrete 타입이 아니라 placeholder 타입이다!) 때가되면 TS가 placeholder 타입을 concrete 타입으로 변환해줄 것이다. 우리는 이제부터 브라우저에서 쓰이는 로컬 스토리지 API와 비슷한 API를 만들어볼건데 실제로 구현은 하지않고 타입만좀 끄적여 볼 것이다.(call signature랑 class 등등) //Storage 인터페이스는 이미 존재하니 SStorage.. 2022. 12. 21. Type & Interface recap 문가가 공부한 기록입니다. 부정확한 내용은 편히 지적 부탁드립니다. type PlayerA = { name: string } type PlayerAA = PlayerA & { lastName:string } // type에서는 불가능하다. // type PlayerAA = PlayerA & { // health: number // } const playerA : PlayerAA = { name: "moon", lastName : "xxx" } //// interface PlayerB { name: string } interface PlayerBB extends PlayerB { lastName: string } // interface에서는 가능하다. interface PlayerBB { health: n.. 2022. 12. 21. Interfaces 2 문가가 공부한 기록입니다. 부정확한 내용은 편히 지적 부탁드립니다. 지난 포스팅에서는 타입스크립트에서 타입과 인터페이스의 차이를 알아보았다. 사실 객체지향 나오고 인터페이스 나오면 추상 클래스 바로 나와줘야 하는 게 국룰아니겠습니까 들어가 봅시다 abstract class User { constructor( protected firstName: string, protected lastName: string ) {} abstract sayHi(name:string): string abstract fullName():string } 추상 클래스를 하나 만들었다. 보다시피 아무것도 구현하지 않았다. 단지 다른 클래스(추상 클래스를 상속받는)가 따라야 할 청사진(설계도)만을 제시했을 뿐이다. 만약 User 클래.. 2022. 12. 20. 이전 1 2 다음