https://kingheedo.tistory.com/101 [1차] 비밀지도(2018 KAKAO BLIND RECRUITMENT) - JS 문제 설명 네오는 평소 프로도가 비상금을 숨겨놓는 장소를 알려줄 비밀지도를 손에 넣었다. 그런데 이 비밀지도는 숫자로 암호화되어 있어 위치를 확인하기 위해서는 암호를 해독해야 한다. kingheedo.tistory.com parseInt와 toString은 여태까지 문자열로 변경하기 위해서 사용했던 적이 많았다. 위의 문제를 풀면서 다른 목적으로 사용 가능함을 알 수 있었다. parseInt() 1. 정수로 변환 2. 특정 진수를 10 진수로 변환 const val = '1000' console.log(parseInt(val)); //1000(val을 정수로 변환)..
문제 설명 네오는 평소 프로도가 비상금을 숨겨놓는 장소를 알려줄 비밀지도를 손에 넣었다. 그런데 이 비밀지도는 숫자로 암호화되어 있어 위치를 확인하기 위해서는 암호를 해독해야 한다. 다행히 지도 암호를 해독할 방법을 적어놓은 메모도 함께 발견했다. 지도는 한 변의 길이가 n인 정사각형 배열 형태로, 각 칸은 "공백"(" ") 또는 "벽"("#") 두 종류로 이루어져 있다. 전체 지도는 두 장의 지도를 겹쳐서 얻을 수 있다. 각각 "지도 1"과 "지도 2"라고 하자. 지도 1 또는 지도 2 중 어느 하나라도 벽인 부분은 전체 지도에서도 벽이다. 지도 1과 지도 2에서 모두 공백인 부분은 전체 지도에서도 공백이다. "지도 1"과 "지도 2"는 각각 정수 배열로 암호화되어 있다. 암호화된 배열은 지도의 각 가..
insertBefore로 참조된 노드 앞에 해당 부모 노드의 자식노드를 삽입하기 const [draggingItem, setDraggingItem] = useState(null); /** 처음 드래그를 시작할때 * 1. 드래그 시작시의 요소를 state에 저장 */ const onDragStart = (e) => { setDraggingItem(e.currentTarget); }; /** 드래그가 끝날시 드래그하던 객체를 놓는 장소에서 이벤트 발생 */ const onDrop = (e) => { e.preventDefault(); const rect = e.currentTarget.getBoundingClientRect(); //드래그가 끝난 요소의 뷰포트 기준 위치 //현재 마우스 위치가 버튼의 위에 ..
리스트를 드래그 앤 드롭으로 순서를 변경해야하는 프로젝트를 진행하였다. 이에 drag 이벤트를 간단히 정리하였다. 이벤트 핸들러 설명 drag ondrag 요소를 드래그하면 항상 발생 dragstart ondragstart 드래그가 시작되면 발생 dragend ondragend 드래그가 끝날때 발생(마우스버튼 놓을시) dragenter ondragenter 이벤트가 달린 요소에 드래그한 아이템이 들어가면 발생 dragleave ondragleave 이벤트가 달린 요소에 드래그한 아이템이 떠날시 발생 dragover ondragover 이벤트가 달린 요소에 드래그가 이루어지면 발생 drop ondrop 이벤트가 달린 요소에 드래그가 끝나면(마우스 버튼을 놓으면) 발생 드래그 이벤트를 발생시키기 위해서는 d..
Scope란 범위. 유효공간. 살 수 있는 공간. 허용공간. 허용범위 를 의미한다. 함수스코프란 함수에 의해서 생기는 범위. 자바스크립트에서 ES5에서는 함수에 의해서만 변수의 유효범위가 생길 수 있었다. ES6부터 블록스코프가 등장하였다. 블록이란? { }중괄호를 의미한다. { }에 의해서 변수의 유효범위가 결정된다. 라고 할 수 있다. { let a = 5 { let a = 10 console.log(a) } console.log(a) } console.log(a) 콘솔 값은 각각 10 , 5, undefined가 출력된다. (function () { var a = 5; (function () { var a = 10; console.log(a); })(); console.log(a); })(); co..
호이스트, hoist 명사 소형의 감아올리는 장치. 공장 내의 재료 운반·조립에 사용하며, 들보 위에서 이동시킴. 구동 방식에 따라 공기 호이스트·전기 호이스트 등으로 나누어짐 구글의 검색 결과는 올린다는 의미로 명시되어있다. 자바스크립트 내에서의 호이스팅 동작을 알아보자. console.log(a()); console.log(b()); console.log(d()); function a() { return 'h1'; } function b() { return 'h1'; } var d = function () { return 'd'; } 원래는 오류가 나야 하는 코드 일 것이다. 함수를 선언, 할당하기도 전에 console을 실행 하기 때문이다. 하지만 자바스크립트가 실제로 실행하는 코드 순서는 위와 좀..