본문 바로가기

JS

Javascript EventTarget() EventTarget() EventTarget은 이벤트를 받고 그 이벤트 수신기(listener)를 가질 수 있는 객체에 의해 구현된 인터페이스입니다. Element, document 및 window는 가장 흔한 이벤트 대상(target)이지만, 예를 들어 XMLHttpRequest, AudioNode, AudioContext 및 나머지 다른 객체들도 이벤트 대상이 될 수 있습니다. 많은 이벤트 대상(element, document 및 window 포함)도 on... property 및 attribute를 통해 이벤트 처리기 설정을 지원합니다. 메서드 EventTarget.addEventListener() EventTarget에 특정 이벤트 유형의 이벤트 처리기를 등록. EventTarget.remove.. 더보기
Canvas Tutorials 캔버스 튜토리얼 요소 대체 콘텐츠 current stock price: $3.15 +0.15 렌더링 컨텍스트 엘리먼트는 고정 크기의 드로잉 영역을 생성하고 하나 이상의 렌더링 컨텍스(rendering contexts)를 노출하여, 출력할 컨텐츠를 생성하고 다루게 됩니다. var canvas = document.getElementById('tutorial'); var ctx = canvas.getContext('2d'); // document.getElementById() 메서드를 호출하여 요소를 표시할 DOM을 검색합니다. // 요소가 있으면 getContext() 메서드를 사용하여 드로잉 컨텍스트에 액세스 할 수 있습니다. 지원여부 검사 var canvas = document.getElementById.. 더보기
JS Array.Method Array.Method 실행 Array.prototype.forEach() 주어진 함수를 배열 요소 각각에 대해 실행합니다. forEach()는 주어진 callback을 배열에 있는 각 요소에 대해 오름차순으로 한 번씩 실행합니다. 삭제했거나 초기화하지 않은 인덱스 속성에 대해서는 실행하지 않습니다. (예: 희소 배열) callback은 다음 세 인수와 함께 호출됩니다. 요소 값 요소 인덱스 순회 중인 배열 // arr.forEach(callback(currentvalue[, index[, array]])[, thisArg]); ['a', 'b', 'c'].forEach(x=>console.log(x)) // "a" // "b" // "c"채우기 Array.pr.. 더보기
JS Array.prototype.reduce() Array.prototype.reduce() reduce() 메서드는 배열의 각 요소에 대해 주어진 리듀서(reducer) 함수를 실행하고, 하나의 결과값을 반환합니다. 매개변수 callback 배열의 각 요소에 대해 실행할 함수. 다음 네 가지 인수를 받습니다. 누산기accumulator (acc) 누산기accmulator는 콜백의 반환값을 누적합니다. 콜백의 이전 반환값 또는, 콜백의 첫 번째 호출이면서 initialValue를 제공한 경우에는 initialValue의 값입니다. 현재 값 currentValue (cur) 현재 인덱스 currentIndex (idx) 처리할 현재 요소의 인덱스. initialValue를 제공한 경우 0, 아니면 1부터 시작합니다. 원본 배열 array (src) re.. 더보기
2진수 채우기 zerofill convert '1' to '0001' in JavaScript [duplicate] var str = '1234'; str = ('00000000'+str).substring(str.length); // 00001234 var str = '12345678'; str = ('00000000'+str).substring(str.length); // 12345678 더보기
Unserscore.js CDN http://underscorejs.org/ https://github.com/documentcloud/underscore-contrib http://documentcloud.github.io/underscore-contrib/ https://lodash.com/ https://cdnjs.com/libraries/underscore.js/ 더보기
Javascript 2015, ECMAScript6, ES6 프로리액트 React.js를 이용한 모던 프론트엔드 구축 ISBN 979-11-5839-042-6 부록B 자바스크립트 2015는 ECMAScript6 또는 ES6이라고도 하며, 자바스크립트 언어의 새로운 버전이다. ES6에는 클래스, 모듈, 새로운 변수 선언 키워드와 프로미스를 비롯해 복잡한 애플리케이션을 작성하기 위한 새로운 구문이 많이 추가됐다. 또한 화살표 함수, 템플릿 문자열, 분해와 같이 코드의 표현력을 높이기 위한 새로운 도우미와 편의 문법syntactic sugar기능도 추가 됐다. 클래스 모듈 let과 const 프로미스 화살표 함수 템플릿 문자열 구조분해 할당 클래스 Class 자바스크립트 클래스는 ES6에 추가됐으며 자바스크립트의 기존 프로토타입 기반 상속에 기반을 두는 편의 문법이다... 더보기
Range Text Select all DIV text with single mouse click MDN - Window.getSelection() MDN - Selection.collapse() MSDN - Using the TextRange Object Professional JavaScript for web Developers(Book) - How practical are ranges? Ecms-262.pdf - 6th Edition / June 2015 텍스트 선택 function selectText(containerid) { // MSIE if (document.selection) { var range = document.body.createTextRange(); range.moveToElementText(docu.. 더보기