코드 몽키의 허둥지둥 개발공부

분명히 며칠 전까진 잘 돌던 jest 테스트 케이스가 아래와 같은 메시지를 뱉으며 실패했다. ● Test suite failed to run Jest encountered an unexpected token This usually means that you are trying to import a file which Jest cannot parse, e.g. it's not plain JavaScript. By default, if Jest sees a Babel config, it will use that to transform your files, ignoring "node_modules". Here's what you can do: • If you are trying ..

내 주변에서 가장 JS를 잘 아시는 분께 여쭤봤더니 아래와 같은 답변을 주셨다. [~] npx prettier --write [대상_폴더경로] [~] # npx prettier --write . 와 같이 상대 경로로 사용도 가능하다. [~] 덧붙여 저장될 때마다 자동으로 prettier를 적용하도록 설정해두면 되는데, 왜 굳이 수동으로 쓰는지 도무지 이해가 안된다는 일침도 주셨다. 그 말에는 나도 동의했지만, 현실은 녹록치 않았다. 겨울이었다.

Windows를 기준으로 사용할 수 없는 문자는 \/:*?"|이고, 파일 명은 온점(.)으로 끝나지 않아야 한다. 요 내용을 정규식으로 표현하면, const regex = /([\\/:*?\"|])|(\.$)/g; 이제 이걸 토대로 String.prototype.replace와 encodeURIComponent를 조합하면 결과는 다음과 같다. const regex = /([\\/:*?\"|])|(\.$)/g; const target = '/\:?"|:\':S.text*.'; const result1 = target.replace(regex, (match) => { return encodeURIComponent(match); }); console.log(result1); // %3C%3E%2F%3A%3F%..

연속적인 async 함수의 호출을 함수형으로 처리하기 위해 async한 pipe 함수를 다음과 같이 구현할 수 있다. (async function main() { const results = await pipeAsync( getTargetAsync, pickAlias, getInfoAsync, getFriendsAsync )("injuk"); console.log(results); /* 실행 결과 [ { id: '222', name: 'two', bf: 'ingnoh' }, { id: '333', name: 'three', bf: 'ingnoh' }, { id: '444', name: 'four', bf: 'ingnoh' } ] */ })(); function pipeAsync(...asyncFun) {..

JS를 사용하다보면 함수 내부에서 this 참조가 원하지 않는 객체를 참조하거나 아예 유실되어버리는는 경우가 종종 발생한다. 이러한 경우에 사용할 수 있도록 JS에서는 Function.prototype의 call, apply, bind를 제공하고있으며, 세 메소드는 모두 함수에 this 참조를 연결한다는 공통점을 갖지만 사용법 측면에서 다음과 같은 소소한 차이가 있다. Function.prototype.call: 함수 내부에서 참조할 this와 매개 변수 목록을 하나씩 나열하여 전달하는 식으로 함수를 호출한다. Function.prototype.apply: 함수 내부에서 참조할 this와 매개 변수 목록을 배열로 전달하는 식으로 함수를 호출한다. Function.prototype.bind: 함수 내부에서..

다음과 같이 getter에 async 키워드를 작성할 경우에는 Syntax Error가 발생한다. SyntaxError: Unexpected identifier class MyClass { #props = { hello: 'world' }; async get result() { // SyntaxError: Unexpected identifier return this.#props; } } (async function main() { const myInstance = new MyClass(); const result = await myInstance.result; console.log(result); })(); 이 경우, 그냥 Promise를 반환하면 간단하게 async getter를 구현할 수 있다. cl..

일반적으로 falsy한 값의 체크는 다음과 같이 확인한다. function isFalsy(value) { return !value ? true : false; } console.log(isFalsy(undefined)); // true console.log(isFalsy(null)); // true console.log(isFalsy(0)); // true console.log(isFalsy('')); // true console.log(isFalsy([])); // false console.log(isFalsy({})); // false /* 요런 특징을 이용해서 if(value) 또는 if(!value)로 활용하곤 한다. */ 그러나 0과 빈 문자열은 검증하지 않고, 오로지 null 또는 undefi..

String.prototype.localeCompare()를 배열의 sort()와 함께 사용하여 다음과 같이 코드를 작성할 수 있다. String.prototype.localeCompare() - JavaScript | MDN The localeCompare() method returns a number indicating whether a reference string comes before, or after, or is the same as the given string in sort order. developer.mozilla.org const arr = [ { name: 'folder_1' }, { name: 'folder_2' }, { name: 'folder_3' }, { name: 'fold..