본문 바로가기

웹/javascript14

replaceAll 방법1 var reg = new RegExp(searchText, 'g'); originalText = originalText.replace(reg, replaceText); 문제점: searchText에 역슬래시 "\" 또는 $ 등의 정규식에서 사용하는 특수기호가 들어가면 RegExp에서 에러발생 방법2 단순무식 while const replaceAll = (original: string, searchText: string, replaceText: string) => { let resultText = original; let index = - 1; let startIndex = 0; index = resultText.indexOf(searchText, startIndex); while (index > .. 2021. 3. 11.
vue-chartjs - legend align is not working. There is an align option of legend in chartjs. But it is not working in vue-chartjs. https://www.chartjs.org/docs/latest/configuration/legend.html Legend · Chart.js documentation No results matching "" www.chartjs.org reason: The latest version of chartjs is 2.9.3. vue-chartjs is using 2.8.0 of chartjs. (2019-11-19) Not mached of Document. 참고: https://stackoverflow.com/questions/55355284/chart-j.. 2019. 11. 19.
fabric.js strokeWidth bug ? fabric.js를 사용하다가 new fabric.Path, new fabric.Line, new fabric.Polygon 들을 new fabric.Group으로 묶어서 사용할 경우, 초기 설정(strokeWidth: 3, stroke: 'yellow') -> 마우스 오버 이벤트(strokeWidth: 6, stroke: 'red') -> 마우스 아웃 이벤트(strokeWidth: 3, stroke: 'yellow') 로 작동시 문제: 일부 픽셀에서 red 잔상이 남는 현상이 발생한다. (화면을 확대하면, 더 많은 픽셀에서 발생, 크롬브라우저) 해결: 초기 설정(strokeWidth: 6, stroke: 'yellow') -> 캔바스에 add 후 수정(strokeWidth: 3, stroke: 'yel.. 2018. 8. 31.
PWA 프로그레시브웹앱 PWA 공부 순서 0. 샘플 사이트 테스트해보기https://www.pokedex.org 1. 잘 정리된 ppt및 블로그를 보면서 감을 잡는다.프로그레시브 웹앱이란? - Progressive Web Appshttps://www.slideshare.net/GihyoJoshuaJang/the-future-of-web-progressive-web-app현실적 PWAhttps://www.slideshare.net/netil/pwa-653788692018년과 이후 JavaScript의 동향 - 브라우저 밖의 JavaScripthttps://d2.naver.com/helloworld/5644368서비스 워커(Service Worker) 정체가 뭐니?https://b.limminho.com/archives/1384서.. 2018. 7. 19.
날짜 함수 function getDate() { var d = new Date(), month = '' + (d.getMonth() + 1), day = '' + d.getDate(), year = '' + d.getFullYear(), hh = '' + d.getHours(), mm = '' + d.getMinutes(), ss = '' + d.getSeconds() ; if (month.length < 2) month = '0' + month; if (day.length < 2) day = '0' + day; if (hh.length < 2) hh = '0' + hh; if (mm.length < 2) mm = '0' + mm; if (ss.length < 2) ss = '0' + ss; return [year.. 2018. 7. 5.
vue에서의 this vue를 공부하면서 다음과 같은 설명글을 보았다. 왜 this가 vm 자신인가? 라는 의문이 생김.출처: https://joshua1988.github.io/web-development/vuejs/vuejs-tutorial-for-beginner/ var vm = new Vue({ data: { a: 1 }, created: function () { // this 는 vm 을 가리킴 console.log('a is: ' + this.a) } }) 실제로 구성해보니 정말 그랬더라. /* 방법1*/function A(){ console.log(this);}new A(); // this는 A자신A(); // this는 Window /* 방법2*/function A(args){ args.c();}new A({ .. 2018. 6. 13.
chrome console 기능 1제이쿼리가 없더라도, 개발자 콘솔을 통해서 이와 같은 작업을 할 수 있다. $(‘tagName’) $(‘.class’) $(‘#id’)와 $(‘.class #id’)는 document.querySelector(‘ ‘)와 같다. 이것을 실행하면 매치되는 DOM에서 첫번째 엘리먼트를 리턴한다. 2브라우저 editdocument.body.contentEditable=true 3이벤트 찾기var obj = getEventListeners($('selector')) 4이벤트 모니터링monitorEvents($(‘selector’))unmonitorEvents($(‘selector’)) 5타이머console.time('myTime'); // 타이머(myTime)를 시작한다.console.timeEnd('myTim.. 2018. 5. 22.
NaN !== NaN // true Infinity == Infinity Infinity === Infinity null == null null === null undefined == undefined undefined === undefined // false NaN == NaN NaN === NaN -- // false isFinite(Infinity) isFinite(-Infinity) // true isNaN(NaN) 2018. 5. 22.