자바스크립트/Ext JS2013. 5. 22. 00:57
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
Posted by 1 베니94

댓글을 달아 주세요