<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title id="page-title">클래스 상속하기</title>
<script type="text/javascript" src="ext.js"></script>
<script type="text/javascript">
// 클래스 상속하기
Ext.define('man',{
// config 내부 프로퍼티는 this / set / get으로 접속 가능하다.
// 예) this.name / setName() / getName()
config : {
name : '' ,
area : ''
},
// method 선언
getMessage : function(){
alert( ' getMessage called ' ) ;
},
introduce : function(){
console.log( this.name + '님의 직업은 ' + this.job + "이고 레벨은 " + this.lv + " 입니다. " ) ;
},
// 생성자
constructor : function ( name , area ) {
// config 초기화
this.initConfig() ;
if( name ) {
this.setName( name ) ;
}
if( area ) {
this.setArea( area ) ;
}
alert( ' constructor called ' ) ;
}
}
, function(){ // call back 함수
console.log('man class is defined now !')
}
);
Ext.define('man.magician',{
extend : 'man' ,
config : {
job : '마법사'
, lv : 0
},
// 생성자
constructor : function ( name , area , lv ) {
this.initConfig() ;
if( lv ) {
this.setLv( lv ) ;
}
// 부모 생성자 호출하기
this.callParent( [name , area] )
},
function(){
console.log('magician class is defined now !')
}
});
// 클래스 생성하기
var name = "IT삽질"
var area = "타나왕국"
var lv = 90;
var magician = Ext.create('man.magician' , name , area , lv ) ;
// 결과 : IT삽질님의 직업은 마법사이고 레벨은 90 입니다.
magician.introduce()
</script>
</head>
<body>
</body>
</html>
'프로그래밍 > EXTJS4' 카테고리의 다른 글
| ExtJS4 - Custom Panel 만들기 ( 내가 원하는 Panel 만들기 ) (0) | 2019.12.06 |
|---|---|
| ExtJS4 - up , down / 자식 요소 , 부모 요소 찾기 (0) | 2019.12.06 |
| EXTJS4 - ID / 속성값 으로 검색하여 form 찾기 (0) | 2019.12.04 |
| EXTJS4 - 클래스 믹스인(mixins) (0) | 2019.12.01 |
| EXTJS4 - 클래스 선언하기 (0) | 2019.11.30 |
나무뚱이