pu3vig_since.2022.05.log

target: _.cloneDeep 사용 method: Lodash 함수 중 _.cloneDeep은 깊은 복사(완전 별개의 객체 생성) var value1 = 1; function add(value1) { var value2 = value1; return value2 + 1; } // 기존 객체 value1의 값 또한 동일하게 증가 console.log('after add() ', add(value1));// 2 console.log('org value1', value1);// 2 function add2(value1) { var value2 = _.cloneDeep(value1); return value2 + 1; } // 기존 객체 value1의 값에는 영향이 없음 console.log('after ..

target: Javascript에서 문자열 true, false에 대해 boolean 타입으로 변경 method: String에서 Boolean으로 변환하는 방법을 알아보도록 하자. 별 생각없이 형 변환을 하다가는 오류를 범할 수 있다. API response로 Boolean 타입의 객체가 오면 문제가 되지 않지만, String 타입의 'true', 'false'로 response를 받는 경우도 종종 있다. 간단하게 if 문 구성을 String 비교로 해도 되지만 Boolean의 의미가 퇴색되어 버린다고 할까 뭔가 부족한 느낌이다. 다른 방법으로 Boolean 함수를 생각할 수 있지만 이 또한 문제가 있다. 아래 코드로 간단하게 확인해보자. Boolean(null);//false Boolean(unde..

target: jQuery cookie 생성 및 삭제 관련 method: // 쿠키 생성 // 쿠키의 세부 옵션 중에 expires는 유효 기간을 의미하며 일 단위 // path는 일반적으로 '/'를 사용하며, 도메인과 일치해야 저장 $.cookie("쿠키 키 값", "쿠키 값", {expires: 1, path: '/'}); // 쿠키 삭제 // 삭제할 쿠키 키 값을 입력하고, 쿠키 생성 시, path를 작성하였을 경우, path까지 설정 // 쿠키 키 값과 path가 일치해야 쿠키가 삭제됨 $.removeCookie('쿠키 키 값', {path: '/'}); ※ 보안상 최근에는 쿠키를 잘 사용하지 않으나, [오늘 하루 열지 않기] 와 같은 기능을 적용하고자 하는 경우 사용

target: 문자열 검색 함수(indexOf, search) method: 1. indexOf var str = 'html, java, javascript'; var pos = str.indexOf('Javascript'); // -1 var pos2 = str.indexOf('javascript'); // 12 var pos3 = str.toUpperCase().indexOf('JAVASCRIPT'); // 또는 //var pos3 = str.toLowerCase().indexOf('javascript'); // 12 var pos4 = str.indexOf(','); // 4 var pos5 = str.indexOf(',', 5); // 10 ※ pos의 경우, 대소문자 구분으로 인하여 positi..

target: 크롬 자동완성으로 인해 의도치 않은 input에 자동완성이 되는 현상 method: 자동완성을 사용하는 경우(아이디/비밀번호 같은), 페이지에서 이벤트가 발생할 때, 의도치 않은 input에 자동완성 문자가 들어가는 현상 desc: form에 autocomplete="off" 옵션을 통해서 자동완성을 해당 페이지에서 동작하지 않도록 설정 ※ Browser에서 자동완성을 사용하지 않는다면, 해당 이슈를 만날 일이 없음

target: 종종 사용되는 정규식 정리 method: 1. Comma // num = 123456789.987654321 function comma(num) { var splitNum = num.toString().split('.'); var integer = splitNum[0];// 123456789 var decimal = splitNum[1];// 987654321 integer = integer.replace(/\B(?=(\d{3})+(?!\d))/g, ',');// 123,456,789 return integer + (decimal ? '.' + decimal : ''); } function delComma(num) { return num.replace(/,/g, ''); } ※ 정수부/소수..

target: date 관련 라이브러리 day.js 사용 방법 - JavaScript 날짜 라이브러리 - intro : JavaScript 날짜 관련 라이브러리 중 가장 가벼운 라이브러리 : 업데이트가 중단된 moment.js 보다 약 33배 가벼우며, immutable한 구조라서 굉장히 많이 사용되고 있는 라이브러리 : moment.js와 문법이 비슷하여서 moment.js 대체로 굉장히 많이 사용 method: 1. day.js 사용 준비 - Module 설치(ex. nodejs) $ npm install dayjs ※ npm을 이용하여 day.js 설치 import dayjs from "dayjs"; // or const dayjs = require("dayjs"); - CDN 사용 ※ 2022년 ..

target: regexp를 이용하여 특정 포맷으로 적용 method: function dataFormat(type, value, masking) { var f_value; var format; // 숫자만 적용 value = value.replace(/[^0-9]/g, ''); switch(type) { case 'card': /* 카드번호 format(XXXX-XXXX-XXXX-XXXX) */ /* masking 적용시, '$1-****-****-$4'을 masking 인자로 전달 */ format = masking || '$1-$2-$3-$4'; f_value = value.replace(/(\d{4})(\d{4})(\d{4})(\d{4})/, format); break; case 'bizNo': ..