본문 바로가기

Programming Practice/Javascript

closure 예제 및 자세한 설명은 아래 mozilla 페이지 참고.https://developer.mozilla.org/en/docs/Web/JavaScript/Closures 1. 개념1) closure?a function and the environment in which that function was created 2) when a function created?javascript 의 thread 가 function을 선언한 부분을 execute할때.** inner function 은 parent function 이 executed 될 때, created된다. parent function 이execute될 때마다 inner function은 created된다. 3) environment?local varia.. 더보기
prototype 1. 기본 구조 (출처 : The Secret of Javascript Ninja) 2. 참조 조정 생성자 함수의 property를 먼저 참조 -> prototype 의 property 참조 3. 생성자와 객체타입 객체의 constructor property 활용 1) 객체가 어떤 생성자함수로 만들어졌는지 확인 2) 특정 객체 생성한 생성자함수를 활용해 다른 객체 생성 function Journey() {}; var journey = new Journey(); console.log(journey.constructor); //function Journey() {}; console.log(journey instanceof Journey); //true console.log(typeof journey); //.. 더보기
함수 호출 4가지 방식이 있음. 1) 함수로 호출2) 메서드로 호출 3) 생성자로 호출 4) apply, call 로 호출함수에 암묵적으로 전달되는 매개변수 중 this 가 있음. this는 함수를 호출한 객체를 가리키며, 함수 context라고 함.함수 호출 방식에 따라 this 가 다름 1) 함수로 호출 호출 예 this function trip() {}; trip(); var tour = function(){};tour(); window (전역 context) 2) 메서드로 호출 호출 예 this var city = { trip : function () { return this;} } city.trip(); var city = {}; city.trip = function() {return this;} city.. 더보기
delegation 1. delegation 이란?특정 element 에서 event가 발생하면, 해당 event 는 모든 상위 element로 전달되며(bubbling phase), 각 element 에 등록된 모든 event handler 가 호출된다.이때 상위 element에서는 하위 element 들을 대표 (delegation)해서 event handler 를 등록할 수 있다. 예를 들어, 아래 구조에서 더보기
javascript convention 1. 생성자 함수 내 private 변수는 변수명 앞에 _ 를 붙인다.2. 생성자 함수 명은 대문자로 시작하는 명사이다.3. jQuery 객체를 참조로 가지는 변수는 앞에 $를 붙인다. 더보기
Function 1. function 특징 1) 1종 객체 아래 사항 가능 - 변수에 할당 - function의 parameter 로 설정 - function 의 return type 으로 설정 - literal 로 설정 - 동적 property 설정 2. function이 유효한 범위 예를 들어, function a 안에서 function b 가 선언됐다고 하자. function a() { function b() { } } function b가 참조될 수 있는 범위는 function a 전체 => function 이 선언되기 전 참조 가능 (hoisting mechanism) cf. 변수가 참조될 수 있는 범위 - 변수 선언 ~ 변수가 선언된 함수 끝 ** javascript의 유효범위는 block 단위가 아니라 fu.. 더보기
테스트 환경 구성 빠른 테스트를 위해 기존 방식에서 신규 방식으로 테스트 환경 구성을 변경한다. IDE Web Server library 구성 기존 eclipse Apache Tomcat Server 직접 구성 신규 Sublime Text http server (Node.js 의 npm를 통해 설치) bower (Node.js 의 npm를 통해 설치) 1. Sublime Text2 설치 http://www.sublimetext.com/2 에서 Download 해서 설치한다. Sublime Text3 는 현재 beta 버전이다. * http://www.hans.or.kr/2013/11/sublime-text3.html 를 참고해서 package-control을 설치한다. * Preferences - Package Contr.. 더보기
prototype 1. instance 생성과 prototype1) 객체 인스턴스ㄱ. 객체 청사진으로서의 prototype: 객체에서는 프로토타입 객체의 변수와 메서드를 사용할 수 있다.ㄴ. 생성자 함수의 프로퍼티가 프로토타입의 프로퍼티에 우선한다.ㄷ. 생성자 함수의 prototype 프로퍼티는 prototype 객체를 참조 → 실시간 update 가능 (다른 언어에서는 찾기 어려움)2) 상속과 prototype chain상속을 하려면 override가 가능해야 한다. SubClass.prototype = new SuperClass(); SubClass 의 prototype 객체를 SuperClass 객체로 설정한다는 의미. SubClass 는 SuperClass의 생성자 함수와 prototype에 지정된 property.. 더보기
즉시실행함수(Immediate function) 1. 기본1) 형식(function() {statement -1;statement -2;statement -3;})();2) 작동 원리 (3 step) 함수 인스턴스 생성 → 함수 실행 → 함수 폐기3) closure closure 내 외부 변수와 함수에 접근 가능 2. 사용1) 임시 유효 범위와 private 변수- 기본적으로 변수의 유효범위는 변수가 속한 closure- 즉시실행함수를 사용할 경우, 변수의 유효 범위를 블록이나 하위 블록 수준으로 지정 가능 더보기