본문 바로가기

전체 글187

handlebars 템플릿 Handlebars는 시맨틱한 템플릿을 효과적으로 구축하는데 필요한 기능을 제공합니다. 또한 템플릿을 JavaScript함수로 컴파일하기 때문에 대부분의 다른 템플릿 엔진보다 템플릿을 더 빠르게 실행할 수 있습니다. 실습 01(기본 예제) 실습을 위해 다음과 같이 html문서 안에 template코드를 만듭니다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 template using handlebar 게시자 : {{name}} {{content}} 좋아요 갯수 {{like}} {{comment}} Handlebars를 설치합니다. https://cdnjs.com/libraries/handlebars.js/ 로 접속 목록에 적당한 CDN 경로를 복사. html.. 2019. 8. 20.
객체 리터럴과 this 함수 호출 방식과 this 바인딩 자바스크립트의 경우 함수 호출 방식에 의해 this에 바인딩할 어떤 객체가 동적으로 결정됩니다. 즉, 함수를 선언할 때 this에 바인딩할 객체가 정적으로 결정되는 것이 아니고, 함수를 호출할 때 함수가 어떻게 호출되었는지에 따라 this에 바인딩할 객체가 동적으로 결정됩니다. 함수의 호출 방식은 아래와 같이 다양합니다. 함수 호출 메소드 호출 생성자 함수 호출 apply/call/bind 호출 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 var foo = function () { console.dir(this); }; // 1. 함수 호출 foo(); // window // window.foo(); // 2. 메소드 호출 .. 2019. 8. 19.
Ajax 1. Ajax(Asynchronous JavaScript and XML)란? 말 그대로 비동기적인 자바스크립트와 XML을 말하는 것입니다. 서버로부터 웹페이지가 반환되면 화면 전체를 갱신해야 하는데 페이지 일부만을 갱신하고도 동일한 효과를 볼 수 있도록 하는 것이 Ajax입니다. 우리가 흔히 접하는 포털사이트에서 어떤 한 목록을 클릭했을 때 화면 일부분만 바뀌는것이 바로 Ajax를 이용한 기술입니다. 페이지 전체를 로드하여 렌더링할 필요가 없고 갱신이 필요한 일부만 로드하여 갱신하기때문에 빠른 퍼포먼스와 부드러운 화면 표시효과를 기대할 수 있습니다. 2. JSON(JavaScript Object Notation) 클라이언트가 서버에게 요청을 보내면 서버에서 당연히 클라이언트가 요구하는 데이터를 반환해야합.. 2019. 8. 5.
자바스크립트 객체 객체 생성 자바스크립트에서 객체를 생성하는 방법은 Object() 생성자 함수를 이용하는 방법, 객체 리터럴 방식으로 생성하는 방법, 생성자 함수를 이용하는 방법 이렇게 3가지가 있습니다. 객체 리터럴 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 var emptyObject = {}; console.log(typeof emptyObject); // object var person = { name: "Lee", gender: "male", sayHello: function() { console.log("Hi! My name is " + this.name); } }; console.log(typeof person); // object console.log(person); // {na.. 2019. 8. 3.

티스토리툴바