정재남님의 무근본 무계획 쇼핑몰 프로젝트 만드는 걸 따라하면서 새로운 것 투성이라 신기했다. 하나하나 차근차근 찾아보려고 우선 Vite의 공식문서부터 열고 가이드의 가장 첫 번째 섹션인 Vite를 사용해야 하는 이유부터 보는데 첫 문장부터 이해가 잘 되지 않았다...! 생각해보니 프로젝트 하면서 너무나 당연하게 export 와 import 를 사용했고, 이게 ES6 부터 지원하는 모듈이라는 건 알고 있었는데 자세히 알아본 적이 없어서 단어들이 생소하게 느껴진 거였다. 그럼 ES Module에 대해서 살펴보자! ES Module이란? ES Module은 ES6부터 도입된 모듈 시스템이다. export 및 import문을 사용하여 분리되어 있는 자바스크립트 파일 간의 접근을 가능하게 만들어준다. ES Mod..
Promise.all Promise.all은 파라미터로 주어진 Iterable 객체(보통은 배열의 형태가 많음)의 모든 프로미스를 이행한 후 새로운 프로미스를 반환한다. 이 때 반환되는 프로미스는 파라미터로 받은 배열 안의 프로미스의 결과값을 담은 새로운 배열을 result로 가지게 된다. 새로운 프로미스의 result 배열의 요소 순서는 Promise 이행 완료의 순서와는 상관 없이 Promise.all의 파라미터 배열의 요소 순서와 상응한다. Promise.all은 서로 관련된 여러 프로미스의 결과를 집계할 때 유용하며, 다음 코드를 실행하기 전에 연관되어 있는 비동기 작업들이 모두 이행이 완료되어야 하는 경우에 사용된다. 구문 Promise.all(iterable) // iterable은 배열 등과..
실행 컨텍스트 (Execution Context) 실행 컨텍스트는 코드를 실행하는 데 필요한 조건이나 환경 정보 등을 수집해 놓은 객체를 뜻한다. 실행 컨텍스트는 1) 전역 공간에서 익명 함수 실행 시, 2) eval 함수 실행 시, 3) 함수 실행 시, 4) {} 코드 블럭 사용 시 생성된다. if문, for문, switch문, while문 등의 반복문이나 조건문은 let과 const 키워드에 대해서는 별개의 독립된 공간으로서의 역할을 하지만 별도의 실행 컨텍스트가 생성되지는 않으며, 함수라 하더라도 함수의 실행 내용을 정의해 놓은 정의부가 아닌 실행문을 만나야 실행 컨텍스트가 생성된다. 아래 코드의 실행 순서와 출력값을 예측해보자. var a = 1; function outer () { console..
Link: https://programmers.co.kr/learn/courses/30/lessons/42889 코딩테스트 연습 - 실패율 실패율 슈퍼 게임 개발자 오렐리는 큰 고민에 빠졌다. 그녀가 만든 프랜즈 오천성이 대성공을 거뒀지만, 요즘 신규 사용자의 수가 급감한 것이다. 원인은 신규 사용자와 기존 사용자 사이에 스 programmers.co.kr 문제 설명 슈퍼 게임 개발자 오렐리는 큰 고민에 빠졌다. 그녀가 만든 프랜즈 오천성이 대성공을 거뒀지만, 요즘 신규 사용자의 수가 급감한 것이다. 원인은 신규 사용자와 기존 사용자 사이에 스테이지 차이가 너무 큰 것이 문제였다. 이 문제를 어떻게 할까 고민 한 그녀는 동적으로 게임 시간을 늘려서 난이도를 조절하기로 했다. 역시 슈퍼 개발자라 대부분의 ..
문제 설명 게임개발자인 "죠르디"는 크레인 인형뽑기 기계를 모바일 게임으로 만들려고 합니다. "죠르디"는 게임의 재미를 높이기 위해 화면 구성과 규칙을 다음과 같이 게임 로직에 반영하려고 합니다. 게임 화면은 "1 x 1" 크기의 칸들로 이루어진 "N x N" 크기의 정사각 격자이며 위쪽에는 크레인이 있고 오른쪽에는 바구니가 있습니다. (위 그림은 "5 x 5" 크기의 예시입니다). 각 격자 칸에는 다양한 인형이 들어 있으며 인형이 없는 칸은 빈칸입니다. 모든 인형은 "1 x 1" 크기의 격자 한 칸을 차지하며 격자의 가장 아래 칸부터 차곡차곡 쌓여 있습니다. 게임 사용자는 크레인을 좌우로 움직여서 멈춘 위치에서 가장 위에 있는 인형을 집어 올릴 수 있습니다. 집어 올린 인형은 바구니에 쌓이게 되는 데,..