Dev's

|| 연산자 첫 번째 표현식이 falsy 한 값일 경우 두 번째 표현식을 반환 undefined || 'default'; // default null || 'default'; // default 0 || 'default'; // default ?? 연산자 첫 번째 표현식이 null 또는 undefined 인 경우 두 번째 표현식을 반환 undefined ?? 'default'; // default null ?? 'default'; // default 0 ?? 'default'; // 0 falsy 값 false 0 -0 0n "" null undefined NaN

플로이드-워셜(Floid-Warshall) 알고리즘 플로이드-워셜(Floid-Washal) 알고리즘은 모든 노드간의 최단 거리를 구하는 알고리즘이다. 해당 알고리즘은 두 노드 간의 최단 경로를 최적이 될 때까지 점진적으로 개선시킴으로써 최단경로를 찾는다. 해당 알고리즘의 시간복잡도는 O(n^3)이다. 알고리즘 과정 위의 그래프에서 노드에서 다른 노드로 가는 비용을 이차원 배열로 구성하여 표시하면 다음과 같다. 해당 표에서 INF는 특정 노트에서 다른 노드로 가는 길이 없을 경우를 의미하며, 자기자신에게 이동하는 경우에 대한 비용은 0으로 할당한다. N1 N2 N3 N4 N1 0 3 6 INF N2 7 0 8 4 N3 INF INF 0 2 N4 INF 9 INF 0 노드 1을 경유하는 경우 노드 1을 경우..

input과 같이 폼에 값을 입력하게 될 경우 모바일 단말에서 각 상황에 맞는 가상 키보드가 표시된다. type 속성 값에 따라 모바일 단말에서는 활성화되는 가상 키보드가 변경되지만, inputmode 속성 값을 추가하여 type 속성 값과 별개로 가상 키보드의 형식을 지정할 수 있다. 속성 값 none 가상 키보드를 제공하지 않는다. 키보드를 직접 구현하는 경우 사용할 수 있다. text 기본값으로 제공되며, type 속성 값에 따라 제공되는 가상 키보드가 표시된다. decimal 소숫점(, .)을 제공하는 숫자형 가상 키보드가 표시된다. 또한 단말기에 따라 음의 부호(-)를 표시하는 가상 키보드가 제공될 수도, 아닐 수도 있다. numeric 숫자형 가상 키보드가 표시되며, demical과 마찬가지로..

Input 태그 사용시 커서 색상을 변경해야 할 때 caret-color css 속성을 이용하면 된다. See the Pen QWGKQQr by HanDongHee (@handonghee) on CodePen. 참고 자료 https://developer.mozilla.org/en-US/docs/Web/CSS/caret-color

전달받은 시간만큼 Sleep 시킨 후 다음코드를 실행한다. function sleep(delay) { return new Promise((resolve) => setTimeout(resolve, delay)); } console.debug('a'); await sleep(1000); console.debug('b'); // 1초후 실행

아래와 같이 조건문 안에 +를 사용하여 String에서 Number로 형변환을 시키는 코드가 있어, + 연산자의 몇가지 사용 예를 정리한다. const arry = ['1', '0']; arry.map(item => { if (+a) { ... } ... });더하기 일반적으로 사용하는 덧셈을 하도록 사용할 수 있다. 1 + 2; // 3 const a = 1; const b = 2; a + b; // 3전위, 후위 연산자 숫자를 증가시키기 위해 사용되며 전위, 후위로 사용할 수 있다. let a = 1; ++a; // 2; a; // 2; let a = 1; a++; // a; a; // 2;형변환 +을 이용하여 String을 Number 형식으로 형변환을 할 수 있다. +..

Tilt(~) 연산자 사용법 틸트(Tilt) 연산자를 사용하게 되면 내부적으로 32비트 정수로 변환 후 NOT 연산자를 실행한다. 9 ~9 // -10 최종적으로 2의 보수 -(n+1)와 같다. Tilt(~)를 사용하여 참, 거짓 처리 -(n+1)와 같다는 성질을 이용하여 조건문에서 Tilt(~)를 이용할 수 있다. const str = "Hello World"; if (~str.indexOf("ll")) { console.debug('참'); } else { console.debug('거짓'); } const arry = [1, 2, 3]; if (arry.findIndex(item => item === 2)) { console.debug('참'); } Tilt(~)를 두개 사용하여 비트 잘라내기 Ti..

모바일 단말에서 브라우저의 Orientation 변경을 감지하여 처리할 경우 orientationchange를 등록하여 사용할 수 있다. window.addEventListener('orientationchange', function() { console.debug("orientation 정보: ", screen.orientation); }); 참고 자료 https://developer.mozilla.org/ko/docs/Web/API/Window/orientationchange_event

NVM을 이용하여 Node.js 버전 변경 또는 관리하기 프로젝트를 진행하다 보면 가끔식 호환이 되지 않는 경우가 발생해 Node.js 버전을 통일시켜 사용해야한다. 그때마다 특정 버전을 설치하여 사용하기에는 비효율적이므로 NVM을 통하여 사용하고자 하는 버전으로 변경시켜 사용한다. NVM 설치하기 Unix, Linux Unix, Linux 환경에서는 cURL, Wget를 사용하여 설치할 수 있다 curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.37.2/install.sh | bash wget -qO- https://raw.githubusercontent.com/nvm-sh/nvm/v0.37.2/install.sh | bash 설치를 위한 자세한 과정..

점진적 향상법, 우아한 성능저하법 점진적 향상법 구식 기술 환경에서 동작할 수 있는 기능을 구현하고, 최신 기술을 사용할 수 있는 환경에서는 더 나은 사용자 경험을 제공할 수 있는 최신 기술을 제공하는 방법이다. 즉, 구식 환경에서도 충분히 서비스를 사용할 수 있고, 최신 환경이라면 더 나은 기능들을 사용할 수 있도록 만드는 것이다. 우아한 성능저하법 최신 기술을 기반으로 기능을 구현한 뒤, 구형 기술을 기반한 환경에서도 유사하게 동작하도록 만드는 방법이다. 최신 브라우저에서는 100만큼의 기능을 제공하고, 구식 브라우저에서는 50 정도의 기능만을 제공하게 제작하는 방법이다.