ECMAScript 6 (ES 2015)에서 추가된 문법인 템플릿 문자열(template literal)은 문자열 사용을 더욱 편하게 해준다. 템플릿 리터럴은 일반 문자열과 비슷해 보이지만, ‘ 또는 “ 같은 통상적인 따옴표 문자 대신 백틱(backtick) 문자 ` 를 사용한다. const template = `템플릿 리터럴은 '작은따옴표(single quotes)'과 "큰따옴표(double quotes)"를 혼용할 수 있다.`; console.log(template); 일반적인 문자열에서 줄바꿈은 허용되지 않으며 공백(white-space)를 표현하기 위해서는 백슬래시(\)로 시작하는 이스케이프 시퀀스(Escape Sequence)를 사용하여야 한다. ES6 템플릿 리터럴은 일반적인 문자열과 달리 여..
[모던자바스크립트] 19.2 blob : Blob을 활용하면 자바스크립트로 이미지, 음성,영상 등의 이진 데이터를 다룰 수 있습니다. 또한 Blob을 상속받는 file 객체로 로컬 파일을 다룰 수 있게 됩니다. : Blob은 일련의 데이터를 처리하거나 간접 참조하는 객체다. "즉, 데이터 자체라기보다는 데이터를 간접적으로 접근하기 위한 객체인 것이다." 19.2.1 Blob : 데이터베이스 관리 시스템의 BLOB(Binary Large Object)에서 유래 됬습니다. : 이진 데이터를 저장하기 위한 데이터 타입으로 이미지나 음성 등의 멀티미디어 데이터를 저장한느 용도로 사용합니다. : 자바스크립트 Blob 객체는 데이터 덩어리를 참조하는 용도로 사용합니다. 큰 데이터는 물론 작은 데이터도 다룰 수 있습..
[모던자바스크립트] API활용 19.1 드래그 앤 드롭(DnD) API : HTML요소나 로컬 파일을 마우스로 끌어서옮길 수 있으며, 다른 요소에 드롭할 수도 있습니다. 이때 드래그한 요소 또는 파일의 데이터는 드롭 타깃 요소에 전달됩니다. 19.1.1 HTML 요소를 드래그할 수 있게 만들기 HTML 요소에 draggable 속성을 지정합니다. daraggable속성에는 논리값을 지정합니다. ture > drag , false > drag x 드래그할 수 있습니다. 이 속성을 지정하지 않거나 Auto로 지정하면 해당 HTML 요소의 기본값을 사용합니다. href 속성을 지정한 a 요소와 src속성을 지정한 img 요소는 기본적으로 드래그할 수있또록 만들어져 있습니다. 19.1.2 드래그 이벤트와 드롭 ..
[모던자바스크립트]15장 이벤트 처리 15.1 이벤트 처리기를 등록하는 방법 : 이벤트가 발생했을 때 실행되는 함수를 이벤트 처리기 또는 이벤트 리스너라고 합니다. 등록방법 1. HTML요소의 이벤트 처리기 속성에 설정하는 방법 : 1-1. 이벤트 처리기의 문제점 * HTML 문서를 읽어 들일 때 이벤트 처리기도 함께 설정하기 때문에 설정하기 쉽습니다. * HTML과 자바스크립트 프로그램이 뒤섞여 프로그램의 가독성이 떨어집니다. 결과적으로 프로그램의 유지 보수성이 떨어집니다. * 특정 요소의 특정 이벤트에 대해서 이벤트 처리기를 단 하나만 등록할 수 있습니다. 그 요소에 똑같은 이벤트 처리하는 이벤트 처리기를 등록하면 나중에 등록한 함수가 이전에 등록한 함수를 덮어씁니다. 일반적으로 HTML문서 하나는 ..