Front-End Dev.
-
[CodeKata] 프로그래머스 : 3.10(수), 이진 변환 반복하기Algorithm 2021. 3. 10. 12:32
🥋 Ooooth!! (Level 2) 🧮 풀이 function solution(s) { let answer = [0, 0]; while(s !== "1") { const sOneLen = s.replaceAll("0", "").length; // const sOneLen = s.split("").filter(e => e === '1').join("").length; answer[0]++; answer[1] += s.length - sOneLen; s = sOneLen.toString(2); } return answer; } answer는 정답 튜플이다. 0번째는 변환 횟수, 1번째는 제거된 0의 갯수를 저장할 것이다. while 반복문을 반복한다. 종료조건은, s가 "1"이 될 때이다. "1"은 이진변환..
-
[CodeKata] 프로그래머스 : 3.9(화), 숫자의 표현Algorithm 2021. 3. 9. 16:06
🥋 Ooooth!! (Level 2) 🧮 풀이 공식보다는, 내가 발견한 나름의 규칙성으로 푼 방식이다. function solution(n) { let answer = 1; let div = 2; while (Math.round(n/div) - Math.floor(div/2) >= 1) { if (div%2 === 1 && n%div === 0) { answer++; } else if (div%2 === 0 && n%div === div/2) { answer++; } div++; } return answer; } 1) 변수 설정 answer는 연속한 자연수의 경우의 수이다. 1로 시작하는 이유는 n 자체 1개인 경우는 모든 수가 해당하므로! div는 n을 나눌 숫자이다. 위의 경우가 1로 나눴을 떄이므로..
-
[CodeKata] 프로그래머스 : 3.8(월), 방문 길이Algorithm 2021. 3. 8. 16:44
🥋 Ooooth!! (Level 2) 🧮 풀이 function solution(dirs) { let position = [0,0]; let count = 0; let vectorArr = []; const move = { U: (arr) => arr[1] === 5 ? arr : [arr[0], arr[1]++], D: (arr) => arr[1] === -5 ? arr : [arr[0], arr[1]--], R: (arr) => arr[0] === 5 ? arr : [arr[0]++, arr[1]], L: (arr) => arr[0] === -5 ? arr : [arr[0]--, arr[1]], } for (let l of dirs) { const vector = [position, move[l](po..
-
[CodeKata] 프로그래머스 : 3.7(일), 게임 맵 최단거리Algorithm 2021. 3. 7. 15:34
🥋 Ooooth!! (Level 2) 🧮 풀이 최단거리이기에 BFS 문제임은 인지했으며, 모범답안을 통해 Javascript에서 queue를 통한 BFS 구현을 공부했다. 🖇 리뷰 function solution(maps) { let result = 0; let ySize = maps.length; let xSize = maps[0].length; let queue = [[0, 0]]; let visited = Array.from(new Array(ySize), () => new Array(xSize).fill(false)); while (queue.length) { result++; const size = queue.length; for (let i = 0; i < size; i++) { const p..
-
[Javascript] Infinite Scroll (Height 속성)Front-End(Web)/Javascript 2021. 3. 7. 04:51
🤔 배경 3차 프로젝트로 Nike 사이트 클론을 진행하면서, List 페이지를 연구하는테 아이템을 페이지네이션이 아닌 "인피니트 스크롤" 로 이어붙이는 로직으로 구성되어있는 것이었다. (아래는, 원본 사이트 영상) 이를 구현하기 위해서, documentElement의 높이값 속성들을 통해 조건을 적용해야했고, 이를 간단히 정리하고 넘어가고자 글을 썼다. 📒 scrollHeight / clientHeight / offsetHeight - document.documentElement 위 세 가지 Height 속성값은 우선, document.documentElement 에서 가져올 수 있는 필드들이다. documentElement는 모든 비어있지 않은 HTML 문서에서, 항상 요소를 가르킨다. (모든 비어있지..
-
[CodeKata] 프로그래머스 : 3.5(금), 땅따먹기카테고리 없음 2021. 3. 5. 14:34
🥋 Ooooth!! (Level 2) 🧮 풀이 반복문이나 DFS를 시도했지만 마땅한 풀이가 나오지 않아, 프로젝트 진행을 위해 모범답안을 참고했다. 🖇 리뷰 function solution(land) { var answer = 0; var len = land.length; for (var i =len-2; i>=0; i--){ land[i][0] = Math.max(land[i+1][1], land[i+1][2], land[i+1][3])+land[i][0]; land[i][1] = Math.max(land[i+1][0], land[i+1][2], land[i+1][3])+land[i][1]; land[i][2] = Math.max(land[i+1][0], land[i+1][1], land[i+1][3]..
-
[Storage] 로컬 스토리지 / 세션 스토리지 / 쿠키Environment(개발환경)/Web 2021. 3. 4. 16:30
🤔 서론 그간 JS 미니프로젝트나 로그인 토큰의 경우 브라우저의 LocalStorage에 저장해왔다. (아무생각 없이..?) 하지만, 프로젝트를 진행하며 이메일 저장기능을 쿠키에 적용하기를 권장했고 우선 react-cookie로 이를 구현했다. 이번 기회로, 세션 스토리지까지 세 저장소의 차이점을 명확히 구분해보려고 한다. 이는, 추후 올바른 저장소 선정에 큰 도움이 되길 바란다. 📕 Web Storage 먼저, 스토리지를 Web Storage 와 Cookie로 분리할 수 있다. Web Storage는 Cookie의 단점을 보완하기 위해 HTML5 버전에 적용됬다. 이는 웹 사이트의 데이터를 클라이언트에 저장할 수 있는 새로운 자료구조로, Session Storage(세션 스토리지), Local Stor..
-
[CodeKata] 프로그래머스 : 3.4(목), 다음 큰 숫자Algorithm 2021. 3. 4. 12:24
🥋 Ooooth!! (Level 2) 🧮 풀이 function binOneCount(n) { const regex = /[1]/g; return n.toString(2).match(regex).length; } function solution(n) { const target = binOneCount(n) while (true) { n++; if (binOneCount(n) === target) { return n; break; } } } binOneCount() 함수는, n(숫자)를 이진법으로 변환한 뒤 '1'의 개수를 반환하는 함수이다. solution() 함수는 풀이를 진행할 함수이다. 먼저, 현재 숫자 n의 1의 개수를 target 변수에 저장한다. while 반복문을 실행한다. n에 1을 더하면서..