JavaScriptMVC 프로젝트의 Brian Moschel씨가  John Resig씨의 초기 단순 Class 상속을 확장하려는 그들의 최근 성과에 대해 알려주셨습니다.

예전에, John씨의 블로그에서 JavaScript 에서 클래스 상속을 흉내내려는 많은 결과물 중 장점만을 뽑아, 더 간단하고 사용하기 쉽게 작성한 자신의 결과물에 대해 말한 적이 있습니다. 그가 작성한 것의 문법은 이런 식으로 사용합니다:

[code:js]
var Person = Class.extend({
init: function(isDancing){
  this.dancing = isDancing;
},
dance: function(){
  return this.dancing;
}
});

var Ninja = Person.extend({
init: function(){
  this._super( false );
},
dance: function(){
  // Call the inherited version of dance()
  return this._super();
},
swingSword: function(){
  return true;
}
});

var p = new Person(true);
p.dance(); // => true

var n = new Ninja();
n.dance(); // => false
n.swingSword(); // => true

// Should all be true
p instanceof Person && p instanceof Class &&
n instanceof Ninja && n instanceof Person && n instanceof Class
JavaScriptMVC는 그의 결과물에 몇가지를 추가했습니다:
  • 클래스 수준 상속: 클래스 메소드 상속과 인스턴스 메소드처럼 수퍼 클래스의 메소드를 사용함으로써 기능의 재사용이 쉬움
  • 클래스 초기화 콜백: 클래스를 설정하고, 클래스를 초기화 하는동안 한번 호출되는 콜백함수를 가진 하위 클래스들을 계속 추적
  • Introspection: ActiveRecord와 비슷하게 클래스 이름에 기반하여 클래스들이 다른 행동을 하는 것이 가능
  • 인스턴스의 클래스와 수퍼클래스에 접근: 설령 클래스의 이름을 모를 때에도, 클래스 메소드와 객체에 직접 접근하는 코드를 작성할 수 있다.
이런 기능들은 조만간 JavaScriptMVC의 플러그인으로 가능해지겠지만, 현재는 독립적인 JavaScript로 사용할 수있습니다.

새로운 기능에 대한 예제는 이렇습니다:

[code:js]
Class.extend(‘monster’,
  // class methods
  {
    find: function(name){
      return this.creatures[name];
    },
    // called whenever Monster is subclassed
    extended: function(Class){
      this.types.push(Class.className);
    },
    types: [],
    creatures: {}
  },
  // prototype methods
  {
  // constructor
  init: function(name){
    this.name = name;
    this.life = 100;
    this.attack_stength = 20;
    this.Class.creatures[name] = this;
  },
  attack: function(creature){
    creature.life -= this.attack_stength;
  }
});
 
Monster.extend(’sea_monster’);
Monster.extend(‘dragon’,{
  find: function(name){
    var found = this._super(name);
    // Dragons’ spirits are raised when they feel wanted
    found.life+=10;
    return found;
  }
},{
  init: function(name){
    // call the inherited version of init()
    this._super(name);
    this.attack_stength = 50;
  },
  attack: function(creature){
    // dragons hurt themselves a bit when they attack
    this.life -= 5;
    // call the inherited version of attack
    this._super(creature);
  }
})
 
Monster.types; // => [’sea_monster’,'dragon’]
var h = new Monster(‘hydra’);
var a = new Dragon(‘albi’);
a.attack_stength; // 50
a.Class.className; // ‘dragon’
a.attack(h); // h.life = 50, a.life = 95
var d = Dragon.find(‘albi’); // returns albi instance, d.life = 105

from Enhanced Class Inheritance with JavaScriptMVC
Posted by 행복한고니 트랙백 0 : 댓글 1

댓글을 달아 주세요

  1. addr | edit/del | reply BlogIcon Gloridea 2008.06.27 21:22 신고

    오오... 멋진데요? : )
    문맥의 흐름이 굉장히 자연스러워서 좋네요 ㅎㅎ