Personal tools

Log in / create account

Register

Views
Manual

Discussion

Edit

History

Manual:Ext Source Overview (Chinese)

From Learn About the Ext JavaScript Library

Jump to:
navigation ,
search

요약: Ext 소스 개요
Author: Patrick Donelan
Published: 2007년 9월 17일
Ext Version: any
Languages: Frank Cheung Chinese

Contents

[ English ]
hide
1 시작 가이드
2 소스 코드 표시
3 Ext 원본 발표 시 세부 사항
4 어디서부터 시작해야 하나요?
5 어댑터 어댑터
if (window.showTocToggle) { var tocShowText = "show"; var tocHideText = "hide"; showTocToggle(); }

시작 가이드

Ext의 신입 사용자는 다음과 같은 다른 경로를 통해 학습 자원을 얻을 수 있다. API 문서, 위키백과 전서, 날로 풍부해지는 강좌, 포럼, IRC 채널 등(참조6 코어. 이러한 각 방면에 대해서는 EXT 홈페이지에 있다.그러나 가장 중요한 사용 가능한 자원은 Ext 소스 코드 자체라고 할 수 있다.이렇게 편리하게 원본 코드(Ext의 프로젝트는 결국 원본을 개설한 것)를 배울 수 있어 Ext를 체험할 수 있을 뿐만 아니라 대량의 Javascript 고급 기교와 최선의 실천을 접하게 하여 자신의 인코딩 수준을 더욱 향상시킬 수 있다.

소스 코드 표시

Javascript는 해석형 언어로 실행되기 전에 코드가 컴파일되지 않았다는 것을 의미한다.이런 이론에 따르면 당신의 사이트에서 방송된 Ext 코드는 우리가 이해할 수 있는 것이다.내가 여기에서'이론적'이라고 말하는 것은 실제 상황에서 많은 원본 코드는 일부 자동화 절차의 처리를 거쳐 아주 작은 몇 줄의 파일을 생성하여 최종적으로 발표한 것이기 때문이다. 공백 기호와 주석을 제거하거나 혼동하는 방법을 통해 파일의 크기를 줄인다.
EXT 표준 원본 ext-core를 자세히 보십시오.js, 당신은 이것이 매우 긴 원본 코드라는 것을 발견할 수 있습니다.이것은 방금 언급한 자동화 단계의 결과입니다. - 브라우저에 좋습니다!하지만 우리에게는 읽기 어렵다.
ext-core.js

/*
 * Ext JS Library 1.1
 * Copyright(c) 2006-2007, Ext JS, LLC.
 * [email protected]
 * 
 * http://www.extjs.com/license
 */


Ext.DomHelper
=function
(
)
{
var
 _1=null
;var _2=/^(
?:br|frame...

Ext
.Template
=function
(
_1)
{
if
(
_1 instanceof
 Array)
{
_1...
...

이어서 보는 것은 ext-core-debug이다.js(파일 이름 뒤에 -debug를 추가한 JS 파일 주의), 포맷된 모든 원본 코드를 발견할 수 있습니다.이 파일은 타이머와 함께 사용되며, Learn 같은 도구는 코드를 한 걸음 한 걸음 디버깅할 수 있습니다.너도 파일의 부피가 거의 배가 넘는 것을 발견할 수 있을 것이다. 이것이 바로 압축이나 혼동이 없기 때문이다.
ext-core-debug.js

/*
 * Ext JS Library 1.1
 * Copyright(c) 2006-2007, Ext JS, LLC.
 * [email protected]
 * 
 * http://www.extjs.com/license
 */


Ext.DomHelper
 = function
(
)
{

var
 tempTableEl = null
;
var
 emptyTags = /^(
?:br|frame|hr|img|input|link|meta|range|spacer|wbr|area|param|col)
$/i
;
var
 tableRe = /^table|tbody|tr|td$/i
;
...

이 디버깅 버전은 디버깅 단계에서 EXT 라이브러리가 어느 단계까지 실행되는지 편리하게 검사할 수 있지만, 가치 있는...코드 설명!코드를 완전하게 보려면 진정한 원시 코드를 읽어야 한다!

Ext 원본을 게시할 때의 세부 사항

이 폴더에 포함된 소스 디렉터리가 있는 압축 문서 Firebug 에서 얻을 수 있습니다.이 폴더에는 예상대로 모든 EXT의 원본 파일이 포함되어 있습니다download.EXT 개발자에게는 매우 적합할 것이다.
일상적으로 텍스트 편집기를 사용하여 원본 코드의 임의의 파일을 열면 (강조 표시된 편집기를 추천하거나 여기Lesser GNU(LGPL) 개원 프로토콜에서 보기) 우리의 탐험을 시작할 수 있습니다!

어디서부터 시작해야 합니까?

Ext 코드 라이브러리에는 두려울 정도로 다양한 파일이 포함되어 있다.다행히도 Ext는 충분한 고려를 거쳐 설계된 JavaScript 라이브러리입니다. - 기본 코드는 브라우저에서 다양한 DOM 조작과 같은 다양한 응용 프로그램에 안정적인 기반을 제공합니다.상부의 클래스classes를 비교적 고급스러운 추상적인 차원에서 실행할 수 있도록 합니다(class라는 용어는 우리가 이미 익숙한 자바와 C++ 언어와 약간 다르지만, 일부 개념, 예를 들어 계승과 같은 개념은 이렇게 추측하여 이해합니다. - 대상을 대상으로 하는 자바스크립트에 대한 더 많은 자료는 참조하시기 바랍니다full-featured IDE.
이것은 원본 코드를 훑어볼 때'맨 위에서 아래로 (bottom-up)'를 사용하든'맨 아래에서 맨 위로 (top-down)'를 사용하든 상관없다는 것을 의미한다.당신이 익숙한 API 안의 코드는 이미 가장 높은 추상적인 차원의 범주에 속하기 때문에 당신의 흥미에 따라 당신이 익숙한 API를 따라 점차적으로 깊이 들어갈 수 있습니다.그러나 네가 내 견해에 찬성하고 그 원리를 깊이 이해하려 한다면 가장 이상적인 점은 밑바닥 코드부터 시작하는 것이다.

어댑터 어댑터

브라우저가 첫 번째 원본 파일을 읽는 작업 중 하나는 Ext 대상을 만드는 것입니다.Ext.js

Ext = {
}
;

Ext는 YahooUI의 Javascript 라이브러리 확장에 적용됩니다.당시 Ext는 브라우저 간 문제를 처리하기 위해 YUI의 기본 코드에 의존해야 했습니다.현재 ExtJS는 독립적이고 의존하지 않는 라이브러리 (standalone) 입니다. YUI를 프로토타입, jQuery, 또는 이 중 가장 좋은 선택인 Ext가 가지고 있는 베이스 라이브러리로 바꿀 수 있습니다.이 라이브러리(Ext 자체 라이브러리 포함)를 Ext 베이스 라이브러리로 비추는 이 코드를 어댑터(Adapters)라고 합니다.이 부분의 원본 코드는source/adapter의 하위 디렉터리에 있습니다.프로젝트가 Ext에 도입될 때 사용할 어댑터를 선택해야 합니다.

코어 코어

소스/core의 파일은 어댑터 API 위에 구축된 "상대적"맨 밑에 있는 원본입니다.일부 원본 코드는 심지어 독립 라이브러리의 코드를 직접 사용하기 위해 밑바닥까지 사용된다.이 라이브러리 전체를 먼저 이해하고 공부한 다음에 나머지 부분을 배워도 늦지 않다는 뜻이다.Ext의 각종'Magic'과 핵심 차원을 이해하려면source/core 디렉터리의 각 원본 코드에 중점을 두어야 한다.