2017-12-08 37 views
0

저는 작은 자바 스크립트 라이브러리를 만드는 Ruby 프로그래머입니다.커피 스크립트 클래스 및 하위 클래스의 변수 덮어 쓰기

나는 큰 JavaScript 전문가가 아니기 때문에 커피 스크립트를 직접 돕고있어 다소 모르는 영역을 헤쳐 나갈 수 있습니다.

아이디어 :

나는 기능의 일부 작은 조각을 공유하는 모든있는 여러 개의 작은 자바 스크립트 위젯을 만들

.

공유 기능 및 구성은 Base 클래스에 있습니다. 모든 위젯에는 Base에서 상속받은 자체 클래스가 있으며 자체 구성을 설정할 수 있으며 심지어 Base의 구성을 덮어 쓸 수 있습니다.

마지막으로 위젯이 인스턴스화되면 위젯의 기본 옵션을 덮어 쓰는 옵션 해시가 전달 될 수 있습니다.

그것은 지금까지 다음과 같습니다

@Adg = {} 

class Adg.Base 
    config = 
    debugMessage: false 
    hiddenCssClass: 'visually-hidden' 

    # Constructor. Should not be overridden; use @init() instead. 
    # 
    # - Arg1: The DOM element on which the script should be applied (will be saved as @$el) 
    # - Arg2: An optional hash of options which will be merged into the global default config 
    constructor: (el, options = {}) -> 
    @config = config 

    @$el = $(el) 

    for key, val of options 
     @config[key] = val 

    @init() 

    # Dummy, must be overridden in inheriting classes. 
    init: -> 
    throw 'Classes extending App must implement method init()!' 

class Adg.Autocomplete extends Adg.Base 
    config = 
    suggestionsContainer: 'fieldset' 
    suggestionsContainerLabel: 'legend' 
    alertsContainerId: 'alerts' 

    init: -> 
    # Merge config into existing one 
    for key, val of config 
     @config[key] = val 

이 나에게 작동하지만 서투른 느낌 :

  • 내가 무시해서는 안 기본 constructor을 만들 필요가 있음을 좋아하지 않는다 클래스를 상속 받아 (메서드를 대체 요소로 추가)
  • 상속하는 각 클래스에서 수동으로 해당 구성을 병합해야합니다.

답변

1

나는 다음 당신이 찾고있는 무엇을 할 것인가 생각 :

  1. 사용하여 클래스 속성이 아닌 지역 변수/폐쇄 :

    @Adg = {} 
    
    class Adg.Base 
    
        @config = 
        debugMessage: false 
        hiddenCssClass: 'visually-hidden' 
    
        constructor: (el, options = {}) -> 
        @config = Object.assign {}, Adg.Base.config, options 
        @$el = $(el) 
    
    class Adg.Autocomplete extends Adg.Base 
    
        @config = 
        suggestionsContainer: 'fieldset' 
        suggestionsContainerLabel: 'legend' 
        alertsContainerId: 'alerts' 
    
        constructor: (el, options={}) -> 
        super(el, Object.assign({}, options, Adg.Autocomplete.config)) 
    

    는 내가 만든 몇 가지 변화가 있습니다. @config (Adg.Base)은 Adg.Base.config을 사용하여 읽습니다.

  2. super을 사용하여 자식의 부모 생성자를 호출합니다.
  3. Object.assign을 사용하여 해시를 병합합니다.

    @config = {Adg.Base.config..., config...}` 
    
    : 당신이 커피 스크립트 2 (제거 커피 스크립트와 다음의 패키지 @ 커피 스크립트를 설치)를 사용하는 경우, 대신 Object.assign의 확산 연산자를 사용할 수