자바스크립트로 클래스 상속을 흉내내는 더그라스 크록포드가 만든 세 함수

Function.prototype.method : 이 함수는 그저 생성자의 프로토타입에 함수를 붙인다. 이런 식으로 method 함수를 정의하면, 모든 생성자는 함수이므로 모두 'method'메서드를 갖게 된다.

Function.prototype.inherits : 이 함수는 간단한 단일 부모 상속을 지원한다. 이 함수에서 대부분의 코드는 어떤 객체 메서드 안에서든 this.uber('methodName')을 호출해 그 객체가 오버라이드한 부모 객체의 메서드를 호출할 수 있게 하려고 작성되었다. 오버라이드한 부모 객체의 메서드를 호출 할 수 있는 기능은 자바스크립트 상속모델에서 기본으로 지원하지 않는 기능이다.

Function.prototype.swiss : 이 함수는 .method() 함수의 고급버전으로 한 부모 객체에서 여러 메서드를 상속받는데 사용한다. 이 함수를 여러부모 객체에 대해 사용하면 다중 상속 시능을 사용하는 것과 마찬가지가 된다.

//프로토타입에 새 함수를 연결하는 간단한 헬퍼 Function.prototype.method = function(name,func){ this.prototype[name] = func; return this; } //다른 객체로부터 우아한 방식으로 함수를 상속받으면서 여전히 부모 객체의 함수를 //호출할 수 있게 해 주는 (약간 복잡한) 함수 Function.method('inherits', function(parent){ //상속 계층 안에서 얼마나 깊이 들어왔는지 추척한다. var depth = 0; //부모의 메서드를 상속 받는다. var proto = this.prototype = new parent(); //'uber'라는 privileged 함수를 만든다. //이 함수는 상속 과정에서 덮어쓴 함수를 실행할 수 있게 해 준다. this.method('uber', function(name){ var func; //실행할 함수 var ret; //함수의 반환값 var v = parent.prototype; //부모의 프로토타입 //이미 다른 'uber'함수 안이라면 if(depth){ //근원 프로토타입을 찾아 필요한 만큼 깊이 들어간다. for( var i = depth; i > o; i -= 1){ v = v.constructor.protptype; } //그리고 그 프로토타입에서 함수를 가져온다. func = v[name]; //아니면 'uber'를 처음 호출하는 상황이다. }else{ //실행할 함수를 프로토타입에서 가져온다. func = proto[name]; //함수가 이 프로토타입의 일부였다면 if(func == this[name]){ //대신 부모 프로토타입에 간다. func = v[name]; } } //상속 스택에서 얼마나 깊이 들어왔는지를 추척한다. depth += 1; //첫 번째 전달인자를 제외한 모든 전달인자를 넘기면서 함수를 호출한다. //(첫 번째 전달인자는 우리가 호출하려는 함수 이름을 담고 있다.) ret = func.apply(this, Array.prototype.slice.apply(arguments, [1])); //스택의 깊이를 변경한다. depth -= 1; //함수 호출의 결과값을 되돌려준다. return ret; }); return this; }); //parent 객체에서 new parent()를 사용해 모든 함수를 // 상속받지 않고, 오직 함수 몇개만을 상속받는 함수 Function.method('swiss', function(parent){ for(var i = 1; i < arguments.length; i+= 1){ //상속받을 메서드들을 모두 방문한다. var name = arguments[i]; //메서드를 이 객체의 프로토타입으로 가져온다. this.prototype[name] = parent.prototype[name]; } return this; });
크리에이티브 커먼즈 라이센스
Creative Commons License
이올린에 북마크하기(0) 이올린에 추천하기(0)

Posted by 홍반장

2011/03/31 14:29 2011/03/31 14:29
,
Response
No Trackback , No Comment
RSS :
http://tcbs17.cafe24.com/tc/rss/response/6021

# javascript library story

1. 모든 요소들을 읽어 들인다.

2. 모든 요소들을 관리할 수 있다.

3. 모바일 디바이스에 최적화한다(해상도 or 장비).

4. CSS로 관리되고, HTML로 표현한다.

5. 필요기능을 우선순위로 추가하고, 최신버전은 수시 배포한다.

크리에이티브 커먼즈 라이센스
Creative Commons License
이올린에 북마크하기(0) 이올린에 추천하기(0)

Posted by 홍반장

2011/03/28 10:47 2011/03/28 10:47
,
Response
No Trackback , No Comment
RSS :
http://tcbs17.cafe24.com/tc/rss/response/6001

closure-compiler - http://code.google.com/p/closure-compiler/
Compressor - http://javascriptcompressor.com/
크리에이티브 커먼즈 라이센스
Creative Commons License
이올린에 북마크하기(0) 이올린에 추천하기(0)

Posted by 홍반장

2011/03/18 14:05 2011/03/18 14:05
,
Response
No Trackback , No Comment
RSS :
http://tcbs17.cafe24.com/tc/rss/response/5957

JES 자바스크립트 라이브러리  http://code.google.com/p/jeslib/

소개

JES는 제주에 위치한 Daum 미디어오피스 에서 만들어진 자바스크립트 라이브러리입니다.

2007년 Daum의 Front-End개발에서 창안한 이래 Daum 미디어, 컨텐츠 서비스들에 사용되고 있으며 다수의 개발자들이 참여해왔습니다.

2010년 4월 공유, 개방, 참여의 정신에 따라 Daum은 JES를 Daum외의 분들도 사용할 수 있도록 오픈하기로 했습니다. 이제 JES는 여러분 모두의 것입니다. 마음대로 사용하시고, 수정하시고, 배포하셔도 됩니다. JES는 Daum의 공식 표준라이브러리는 아니며 앞으로 오픈소스 생태계에서 독자적으로 발전해나가길 기대합니다.

여러분의 많은 사용과 참여를 바랍니다.

사용방법

  1. 전체 js파일을 다운로드 하고
  2. 필요 확장함수를 jes.js 하단에 포함시켜서
  3. 원하는 웹 페이지에 jes.js 를 포함후 사용

특징

  • 웹서비스 개발에 필요한 자바스크립트 함수 라이브러리
  • 쉬운 코드와 잘 표현된 예제로 쉽게 사용 가능하고 크로스브라우징 처리의 원리를 쉽게 이해

사용 예제,방법

기타

크리에이티브 커먼즈 라이센스
Creative Commons License
이올린에 북마크하기(0) 이올린에 추천하기(0)

Posted by 홍반장

2011/03/17 15:58 2011/03/17 15:58
, , ,
Response
No Trackback , No Comment
RSS :
http://tcbs17.cafe24.com/tc/rss/response/5951

자바스크립트는 현재 점점 빨라지고 있고 또한 강력해지고 있다. 특히 각종 모바일 디바이스가 보급되면서 모바일 웹에 대한 관심이 커졌고, 이에 따라 자바스크립트 엔진의 성능 역시 발전하고 있다. 팜프리는 이미 모든 애플리케이션을 자바스크립트를 사용해 만들 수 있도록 했고, 아이폰 및 안드로이드에서도 여러 가지 프레임워크를 통해 네이티브 애플리케이션과 같은 UI 및 성능을 보이는 웹 애플리케이션 개발이 가능해졌다. 하지만 이는 모드 클라이언트 사이트에서의 자바스크립트, 쉽게 얘기해서 브라우저에서 동작하는 자바 스크립트를 말한다.

jQuery.js 등의 스크립트 라이브러리를 요즘 많이 사용하고 있는데, node.js 는 서버사이드에서 강력한 성능을 발휘할 수 있는 서버사이드 자바스크립트 라이브러리라고 할 수 있다. 우리는 node.js 를 통해서 자바스크립트의 미래를 짐작해 볼수 있을 것이다.

기존에는 서버사이드에서 스크립트를 돌려서 모든 연산을 수행하고 그 결과값으로 HTML을 만들어서 클라이언트에게 전송했다. 클라이언트는 HTML을 랜더링해서 사용자에게 보여주는 역활을 했고,  자바스크립트는 클라이언트측에서  자잘한 UI기능을 수행하며 감초역활을 했는데, 현재는 서버와 클라이언트의 역활이 상당히 많이 달라졌다.

과거 서버에서의 역활들이 클라이언트로 만히 이동을했다. jQuery등을 사용해서 UI플로우 및 여러 인터렉션과 각종 로직의 상당 부분을 클라이언트 사이드에서 처리한다. 그리고, 요즘 흔히 오픈API라고 불리는 API를 제공하여 서버의 데이터에 대한 접관과 처리를 클라이언트가 제오할수 있도록 했다.

node.js는 구글이 개발해서 현재 크롬 브라우저에 탑재되어 있는 자바스크립트 엔진인 V8을 기반으로 만들어진 서버사이트 스크립트 이다. 오히려 V8의 기능을 자바스크립트를 통해 사용 할수 있도록 만들어진 wrapper라고 말하는 것이 더 정확한 표현일 것이다.
node.js 는 V8이 내부적으로 특정 기능을 수행하는 과정에서 유저가 등록한 callback function 을 호출해 주도록 한다.

창시자 Ryan Dahl이 발표한 design goal을 정리하면,
- Function은 직접 I/O에 연결되지 않는다.
- 저수준(low-level)을 지향하며, 스트리밍으로 모든 것을 처리하되, 데이터 버퍼일을 강제하지 않는다.
- TCP, DNS, HTTP 등의 중요한 프로토콜에 대해 빌트인 된 형대로 지원된다.
- 다양한 HTTP 기능들을 지원한다.
- 클라이언트 사이트 자바스크립트 프로그래밍과 비슷하며, 동시에 과거의 유닉스 시스템 프로그래밍과도 친숙하다.
 
*  프레젠테이션 : http://www.scribd.com/doc/23801896/Node-js-JSConf-2009

사용자 삽입 이미지사용자 삽입 이미지

Home : http://www.nodejs.org/
API : http://www.nodejs.org/api.html




크리에이티브 커먼즈 라이센스
Creative Commons License
이올린에 북마크하기(0) 이올린에 추천하기(0)

Posted by 홍반장

2010/11/02 22:32 2010/11/02 22:32
, , ,
Response
No Trackback , No Comment
RSS :
http://tcbs17.cafe24.com/tc/rss/response/5611

//브라우져 체크
function broswerCheck(formName){

 // ms explorer 일 경우
 if(navigator.appName.indexOf("Microsoft") != -1){

  var str = Form.serialize(formName);
 
 }else{

  var str = document.forms[formName].serialize();
 
 }

 return str;
}

//--- navigator.appName.indexOf('Netscape')

크리에이티브 커먼즈 라이센스
Creative Commons License
이올린에 북마크하기(0) 이올린에 추천하기(0)

Posted by 홍반장

2010/08/03 11:36 2010/08/03 11:36
, ,
Response
No Trackback , No Comment
RSS :
http://tcbs17.cafe24.com/tc/rss/response/5409

자바스크립트 재입문

https://developer.mozilla.org/ko/A_re-introduction_to_JavaScript
크리에이티브 커먼즈 라이센스
Creative Commons License
이올린에 북마크하기(0) 이올린에 추천하기(0)

Posted by 홍반장

2010/07/21 22:41 2010/07/21 22:41
,
Response
No Trackback , No Comment
RSS :
http://tcbs17.cafe24.com/tc/rss/response/5380


블로그 이미지

- 홍반장

Archives

Recent Trackbacks

Calendar

«   2018/12   »
            1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31          
Statistics Graph

Site Stats

Total hits:
107358
Today:
2
Yesterday:
1