Ext.onReady(function() {
/***
* 여기에서는 상속을 통해 클래스를 재활용하고 상속해준 클래스를 초기화 또는 override로 재정의한다.
*/
Ext.define('Cookbook.Vehicle', {
config : {
manufacturer : 'Unknown Manufacturer',
model : 'Unknown Model',
topSpeed : 0
},
constructor : function(manufacturer, model, topSpeed) {
// initialise our config object
this.initConfig(); // 초기화
console.log(manufacturer, model, topSpeed)
if (manufacturer) {
this.setManufacturer(manufacturer);
}
if (model) {
this.setModel(model);
}
if (topSpeed) {
this.setTopSpeed(topSpeed);
}
},
travel : function(distance) {
console.log('The ' + this.getManufacturer() + ' ' + this.getModel()
+ ' travelled ' + distance + ' miles at '
+ this.getTopSpeed() + 'mph');
}
}, function() {
console.log('Vehicle Class defined!');
});
// 생성사 클래스명과 필요한 인자를 같이 제공해 줄 수 있다.
var vehicle = Ext
.create('Cookbook.Vehicle', 'Aston Martin', 'Vanquish', 60);
vehicle.travel(100); // alerts �The Aston Martin Vanquish travelled 100 miles at 60mph
// Define the Cookbook.Plane class
Ext.define('Cookbook.Plane', {
extend : 'Cookbook.Vehicle',
config : {
maxAltitude : 0
},
constructor : function(manufacturer, model, topSpeed, maxAltitude) {
// initialise our config object
this.initConfig();
if (maxAltitude) {
this.setMaxAltitude(maxAltitude);
}
/***
* 상속 받은 클래스를 초기화 할 경우 아래와 같이
* 제공받은 인자로 초기화가 가능하다.
* 즉 현재 메소드가 생성자이고 생성자 내부에서 callparent했으므로
* 상속해준 클래스의 생성자가 호출되는 것이다.
*/
this.callParent([ manufacturer, model, topSpeed ]);
},
takeOff : function() {
console.log('The ' + this.getManufacturer() + ' ' + this.getModel()
+ ' is taking off.');
},
land : function() {
console.log('The ' + this.getManufacturer() + ' ' + this.getModel()
+ ' is landing.');
},
travel : function(distance) {
this.takeOff();
// execute the base class� generic travel method
console.log('current arg : ', arguments)
/***
* 하단에 주목하자 현재 실행되고 있는 함수는 travel이고 동일한 함수가 상속받은
* 클래스에도 존재하는데 상속된 클래스의 함수를 콜하기 위해 아래와 같이 한다.
*/
this.callParent(arguments);
//
console.log('The ' + this.getManufacturer() + ' ' + this.getModel()
+ ' flew at an altitude of ' + this.getMaxAltitude()
+ 'feet');
//
this.land();
}
}, function() {
console.log('Plane Class Defined!');
});
// create an instance of Cookbook.Plane class
var plane = Ext.create('Cookbook.Plane', 'Boeing', '747', 500, 30000);
plane.travel(800); // alerts 'The Boeing 747 is taking off'
});
// 출처 : Ext JS4 Web Application Development Cookbook