Actionscript 사용하기 : OOP 개념의 스크립트

위의 소스를 보면 달라진 부분이 있다. 기존에는 <mx:Model> 이라는 태그 내부에 XML 형태의 태그들로 데이터를 기록해 놓은 모양새가 있었다. 하지만 새롭게 바뀐 소스에는 외부의 xml 파일로 부터 정보를 가져오는 방식으로 변경이 되었다. 이와 관련해서 하나의 MXML 파일 내부에 Model 과 Controller 와 View 가 모두 존재하는 다소 관리하기가 어려운 상황을 제거하고 따로 나누었다.

또한 교재에 나오는대로 상품을 등록하고 장바구니에 담기위한 Data Transfer Object 의 개념으로 ActionScript를 통해서 클래스를 작성하였다.

- EComm.mxml 에 변경된 소스

	
			import valueObjects.ShoppingCartItem;
			import valueObjects.ShoppingCart;
			import valueObjects.Product;
			[Bindable]
			public var cart:ShoppingCart = new ShoppingCart();
			[Bindable]
			private var theProduct:Product;
			
			private function prodHandler(theItems:Object):void{
				theProduct = new Product(theItems.catID, theItems.prodName, theItems.unitID, theItems.cost,
											theItems.listPrice, theItems.description, theItems.isOrganic, 
											theItems.isLowFat, theItems.imageName);
				trace(theProduct.toString());
				trace(theItems.prodName);
				trace(theItems.cost);
			}
			
			private function addToCart(product:Product):void{
				cart.addItem(new ShoppingCartItem(product));
			}
	

- Product.as

package valueObjects
{
	[Bindable]
	public class Product
	{
		public var catId:Number;		
		public var prodName:String;
		public var unitID:Number;
		public var cost:Number;
		public var listPrice:Number;
		public var description:String;
		public var isOrganic:Boolean;
		public var isLowFat:Boolean;
		public var imageName:String;						
		
		public function Product(_catId:Number, _prodName:String, _unitID:Number, _cost:Number, _listPrice:Number,
		_description:String, _isOrganic:Boolean, _isLowFat:Boolean, _imageName:String){
			catId = _catId;
			prodName = _prodName;
			unitID = _unitID;
			cost = _cost;
			listPrice = _listPrice;
			description = _description;
			isOrganic = _isOrganic;
			isLowFat = _isLowFat;
			imageName = _imageName;			
		}
		public function toString():String{
			return "[Product]" + this.prodName;
		}
		
		public static function buildProduct(o:Object):Product{
			return new Product(o.catID, o.prodName, o.unitID, o.cost, o.listPrice, o.description, 
								o.isOrganic, o.isLowFat, o.imageName);
		}
	}
}

- ShoppingCart.as

package valueObjects
{
	public class ShoppingCart
	{
		public function ShoppingCart()
		{
		}
		public function addItem(item:ShoppingCartItem):void{
			trace(item.product);
		}
	}
}

-ShoppingCartItem.as

package valueObjects
{
	public class ShoppingCartItem
	{
		public var product:Product;
		public var quantity:uint;
		public var subtotal:Number;
		
		public function ShoppingCartItem(product:Product, quantity:uint = 1)
		{
			this.product = product;
			this.quantity = quantity;
			this.subtotal = this.product.listPrice * this.quantity; 
		}
		
		public function recalc():void{
			this.subtotal = product.listPrice * quantity;
		}
	}
}

위의 소스가 너저분하게 있지만 다 볼것없이 간추려서 이해한 만큼 설명하도록 하겠다. 소스 자체는 그리 어렵지 않다. Java와 Javascript 의 문법을 합쳐서 조금 선언 순서만 다를뿐 전체적인 모습은 어렵지 않았다. 위에서 말한 DTO 가 되는 클래스는 Product 클래스 이다. Object 로부터 각 특정 Element로 부터 값을 가져와서 생성자를 통해 객체를 생성하도록 되어있다. 위의 코드중에 buildProduct 라는 함수는 별로 필요 없거나 Product 클래스에 어울리지 않는다는 생각이 좀 든다.

ShoppingCart 클래스는 아직 미완성이긴 하나 메소드를 통해 추측하건데 쇼핑한 물건들을 담을수 있게 되어있는모양이다. 마지막으로 ShoppingCartItem 이라는 클래스는 쇼핑카트에 들어갈 물건과 수량, 합계금액들을 표현하기 위한 클래스이다. 역시 객체지향은 훌륭하다. (내가 이하기가 쉬우니까...)

ActionScript 자체가 객체지향 프로그래밍 언어인 Java 와 유사하니 흡사 자바로 된 소스에 뛰어난 성능과 UI를 자랑하는 Flash를 함께하는 느낌이다. 훌륭하기 짝이없다.. ^^

외부 파일로 부터 사용할 데이터들을 가져오는건 그리 어렵지 않다. mx:Model 태그에 source라는 Attribute로 파일의 경로만 지정해주면된다. 그리고 몇가지 코드들은 이벤트와 관련된 내용이므로 다음 글에서 설명하겠다.