sungwony

클로저(closure)의 활용(1) - 특정 함수에 사용자가 정의한 객체의 메서드 연결하기 다음과 같은 소스를 보자 function HelloFunc(func){ this.greeting = "hello"; } HelloFunc.prototype.call = function(func){ func ? func(this.greeting) : this.func(this.greeting) } var userFunc = function(greeting){ console.log(greeting); } var objHello = new HelloFunc(); objHello.func = userFunc; objHello.call(); 위의 소스코드에서 함수 HelloFunc는 greeting 변수가 있고, func ..

"이미 생명 주기가 끝난 외부 함수의 변수를 참조하는 함수를 클로저라고 한다" function outerFunc(){/*자유 변수*/var x = 1; return function(){/*x와 arguments를 활용한 로직*/}} var new_func = outerFunc();/* outerFunc 실행 컨텍스트 종료 */new_func(); *실행 컨텍스트 "실행 가능한 코드를 형상화하고 구분하는 추상적인 개념" "실행 가능한 자바스크립트 코드 블록이 실행되는 환경" "현재 실행되는 컨텍스트에서 이 컨텍스트와 관련 없는 실행 코드가 실행되면,새로운 컨텍스트가 생성되어 스택에 들어가고 제어권이 그 컨텍스트로 이동한다." 1. 실행 컨텍스트 생성 과정- 활성 객체 생성실행 컨텍스트가 생성되면 자바스크립..

"모든 자바스크립트 객체는 prototype을 갖는다. prototype 또한 객체이다. 모든 자바스크립트 객체는 그들의 프로토타입으로 부터 속성과 함수를 상속받는다." 자바스크립트의 모든 객체는 자신의 부모 역할을 하는 객체와 연결되어 있다. 이것은 마치 객체지향의 상속 개념과 같이 부모 객체의 프로퍼티를 마치 자신의 것처럼 쓸 수 있는 것 같은 특징이 있다. 자바스크립트에서는 이러한 부모 객체를 프로토타입 객체(짧게는 프로토타입)라고 부른다. *함수 객체와 프로토타입 객체의 관계 function myFunc(){ return true; }

var $Class = function(oClassMember){ function ClassOrigin(){ this.$init.apply(this, arguments); } ClassOrigin.prototype = oClassMember; ClassOrigin.prototype.constructor = ClassOrigin; return ClassOrigin; }; var Object = $Class({ $init : function(param1, param2, param3){ this._param1 = param1; this._param2 = param2; this._param3 = param3; }, func1 : function(){ /*객체의 함수를 정의한다.*/ } });

프로젝트 중, 특정 시간에 서버와 통신에서 표출을 갱신해줘야 할 필요가 있었습니다. 특정 시간에 화면을 갱신해줘야 하는 경우에는 어떤 함수를 활용해야 할까요? 정확하게 시간을 인자로 받아 실행시켜주는 함수는 없습니다. 하지만 활용할 수 있는 함수로 setTimeout() 이라는 함수가 있습니다. setTimeout은 콜백함수와 시간값(밀리세컨)을 인자로 받아서 해당 시간만큼 뒤에 콜백함수를 호출해주는 함수입니다. 조금더 정확한 함수 사용법은 API를 참조하시면 될 것 같습니다. (https://developer.mozilla.org/ko/docs/Web/API/WindowTimers/setTimeout) setTimeout(function(){alert("Hello");}, 5000); 첫번째 인자의 함..

언젠가 API 개발을 할 때가 있을 것 같아서 정리해둔다. 아래 예제는 'EditBox' 라는 객체 초기화시 div를 동적으로 생성해주고 이를 'SET' 혹은 'GET' 할 수 있는 함수를 프로토타입으로 제공해주었다. 객체를 통해 노드 객체를 'GET' 할 수도, 노드 객체를 다른 노드객체에 'SET' 할 수도 있다. var EditBox = function(option){ var that = this; var init = function(){ var div = document.createElement('div'); //객체의 동적 생성 that.editBox = div; } init(); } EditBox.prototype.setEditBox = function(container){ $(containe..