게으른 개발노트

문제 링크 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 문제 설명 제한사항 입출력 예제 문제 풀이 조이스틱이 상/하 이동을 할 때 최소값을 구하고, 좌/우 이동할 때의 최소값을 구해야하는 것이 핵심이다. 상/하 이동 const changeCharToCode = (char) => { return char.charCodeAt(); } const codeTable = { A:changeCharToCode("A"), Z:changeCharToCode("Z") + 1, } 아스키코드로 변환하는 함수와 A,Z의 아스키 코드를 해시 테이블 형태로 저장. Z에 1을 ..

문제 링크 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 문제 설명 제한사항 입출력 예제 문제 풀이 1. +,-,*를 순서대로 돌아야하기 때문에 연산 배열 operators를 만들어준다. 2. 입력받은 수식을 정규표현식으로 숫자와 기호를 나누어준다. split(/(\D)/); 3. eval을 통해 문자열로 되어있는 식을 계산해주고 다시 연산식에 대입해준다. 4. 연산결과를 모두 배열에 저장후 가장 큰 값을 반환해준다. function solution(expression) { const operators = ["*-+", "*+-", "+*-", "+-*"..

문제 링크 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 문제 설명 입력 형식 출력 형식 조건 입출력 예제 문제 풀이 1. 캐시 사이즈가 0이라면 계속 cache miss이기 때문에 cities길이 * 5를 먼저 반환해줌 2. cities길이 만큼 while 반복문을 돌면서 소문자로 치환한 city 이름을 구해준다. (대소문자 구분 x) 3. 캐시에 city가 있으면 해당 인덱스에 있는 city를 삭제하고, count 1증가 4. 캐시에 city가 없으면 count 5증가 후 cache.push(city)를 해주는데, 캐시 길이가 캐시사이즈랑 같으면 sh..

문제 링크 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 문제 설명 제한사항 입출력 예 문제 풀이 1. string.split("0")을 이용해서 문제에 나와있는 "P"를 구해준다. 2. 1은 소수가 아니므로 제외하고, 110011을 split("0")할 경우 ["11", "", "11"]이 나오기 때문에 빈 문자열도 제외해준다. 3. split("0")한 배열을 반복문 돌면서 숫자로 형변환해주고 제곱근을 구해준다. 4. i = 3부터 제곱근까지 반복문을 돌면서 소수를 구해준다. const isDecimal = (number) => { const sqrt..

자바스크립트 초기에는 간단한 모듈 시스템만을 제공했다. // foo.js var todo = "코딩하기" // bar.js var todo = "꿀잠자기" 위 두 스크립트를 로드한 전역 컨텍스트에서 각 모듈 간의 충돌이 발생한다는 문제가 있었다. foo.js에서 선언한 변수와 같은 이름을 가진 변수가 bar.js에 선언되어 있다면 나중에 호출된 bar.js의 변수로 재정의 되면서 foo.js의 파일이 제대로 동작하지 않게 된다. 즉, 모듈 간의 스코프가 구분되지 않아서 다른 파일을 오염시키는 경우가 발생했다. 이런 문제점들을 갖고 있는 상태로 2008년 Google의 V8 엔진이 공개되었고, 이를 이용해 서버 사이드에서 자바스크립트를 활용하자는 아이디어가 제시 되었다. 그래서 더더욱 모듈화가 필요해졌고 ..

HTML 기본 구조 // 관습적으로 document 타입은 html이다라고 명시 // html은 head와 body로 나뉘어진다. // 사용자에게 보여지는 최상위의 컨테이너, body안에 작성된 내용이 화면에 보여진다. 우리는 HTML과 JavaScript를 이용해서 웹 프로그래밍을 할 때 태그를 태그가 끝나는 지점 바로 위에 지정해준다. 그 이유는 브라우저가 HTML 파싱을 하다가 태그를 보면 파싱을 중단하고 스크립트 파일을 다운로드하고 실행하기 때문이다. 그래서 태그가 맨 위에 있으면 브라우저가 스크립트를 다운로드하고 실행할 때까지 화면에 아무것도 보이지 않게 되기 때문에 태그 맨 아래에 위치시키는 것이다. 하지만 이 방법이 완벽한 해결책은 아니라고 한다. 위 사진을 보게 되면 태그에 아무 설정도 해..

오는 4월 원티드 프리온보딩 프론트엔드 챌린지에 지원했고, 사전과제가 있어서 겸사겸사 오랜만에 포스팅하려고 한다. 이번 프리온보딩 챌린지 기간은 다음과 같다. 챌린지 일정 3.15 (수) ~ 3.30 (목) 참가 신청 및 사전 미션 수행 4.3 (월) ~ 4.16 (일) 기술 역량 향상 (2주) 월요일 & 목요일 20시 Online (3시간) 4.17 (월) ~ 5.14 (일) 취업 챌린지 (4주) 이번에 처음으로 지원해봤는데 단기간에 취업하는 챌린지고, 원티드를 통해 20건 이상을 지원한 챌린저들에게는 상금을 나누어주는 혜택도 있다고 한다. 이제 막 데브코스 수료한 나에게는 안할 이유가 없어서 데브코스 동기들에게도 알려주고 바로 지원하게 되었다. 이제 사전과제와 React 18버전의 새로운 기능들에 대..

Redux와 MobX보다 러닝커브가 적은 Recoil을 프로젝트에서 주로 사용을 했지만 뭔가 제대로 썼다는 느낌을 못 받아서 앞으로 남은 데브코스 최종 플젝때는 제대로 써보는걸 목표로 잡고 블로그에 공부내용을 정리하려고 한다. (+FE스터디 발표) Recoil은 Redux와 MobX와 다르게 React를 위해 출시된 Facebook에서 개발한 전역상태관리 라이브러리이다. React의 hooks와 어울리면서 React스럽게 제작했다고 한다. Installation npm install recoil RecoilRoot 모든 곳에서 recoil을 사용하기 때문에 루트 컴포넌트가 RecoilRoot를 넣기에 가장 적합하다. import React from 'react'; import { RecoilRoot, a..