1부터 n까지 합을 구하는 스니펫을 여러가지 방법으로 짜봤습니다. 1. for문 for문을 이용한 가장 간단한 방식입니다. 시간복잡도는 O(n)입니다. const sum=n=>{ let answer=0; for(let i=1;i { if(n===1) {return 1} return n+sum(n-1); } 3. 수학적인 방법 사용 중고등학교때 배웠던 가우스의 유명한 일화가 있습니다. 1+2+..+(n-1)+n를 빠르게 푸는 방법으로 ((1+n)*n)/2를 활용하는 것입니다. 시간복잡도는 O(1)으로 세 가지 방법 중 가장 빠릅니다. const sum=n=>{ return n*(n+1)/2; } 이밖에 다른 방법을 알고 있거나 더 효율적인 코드를 아신다면 댓글로 달아주세요. 많은 분들에게 큰 도움이 될 거..

만약 여러분이 제작하는 서비스에서 input[type=text]의 값 유무를 판단해 "입력되었습니다"라는 문구를 표시해야 한다면 어떻게 구현할 수 있을까요. 아마 가장 처음으로 떠오르는 방법은 JavaScript로 input DOM의 value값을 받아오는 것일 것입니다. 아마도 위 기능은 다음과 같은 코드로 구현할 수 있습니다. 값이 입력되었습니다. 그러나 이렇게 JavaScript를 이용하지 않고도 HTML과 CSS만을 이용해 비슷하게 구현할 수 있습니다. 바로 가상 클래스 요소 :placeholder-shown과 css의 선택자를 이용하면 훨씬 간단하게 구현할 수 있습니다. 값이 입력 되었습니다. 가상 클래스 요소 :placeholder-shown은 input과 textarea에서 placehold..

기술면접 스터디 3주차에 이어 4주차를 진행하고 관련 내용을 정리합니다. 이전의 내용이 궁금하시다면 다음을 클릭해주세요. 1주차: 이벤트 위임부터 코드구성까지 2주차: 호스트 객체부터 Ajax까지 3주차: 호이스팅부터 이벤트 버블링까지 전체 질문 리스트의 출처는 front-end-interview-handbook이며, 이 글은 스터디 내용을 복기하고 정리하는 글로 아주 상세한 기술내용을 담고 있진 않습니다. 관련해서는 이후에 따로 정리할 계획입니다. 4주차 질문은 전역스코프, load 이벤트, SPA와 SEO, Promise와 Polyfill, Callback, JavaScript로 컴파일 되는 언어 등에 대한 내용입니다. 1. 일반적으로 웹 사이트의 전역 스코프를 그대로 두고 건드리지 않는 것이 좋은 ..

some() 메서드는 배열 안의 어떤 요소라도 주어진 판별 함수를 통과하는지 테스트합니다. - MDN의 Array.prototype.some() Array.prototype.some()은 배열의 요소 중 특정 조건(판별함수)을 만족하는 요소가 하나라도 존재하는지 여부를 판단할 때 쓸 수 있습니다. Array의 요소 중 콜백함수(판별함수)가 true를 반환하는 값이 하나라도 나오면 해당 메소드는 true를 반환합니다. 다시 말하면 true를 반환하는 값이 하나도 없으면 false를 반환합니다. 알고리즘을 공부하면서 유용하게 쓸 수 있다는 걸 알았지만 많이 써보지 않아 익숙치 않아서 한번 정리합니다. let array = [1, 2, 3, 4, 5]; const even = element => element..

componentDidUpdate()에서 setState()를 즉시 호출할 수도 있지만, ... 조건문으로 감싸지 않으면 무한 반복이 발생할 수 있다는 점에 주의하세요. - React 공식문서 componentDidUpdate(){ ... this.setState({currentAddress:items[0].region.area3.name}); } React로 프로젝트를 진행하다 특이한 현상을 발견했습니다. 화면을 render한 직후 다음 단계에서 외부 API 호출을 하기 위해 componentDidUpdate()를 사용하는데 여기서 위의 코드처럼 setState()를 사용하니 무한루프에 빠지는 것입니다. 특히나 외부 API를 호출하는 로직이 들어가있어 이 상태로 5분만 내버려두면 한달치 무료 호출량을 ..

기술면접 스터디 2주차에 이어 3주차를 진행하고 관련 내용을 정리합니다. 이전의 내용이 궁금하시다면 다음을 클릭해주세요. 1주차: 이벤트 위임부터 코드구성까지 2주차: 호스트 객체부터 Ajax까지 전체 질문 리스트의 출처는 front-end-interview-handbook이며, 이 글은 스터디 내용을 복기하고 정리하는 글로 아주 상세한 기술내용을 담고 있진 않습니다. 관련해서는 이후에 따로 정리할 계획입니다. 3주차 질문은 호이스팅, JS 템플릿, attribute/property, load/DOMContentLoaded, 일치연산자, same-origin 정책, "use strict";, fizzbuzz 문제, 이벤트 버블링 등에 대한 내용입니다. 1. JavaScript 템플릿을 사용한 적이 있나요..