본문 바로가기

FrontEnd/Javascript

JS / Truthy, Falsy 자바스크립트에서 falsy와 truthy 값은 다음과 같다.Falsy 값자바스크립트에서 falsy 값은 다음과 같은 6가지가 있다:false0 (숫자 0)-0 (음수 0)0n (BigInt의 0)"" (빈 문자열)nullundefinedNaN (Not-a-Number)이 값들은 조건문에서 false로 평가된다.Truthy 값Falsy 값에 해당하지 않는 모든 값은 truthy 값이다. 몇 가지 예시는 다음과 같다:true{} (빈 객체)[] (빈 배열)"hello" (빈 문자열이 아닌 문자열)42 (0이 아닌 숫자)-42 (음수이지만 0이 아닌 숫자)3.14 (부동 소수점 숫자)new Date() (Date 객체)Infinity (무한대)-Infinity (음의 무한대)이 값들은 조건문에서 true로 평..
JS 자주쓰는 regex, function(replace) 2022.09.02 javascript regex, functions replace let str = date.replace("-", ""); //replace let str = date.replace(/-/gi, ""); //replace AllNumber regex regexNum = /[^0-9]/g;Email regex emailRegex = /^[0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*@[0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*\.[a-zA-Z]{2,10}$/iTel regex telRegex : /^[0-9]{2,3}-[0-9]{3,4}-[0-9]{4}/
웹 프론트엔드 간단한 성능 검사(Chrome Task Manager) Chrome Task Manager를 활용한 간단한 프론트엔드 성능검사 특정 화면에서 브라우저가 느려지는 상황 원인 파악을 위해서 사용했다. Chrome Task Manager 크롬의 작업 관리자로 Memory footprint, Cpu, Network, ProcessID를 통해서 현재 페이지에서 브라우저에 어느정도 부하가 걸리는지 확인 할 수 있다. memory footprint : 현재 탭에서 사용하는 메모리 Javascript memory : 자바스크립트에서 사용하고 있는 메모리 CPU : 해당 탭의 현재 cpu사용량 아무것도 하지 않는 상태 = 0.0 특정 액션이 발생하면 cpu 사용량 수치가 올라가는데 보통 20 ~ 30 정도의 수치를 유지 하는 것이 좋은것 같다. 페이지를 이동할때는 60~70..
윈도우 nvm 설치 후 npm 버전 확인시 오류 해결하기 npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead. 윈도우 PC에 npm 사용하기전에 npm -v 실행후 위와 같은 메시지가 출력. npm-windows-upgrade 패키지 설치가 필요 PowerShell [관리자 권한] 실행 후 Set-ExecutionPolicy Unrestricted -Scope CurrentUser -Force 실행 npm install --global --production npm-windows-upgrade 실행 npm-windows-upgrade 실행 npm -v로 확인 참고 https://github.com/npm/cli/issues/4980
윈도우에서 nvm을 통한 node 설치 에러 nvm install 12 1. 위와 같은 명령어로 nvm에서 노드를 설치 하게되면 자동으로 특정 12.xx.xx 버전의 노드가 설치된다. 2. 이후에 use 명령어를 사용하면 인스톨 되지 않았다고 출력 해결 방안 1. 기존에 설치한 node를 nvm uninstall로 삭제 2. 특정 버전 전체를 입력해서 설치(ex: nvm install 12.22.8) 3. 이후에 use 명령어에서도 버전 전체를 입력해준다.
[javascript] Compare Date 특정시간과 현재 시간 비교 const initDate = new Date(2021, 5, 27, 12, 44, 30);//yyyy, mm, dd, hh, mm, ss function compareDate(targetDate){ let nowDate = new Date(); nowDate.setMonth(nowDate.getMonth() + 1); return targetDate < nowDate ? true : false } console.log(compareDate(initDate)); //특정시간이 지나면 true 출력
[Javascript] Cover Up Scrolling layout. [스크롤시 덮이는 레이아웃] [완성본 Complete] https://nam-h-j.github.io/cover_up_scroll_layout/index.html [잡설 Small talks] 정확한 레이아웃 명칭을 몰라서 구글링 실패 이벤트 관련 소스코드가 제이쿼리로 구현하는게 너무 많아서 참고하기가 어려웠음 10시간 정도 삽질..(absolute 로 하려다가 개망함) 보통 CSS에 fixed 속성 만 주면 매우 쉽게 만들 수 있지만 덮이는 효과가 나오는 레이아웃이 스크롤 되다가 중간에 나타나야 했음.. 라이브러리 사용하는게 정신건강에 좋지만.. 뿌듯...^^... [Code] //변수 var bodyElem = document.body,// 전체 바디 fixedArea = document.querySelector('.fixed_..
[Javascript] Array.prototype.find(callback[, thisArg]) return The value of the first element in the array that satisfies the provided testing function. Otherwise, undefined is returned.(판별 함수를 만족하는 첫번째 값, 없으면 undefined를 리턴) example let arr = [1,2,3] let find = arr.find(function(a){ return a === 1 } console.log(find) //1 //Arrow Function let arr = [1,2,3] let find = arr.find(a => a===1) console.log(find) //1 *참고 : https://developer.mozilla.org/en-US/..