Promise함수는 자바스크립트의 특징을 가장 잘 나타내는 함수인데, 요새는 async-await 구문을 이용하여 더욱 간단하게 처리하는 경우가 많다. 그러나 async-await구문은 배열을 인자로 받을 수는 없기 때문에, 배열 비동기 처리는 조금 더 고민이 필요하다. 예시는 arr이라는 배열에 대해 testFunction이라는 로직을 순차적으로 처리해 messages라는 새로운 배열을 만드는 것이다 직관적으로는 key마다 testFunction이 결과를 리턴해줄때까지 기다리고 messages를 만들것이라 추측할것이다 messages 결과: [ Promise { }, Promise { } ] 그러나 실제로는 pending하는 요소만 리턴하게 된다 왜냐하면 map은 각 원소가 처리될때까지 기다리지 않기 ..

Promise함수는 자바스크립트의 특징을 가장 잘 나타내는 함수인데, 요새는 async-await 구문을 이용하여 더욱 간단하게 처리하는 경우가 많다. async-await는 NodeJS의 또 다른 핵심요소인 제너레이터에서 파생된 형식이다 무작정 async와 await를 붙이는 경우가 많아 정리할 겸 직접적인 비교를 해보려고 한다. 가장 흔한 예시가 위와 같은 형식이다 해당 코드를 돌려보면 1->2->3-> success의 순서로 콘솔이 찍힌다 Promise 객체를 가지고 있는 promise라는 함수가 존재하고, 얘는 내부로직이 끝났을때 resolve를 던진다. 예시의 내부로직은 setTimeout이기 때문에 1초가 지난 후에 resolve가 실행되는 것이다 (reject를 짜두었다면 promise 실행..

리액트로 개발하던 도중, 그림을 수정해서 다운받는 기능 구현할 일이 생겼다. 내 경우에는 그림에 글씨를 새겨 결과물을 스토리지에 저장하는 기능이 필요했다. 이런 경우 canvas 라이브러리를 이용해 구현한다 이미 소스코드에는 targetImg라는 Img 컴포넌트와, uploadContent라는 String 데이터가 있다. targetImg위에 uploadContent를 새겨 그림파일로 만들어주면 된다. 구현을 위해 세가지 객체가 필요하다 canvas는 그림과 글을 올릴 DOM객체이다. 기존 바닐라 자바스크립트 구현에서는 canvas 컴포넌트를 셀렉트했으나, 이 경우에는 DOM객체를 새로 만들었다 ctx는 canvas의 property를 정의한다. 추후 ctx 객체를 이용하여 그림과 텍스트를 올린다 마지막..

React에서 한글 폰트를 사용하려면 필요한 세팅을 따로 해줘야된다 1) 소스파일에 fonts폴더를 설치하고 필요한 ttf파일을 임포트한다 2) CRA에서 만들어지는 index.css에 @font-face를 적용한다 3) 그리고 필요한 화면에서 fontFamily속성으로 불러내 사용하면 된다

Given a non-empty array of integers nums, every element appears twice except for one. Find that single one. Follow up: Could you implement a solution with a linear runtime complexity and without using extra memory? 2개가 아닌 1개만 있는 원소의 값을 리턴하라는 문제 Hash Table이 아니더라도, 배열만으로도 O(n)으로 풀어낼수는 있다 해당 예시는 XOR을 이용하여 풀어내었다 그러나 나는 Hash를 써보고자 한다 사실 Hash를 쓰는건 아니고 Hash개념의 객체를 만들어 풀어봤다

트리를 좌우반전하란다 기본적으로 traverse가 필요한 문제라서 traverse함수를 만들어 풀었다