FrontEnd

FrontEnd/프로그래머스
[JS] 상담원 인원
문제를 처음 딱 읽고 보니 완전탐색이 떠올랐다. 어차피 유형이 최대 5개이니 합이 n이 나오는 5개의 수 조합을 찾으면 되는 문제였다. 몇번 공부했었던 combination을 구하는 로직을 조금 비틀어서 위 수식을 구한 이후에는 시나리오들을 돌려보며 time들을 구하면 되는 문제이다. 어떻게 풀까 하다가 객체를 통해서 문제를 해결하기로 했다. 상담자 객체를 하나 만들어서 상담이 종료되는 시각과 타입이 들어온다. 문제에서 상담원들은 시간순서대로 들어오기 때문에 1. 상담받을수 있는 상담가 중에서 종료 시간이 가장 최근인 상담가를 선택 종료시간이 현재보다 과거라면 지금당장 상담을 받을 수 있기에 상담가의 종료시간을 현재시간 + 상담기간으로 설정 종료시간이 현재보다 미래라면 지금당장 상담 받을 수 없기에 상담..
→2023.10.07
FrontEnd/프로그래머스
[JS] 에어컨
쉽지 않은 문제였다... dp로 풀면 뭔가 될꺼 같은데 1시간정도 넘게 고민을 해도 뭔가나올듯 말듯 했다. 그러다가 힌트만 참고하잔 생각으로 질문게시판을을 봤는데 dp를 2차원으로 쓴다는 말만 보고 아이디어를 얻고 혼자 생각해보았다. 오랜만에 난이도있는 dp문제를 접해서인지 dp를 2차원으로 둘 생각을 못했다!! 최대 1000초의 시간이 주어지고 온도도 50도 안으로 오니 가능했었던 문제였다. 만약 첫번째 예시를 통해서 dp를 채우면 아래와 같이 나와야 한다. N은 편의상 INF중에서 N만 쓴것으로 무한대를 의미한다! 손님이 없다면 모든 경우의 수를 보고 있다면 희망온도 안에서만 경우의 수를 따지면 된다. 이때 생각해야할 것이있다. 1. 에어컨을 1도 올리는 경우 2. 에어컨을 1도 내리는 경우 3. 에..
→2023.10.04
FrontEnd/Deep Dive
[JS] DeepDive(49) Babel과 Webpack을 이용한 ES6+/ES.NEXT 개발 환경 구축
크롬,사파이 , 파이어폭스 , 엣지 등 대부분 브라우저는 ES6을 지원한다. IE 11의 ES6 지원률을 매우 낮으며 매년 새롭게 도입되는 ES6+ 버전이나 제안단계의 ES제안 상양은 브라우저에 따라서 지원율이 제각각이다. 즉 ES6+와 ES.NEXT의 ECMAScript사양을 활용하려면 최신 사양으로 작성된 코드를 때에 따라서는 구형 브라우저에서도 동작시키기 위한 환경 구축이 필요하다. 대부분 프로젝트가 모듈을 사용하므로 모듈 로더도 필요한데 ESM은 대부분 브라우저에서 사용할 수 있긴 하지만 몇가지 이유로 별도의 모듈 로더를 사용하는것이 일반적이다. 1. 구형브라우저에서 ESM을 지원하지 않음 2. ESM을 사용해도 트랜스파일링이나 번들링이 필요함 3. ESM이 아직 지원하지 않는 기능이 있으며 해결..
→2023.09.27
FrontEnd/Deep Dive
[JS] DeepDive(48) 모듈
모듈의 일반적 의미 모듈이란 애플리케이션을 구성하는 개별적 요소이다. 모듈이 성립하기 위해선 모듈은 자신만의 파일 스코프를 가질 수 있어야 한다. 모듈의 모든 자산은 캡슈로하되어 다른 모듈에서 접근할 수 없으며 즉 모듈은 애플리케이션과 분리된다. 하지만 애플리케이션과 모듈이 완전히 분리된다면 모듈은 사용하는 의미가 없다. 따라서 공개에 필요한 부분에 한정해서 선택적으로 공개한다. 이게 export이다. 모듈 사용자는 모듈이 공개한 자산 중 일부나 전체를 선택하여 자신의 스코프로 불러올 수 있으며 이를 import라고 한다. 자바스크립트와 모듈 자바스크립트는 웹페이지의 단순한 보조 기능을 처리하기위한 제한 적 용도를 목적으로 태어난 언어이다. 따라서 타 언어와 비교할때 부족한 점이 몇가지 있는데 대표적으로..
→2023.09.27
FrontEnd/Deep Dive
[JS] DeepDive(47) 에러처리
에러 처리의 필요성 에러가 발생하지 않는 코드를 작성하는 것은 불가능하다. { // 매개변수 f에 전달된 인수가 함수가 아니면 TypeError를 발생시킨다. if (typeof f !== 'function') throw new TypeError('f must be a function'); for (var i = 0; i < n; i++) { f(i); // i를 전달하면서 f를 호출 } }; try { repeat(2, 1); // 두 번째 인수가 함수가 아니므로 TypeError가 발생(throw)한다. } catch (err) { console.error(err); // TypeError: f must be a function } 에러의 전파 에러는 호출자 방향으로 전파되며 콜 스택의 아래방향으로 ..
→2023.09.27
FrontEnd/Deep Dive
[JS] DeepDive(46) 제너레이터와 async/await
제너레이터 ES6에서 도입된 제너레이터는 코드 블록의 실행을 일시적으로 중지했다가 필요한 시점에 다시 재개할 수 있는 특수한 함수이다. 1. 제너레이터 함수는 함수 호출자에게 함수 실행의 제어권을 양도할 수 있다. 2. 제너레이터 함수는 함수 호출자와 함수 상태를 주고받을 수 있다. 3. 제너레이터 함수를 호출하면 제너레이터 객체를 반환한다. 제너레이터 함수는 function* 키워드로 선언하며 하나 이상의 yield 표현식을 포함한다. // 제너레이터 함수 선언문 function* genDecFunc() { yield 1; } // 제너레이터 함수 표현식 const genExpFunc = function* () { yield 1; }; // 제너레이터 메서드 const obj = { * genObjMe..
→2023.09.27

• 이전
• 1
• ···
• 20
• 21
• 22
• 23
• 24
• 25
• 26
• ···
• 72
• 다음