자바스크립트/Ext JS2013. 5. 22. 00:52
Ext.onReady(function() {
	/***
	 * config에 대한 설명이다.
	 * config에 표기된 변수는 자동으로 set, get, apply메소드가 생성되고
	 * 필요에 따라 override를 하여 사용한다.
	 */
	// Define new class 'Vehicle' under the 'Cookbook' namespace
	Ext.define('Cookbook.Vehicle', {

		// define our config object
		config : {
			Manufacturer : 'Aston Martin',
			Model : 'Vanquish'
		},

		constructor : function(config) {
			/***
			 * 초기화 한다. 필요할때..
			 */
			this.initConfig(config);

			return this;
		},

		// show details of Vehicle
		getDetails : function() {
			console.log('I am an ' + this.getManufacturer() + ' ' + this.getModel());
		},

		// update DOM elements with current Values
		applyManufacturer : function(manufacturer) {
			console.log('Called applyManufacturer:', manufacturer)
			
			// 아래와 같이 사용할 경우 무한루프가 발생한다.
			// 이는 setter메소드는 apply메소드를 수반하기때문에 
			// setter메소드를 쓰면 안되고 config에 직접 세팅해야한다.
//			this.setManufacturer(manufacturer);
			
			this.Manufacturer = ':[ ' + manufacturer + ']';
		},
		
		getManufacturer : function(){
			console.log('Called getManufacturer', this.Manufacturer)
			return this.Manufacturer;
		},
		
		setManufacturer : function(manufacturer) {
			console.log('Called setManufacturer', manufacturer)
			this.manufacturer = this.applyManufacturer(manufacturer) || manufacturer;
		},

		applyModel : function(model) {
			console.log('Called model:', model)
			Ext.get('model').update(model);

			return model;
		}
	}, 
	function() {
		console.log('Cookbook.Vehicle class defined!');
	});

	// create a new instance of Vehicle class
	var vehicle = Ext.create('Cookbook.Vehicle');
	console.log(vehicle.getManufacturer());
	vehicle.setManufacturer('Volkswagen');
	vehicle.setModel('Golf');
	console.log(vehicle.getManufacturer());
	vehicle.getDetails();

});
// 출처 : Ext JS4 Web Application Development Cookbook
Posted by 1 베니94

댓글을 달아 주세요