From Learn About the Ext JavaScript Library

Ext 는 프레임워크에서 클래스 상속 구현을 위한 메커니즘인 Ext.extend (API reference) 라는 유용한 기능을 제공한다.

이것은 여러분들에게 클래스에 직접적으로 코드를 변경하는 것 없이 수정하거나, 어떠한 자바스크립트 클래스라도 기본적 기능성을 확장하는 능력이 주어진다.(또한 이것은 일반적으로 서브 클래싱하거나 기본 클래스로부터 상속할 때 참조 되어진다.)

이것은 Ext component 의 확장을 위해 자주 사용하였던 메소드이다.

이미 있는 클래스로부터 상속받아 새로운 클래스를 생성하기 위해서 첫번째로 새로운 클래스에 function를 통해 생성자를 선언하여야 하고 새로운 클래스의 공유되어진 속성을 정의하기 위해서 extend 메소드를 수행시켜야 한다. 공유된 속성들은 일반적으로 메소드들이지만 만약 데이터 항목이 인스턴스 사이에서 공유될지 모른다면(자바에서는 static 클래스 변수와 유사함) 그것은 거기(상속 받는 클래스)에서도 선언되었을지 모른다.

자바스크립트는 슈퍼클래스 생성자의 자동 호출(invocation)을 위한 메커니즘을 제공하지 않습니다. 그래서 여러분은 생성자가 사용하는 superclass 프로퍼티로부터 명확한 슈퍼 클래스를 호출해야만 합니다. 첫번째 아규먼트는 생성자가 호출한 함수의 스코프를 포함하여 실행하도록 보장하기 위해 항상 this됩니다.

MyNewClass = function(arg1, arg2, etc) {
   // 명확하게 호출한 슈퍼클래스 생성자
   MyNewClass.superclass.constructor.call(this, arg1, arg2, etc); 
};
 
Ext.extend(MyNewClass, SomeBaseClass, {
  theDocument: Ext.get(document),
  myNewFn1: function() {
    // etc.
  },
  myNewFn2: function() {
   // etc.
  }
});

다음은 리사이즈와 드래그할 수 있는 엘리먼트에 수직 수평에서 그 오브젝트가 얼마나 드래그 되어질 수 있는지 X,Y값의 설정에 의해 강요되어지기 위한 Ext에 실제 확장 예시입니다.

// 새로운 클래스를 위한 생성자 생성
Ext.ResizableConstrained = function(el, config){
    Ext.ResizableConstrained.superclass.constructor.call(this, el, config);
};
 
// base클래스 확장
Ext.extend(Ext.ResizableConstrained, Ext.Resizable, {
    setXConstraint : function(left, right){
        // 부모의 dd 프로퍼티와 setXConstraint 획득
        this.dd.setXConstraint(left, right);
    },
 
   setYConstraint : function(up, down){
     // 부모의 dd 프로퍼티와 setYConstraint 획득
     this.dd.setYConstraint(up, down);
   }
});
 
// 새로운 클래스의 인스턴스 생성
var myResizable = new Ext.ResizableConstrained('resize-el', {
   width: 200,
   height: 75,
   minWidth:100,
   minHeight:50, 
   maxHeight:150, 
   draggable:true
});
 
// 새로운 메소드 호출
myResizable.setYConstraint(0,300);
myResizable.setXConstraint(0,300);

영어의 경우, 여러분들은 코드들을 읽을 수 있습니다 : "Ext.ResizableConstrained는 Ext.Resizable를 확장한다 그리고 이 메소드를 구현한다."

Base 클래스 메소드 호출(Calling a base class method)

(오버라이드 한 경우 여러분이 만든 클래스에서는) 슈퍼 클래스의 같은 메소드를 호출하지만 여러분이 오버라이드를 위해 메소드가 필요하다면 아래와 같이 할 수 있다 :

MyClass = Ext.extend(Ext.SomeClass, {
    someFunction : function(arg1, arg2){
         // custom code
 
         // call base class
         MyClass.superclass.someFunction.call(this, arg1, arg2);
 
         // custom code
    }
);

구문이 수행되기 위해서 this를 잊지 마세요. 코드가 여러분의 오브젝트 콘텍스에서 동작하지 않을 수 있습니다.

Ext2에서 콤포넌트 확장(Extending Components in Ext 2)

이 페이지는 Ext 1.x 현재 스펙입니다. Ext 2.x 에서는 클래스의 생성자(대신에 initComponent가 오버라이드 됨)를 재 선언할 필요 없이 컴포넌트(Observables은 제외) 확장을 할 수 있습니다. 세부 내용들은 tutorial에 있고 그것들은 희망사항이지만 곧 wiki 못지 않는 엔트리가 완성될 것입니다.