Backbone: बैकबोन और ES6 क्लासेस

हाँ यह निश्चित रूप से एक बमर है। लेगवर्क करने के लिए धन्यवाद।

मुझे लगता है कि कहानी का नैतिक बैकबोन के साथ ईएस 6 कक्षाओं का उपयोग नहीं करता है, कम से कम स्थिर संपत्ति समर्थन भूमि तक। आपके द्वारा प्रस्तावित फॉलबैक विकल्पों में से मेरा पसंदीदा समाधान स्ट्रिंग्स/ऑब्जेक्ट्स को रिटर्न वैल्यू के रूप में परिभाषित कर रहा है। बैकबोन के एपीआई डिज़ाइन का एक महत्वपूर्ण हिस्सा इन प्रोटोटाइप-साझा स्ट्रिंग्स और ऑब्जेक्ट्स में है, और यह एपीआई को गंदा कर देगा ताकि डेवलपर्स को प्रत्येक प्रॉपर्टी को कंस्ट्रक्टर में इंस्टेंस को असाइन करने की आवश्यकता हो (स्मृति बेकार होने का उल्लेख नहीं करने के लिए)।

संगति के अलावा, क्या बैकबोन के साथ extend से अधिक वर्ग कीवर्ड का उपयोग करने का कोई कारण है?

बढ़िया ब्लॉग पोस्ट। मुझे आश्चर्य हुआ कि ES6 और बैकबोन कक्षाएं एक साथ कैसे खेलेंगी। आपके लिए समाधान के रूप में:

1. सभी गुणों को कार्यों के रूप में संलग्न करें : मैं इसका अत्यधिक विरोध नहीं कर रहा हूं। यह ऑब्जेक्ट को सीधे प्रोटोटाइप पर सेट करने जितना साफ नहीं है, लेकिन मैंने प्रोटोटाइप ऑब्जेक्ट्स को म्यूट करने पर एक टन कोड ट्रिप अप देखा है। इस तरह से प्रतिरक्षा है, यही वजह है कि मुझे लगता है कि ES6 ने वर्ग गुणों को शामिल नहीं करना चुना है।
2. सभी गुणों को डिफ़ॉल्ट विकल्पों के रूप में पास करें : क्या यह नहीं है कि आप अधिक शास्त्रीय भाषा में कुछ कैसे करेंगे? मुझे ऐसा लगता है कि यह ऊपर से भी कम साफ समाधान है।
3. कंस्ट्रक्टर को दो बार चलाएँ : Ick।

मुझे लगता है कि कहानी का नैतिक बैकबोन के साथ ईएस 6 कक्षाओं का उपयोग नहीं करता है, कम से कम स्थिर संपत्ति समर्थन भूमि तक।

यहां तक ​​कि वर्ग गुण भी super() कॉल के बाद आते हैं। :निराश:

संगति के अलावा, क्या बैकबोन के साथ क्लास कीवर्ड का विस्तार करने का कोई कारण है?

मैंने इसे ब्लॉग पोस्ट में संबोधित किया। व्यावहारिक रूप से? नहीं। सिद्धांत रूप में यह लंबे समय में बैकबोन को कोड और अतिरिक्त अवधारणाओं को कम करने की अनुमति देगा, लेकिन वास्तविक रूप से यह कम से कम कुछ साल पहले होने वाला है जब ES6 कक्षाएं बिना ट्रांसपिलिंग के सभी प्रासंगिक ब्राउज़रों पर व्यापक रूप से समर्थित हैं, और कोड में कमी अगली होगी कुछ नहीं।

लेकिन निरंतरता पहलू को कम मत आंकिए। यदि यह जावास्क्रिप्ट में ऑब्जेक्ट ओरिएंटेड प्रोग्रामिंग करने का "तरीका" बन जाता है (ऐसा लगता है कि एम्बर/कोणीय/रिएक्ट/टाइपस्क्रिप्ट/ऑरेलिया आदि से इस पर मानकीकरण दिया गया है), बैकबोन इसका उपयोग नहीं करने के सापेक्ष पुस्तकालय के लिए एक अतिरिक्त सीखने की अवस्था होगी अन्य विकल्प। खासकर जूनियर डेवलपर्स के लिए। मुझे यकीन नहीं है कि जरूरी बदलाव के लायक है। लेकिन यह केवल पांडित्यपूर्ण "छोटे दिमागों के शौक" की निरंतरता के लिए नहीं है।

मैं @ akre54 और @jridgewell से सहमत हूं कि "सभी गुणों को कार्यों के रूप में संलग्न करें" दृष्टिकोण शायद प्रस्तावित विकल्पों में से सबसे अच्छा है। एफडब्ल्यूआईडब्ल्यू, मुझे याद है कि जब मैं मूल रूप से एक रिश्तेदार जेएस नवागंतुक के रूप में रीढ़ की हड्डी सीख रहा था, तो मैं इन "स्थैतिक" गुणों से थोड़ा उलझन में था और उनका उपयोग कैसे किया जाना चाहिए।

ES7 में सही वर्ग गुण होंगे, मुझे लगता है कि https://gist.github.com/jeffmo/054df782c05639da2adb

ES7 प्रस्ताव बस यही है, एक बहुत ही प्रारंभिक समुदाय संचालित प्रस्ताव। बिल्कुल स्पष्ट नहीं है कि यह वास्तव में कभी भी एक आधिकारिक युक्ति का हिस्सा होगा। कंस्ट्रक्टर के चलने के बाद वर्तमान कार्यान्वयन के कारण गुणों को उदाहरण में जोड़ा जाता है, इसलिए यह बैकबोन के साथ मदद नहीं करता है। (उपरोक्त jridgewell का लिंक देखें या Babel 5.0.0 के साथ स्वयं प्रयास करें)

@jridgewell मैं @benmccormick की पोस्ट के इस भाग की बात कर रहा था:

रिएक्ट डेवलपर्स ने प्रॉपर्टी इनिशियलाइज़र के साथ उन्हीं मुद्दों पर ध्यान दिया है जो बैकबोन उपयोगकर्ताओं का सामना करते हैं। रिएक्ट के संस्करण 0.13 के हिस्से के रूप में, वे कक्षाओं के लिए एक विशेष संपत्ति आरंभीकरण सिंटैक्स का समर्थन कर रहे हैं, जिसे अंततः मानकीकृत किया जा सकता है। इस ESDiscuss थ्रेड में

उदाहरण के लिए देखें वाईकैट्स का जेएस-डेकोरेटर्स स्ट्रॉमैन या मूल (स्थानांतरित) सद्भाव वर्ग प्रस्ताव ।

मैं सुझाव दे सकता हूं कि हम वर्ग गुणों के साथ गेटर्स का उपयोग करें:

class Row extends Backbone.View {
  get tagName() { return 'li'; }
}

एक पूर्ण अंतिम उपाय के रूप में, हम एक सहायक के साथ उदाहरण या स्थिर प्रोप की जांच कर सकते हैं a la _.result :

_.instOrStaticVar = function(instance, property) {
  if (instance == null) return void 0;
  var value = instance[property] || instance.constructor[property];
  return _.isFunction(value) ? value.call(instance) : value;
}

हाँ, लेकिन:

दुर्भाग्य से वह संस्करण वर्ग गुणों को परिभाषित करता है क्योंकि सुपरक्लास कन्स्ट्रक्टर चलाने के बाद तत्काल किया जा रहा है, इसलिए यह यहां बैकबोन के मुद्दों को हल नहीं करता है।

तो, ES5'd:

// ES6
class View extends Backbone.View {
  tagName = 'li';

  constructor() {
    // Do anything that doesn't touch `this`
    super();
    // Do anything that touches `this`
  }
}

// ES5
function View() {
  // Do anything that doesn't touch `this`
  Backbone.View.apply(this, arguments);

  // Add class properties
  this.tagName = 'li';

  // Do anything that touches `this`
}
View.prototype = _.create(Backbone.View.prototype, {
  constructor: View
});

इंस्टेंस वैरिएबल सेट करने के लिए बदलाव करने से पहले हमारा तत्व अभी भी बनाया जाएगा।

उदाहरण के लिए देखें वाईकैट्स का जेएस-डेकोरेटर्स स्ट्रॉमैन...

क्या आप समझा सकते हैं कि सज्जाकार कैसे लागू होंगे?

मैं सुझाव दे सकता हूं कि हम वर्ग गुणों के साथ गेटर्स का उपयोग करें:

:+1:. मैं देखता हूं कि एक ही नाव के रूप में सभी गुणों को कार्यों के रूप में

एक पूर्ण अंतिम उपाय के रूप में, हम एक सहायक के साथ उदाहरण या स्थिर प्रोप की जांच कर सकते हैं a la _.result:

यह दिलचस्प हो सकता है ...

तुम यह कर सकते थे:

class MyView extends Backbone.View {
  constructor() {
    super({ tagName: 'h1' });
    this.el.textContent = 'Hello World';
  }
}

@thejameskyle वह सुपरक्लास कंस्ट्रक्टर विकल्प के पास करता है। :अटक_बाहर_जीभ:

कक्षा को सेटअप करने के लिए super() पर निर्भर होने के बजाय, आपके पास बस init() फ़ंक्शन या कुछ और हो सकता है।

class DocumentRow extends Backbone.View {

    constructor() {
        super();
        this.tagName =  "li";
        this.className = "document-row";
        this.events = {
            "click .icon":          "open",
            "click .button.edit":   "openEditDialog",
            "click .button.delete": "destroy"
        };
        this.init();
    }

    initialize() {
        this.listenTo(this.model, "change", this.render);
    }

    render() {
        //...
    }
}

@milesj हम्म? यह अंतिम ES6 वर्ग कल्पना के साथ तुरंत त्रुटि देगा

व्युत्पन्न वर्ग में, आपको इसका उपयोग करने से पहले सुपर () को कॉल करना होगा

यहां तक ​​​​कि अगर यह काम करता है तो भी आप वास्तव में बैकबोन कन्स्ट्रक्टर को कॉल नहीं कर रहे हैं और इसका प्रारंभिक कोड नहीं मिलेगा।

मेरी पहली पोस्ट का यह लिंक देखें: http://www.2ality.com/2015/02/es6-classes- final.html

@milesj : बात यह है कि, आपको this.tagName या इसी तरह की सेटिंग करने से पहले super() पर कॉल करना होगा। और, चूंकि हम व्यू के कंस्ट्रक्टर में एक तत्व को this.tagName सेट करने से पहले ही एक तत्व बना चुके हैं।

जब आप सबक्लासिंग कर रहे हों तब भी

@jridgewell ओह क्षमा करें, मुझे वह याद आया। यह सबसे प्राकृतिक विकल्प की तरह लगता है। मैंने इस बारे में जेफ्मो और एसईबीएमके से बात की।

आप लोगों को कुछ बैकस्टोरी देने के लिए, तर्क यह है कि विस्तारित देशी प्रकारों (यानी ऐरे) का समर्थन करने के लिए this निर्धारित नहीं किया जाता है जब तक कि आप super() विधि को कॉल नहीं करते। अन्यथा आप डीओएम (और संभावित रूप से अन्य स्थानों) में प्रारंभिक समस्या में भाग लेते हैं।

@jridgewell @thejameskyle तो बस फोन सुपर () पहले (अद्यतन उदाहरण)। मुझे वास्तव में यहाँ समस्या दिखाई नहीं दे रही है क्योंकि मैंने अपनी ES6 कक्षाओं में वही काम किया है। बस व्यू कंस्ट्रक्टर लॉजिक को init() मेथड में ले जाएँ।

यह एक है बहुत बहुत से महंगा कोड दो बार चलाने के लिए।

@milesj क्या आपने मूल ब्लॉग पोस्ट पढ़ी? सुपर फर्स्ट चलाने का मतलब है कि गुण संसाधित नहीं होते हैं। पूरी गहराई से व्याख्या के लिए यहां देखें: http://benmccormick.org/2015/04/07/es6-classes-and-backbone-js/

हां, मैंने इसे पढ़ लिया है, और मैं अभी भी उत्सुक हूं कि यह समाधान क्यों नहीं है। हर कोई उन विचारों के बारे में बात करता रहता है जिन्हें कंस्ट्रक्टर को बुलाने की आवश्यकता होती है, लेकिन यह जरूरी नहीं कि ऐसा ही हो। निम्नलिखित की तरह कुछ समाधान क्यों नहीं है (यद्यपि थोड़ा सा योगदान दिया गया है)?

var View = Backbone.View = function(options) {
    this.cid = _.uniqueId('view');
    // extend()ing options is no longer needed if properties are set directly
};

View.prototype.setup = function() {
    this._ensureElement();
    this.initialize.call(this, arguments);
};

class DocumentRow extends Backbone.View {
    constructor() {
        super();
        this.tagName =  "li";
        this.className = "document-row";
        this.events = {
            "click .icon":          "open",
            "click .button.edit":   "openEditDialog",
            "click .button.delete": "destroy"
        };
        this.setup(...arguments);
    }
}

मैं गैर-ईएस 6 के साथ पश्चगामी संगतता के कारण अनुमान लगा रहा हूं?

तब डिफ़ॉल्ट View वर्ग काम नहीं करेगा क्योंकि निर्माता कभी भी #setup कॉल नहीं करता है। और, super() अलावा किसी सबक्लास कॉल को मजबूर करना बहुत कष्टप्रद होने वाला है।

यह एक ऐसा मुद्दा है जिससे सभी ES6 वर्गों को निपटना है, न कि केवल बैकबोन से। मैंने व्यक्तिगत रूप से इसे Babel ES7 वर्ग गुण युक्ति का उपयोग करके हल किया।

@milesj जैसा कि ES7 वर्ग के गुणों से पहले कहा गया है, इस मुद्दे को हल नहीं करते हैं क्योंकि वे कंस्ट्रक्टर के अंत तक तत्काल नहीं होते हैं।

मैंने ऐसा करने के बारे में jeffmo और sebmck से बात की:

class Root {
  rootProp = 'root';
  constructor() {
    console.log('Root', this.rootProp);
    console.log('Root', this.derivedProp);
  }
}

class Derived extends Root {
  derivedProp = 'derived';
  constructor() {
    super();
    console.log('Derived', this.rootProp);
    console.log('Derived', this.derivedProp);
  }
}

करने के लिए desugaring:

function Root() {
  this.rootProp = 'root';
  console.log('Root', this.rootProp);
  console.log('Root', this.derivedProp);
}

function Derived() {
  super();
  this.derivedProp = 'derived';
  console.log('Derived', this.rootProp);
  console.log('Derived', this.derivedProp);
}

लेकिन वह अभी भी यहाँ समस्या को ठीक नहीं करता है और असंगति की ओर ले जाता है:

new Derived();
// >> 'Root' 'root'
// >> 'Root' undefined
// >> 'Derived' 'root'
// >> 'Derived' 'derived'

यह एक ऐसा मुद्दा है जिससे सभी ES6 वर्गों को निपटना है, न कि केवल बैकबोन से।

हम्म?

मैंने व्यक्तिगत रूप से इसे Babel ES7 वर्ग गुण युक्ति का उपयोग करके हल किया।

आपके पास बहुत सारे DIV तत्व होंगे जिनमें कोई className s नहीं होगा। https://github.com/jashkenas/backbone/issues/3560#issuecomment -90739676, https://github.com/jashkenas/backbone/issues/3560#issuecomment -91601515 और https://github का अंतिम बिंदु देखें।

अच्छा ऐसा है। उस स्थिति में, मैं सुझाव दूंगा कि "सभी गुणों को सुपरक्लास कंस्ट्रक्टर के लिए डिफ़ॉल्ट विकल्प के रूप में पास करें" विकल्प, या "गुण" विधि (जो कंस्ट्रक्टर को स्पर्श नहीं करता है) बनाने के बारे में अंतिम पंक्ति के साथ जा रहा है।

class DocumentRow extends Backbone.View {
    loadProperties() {
        return {
            tagName: 'li',
            className: 'document-row',
            events: {
                "click .icon": "open",
                "click .button.edit": "openEditDialog",
                "click .button.delete": "destroy"
            },
            foo: 'bar'
        };
    }
}

// Contrived example
var View = Backbone.View = function(options) {
    this.cid = _.uniqueId('view');
    options || (options = {});
    _.extend(this, this.loadProperties(), _.pick(options, viewOptions));
    this._ensureElement();
    this.initialize.apply(this, arguments);
};

मैंने टूलकिट में भी कुछ ऐसा ही किया, जिसे यहां देखा जा सकता है: https://github.com/titon/toolkit/issues/107

नमस्ते।

अगर मैं यहां चर्चा को सही ढंग से समझता हूं - बैकबोन डेवलपर्स वर्कअराउंड और सर्वोत्तम अभ्यास पर चर्चा कर रहे हैं, लेकिन वास्तव में इस मुद्दे से निपटने के लिए बीबी कोर में बदलाव करने का कोई इरादा नहीं है? (मैं सुझाव नहीं दे रहा हूं कि उन्हें चाहिए, और न ही मुझे पता होगा कि वे परिवर्तन क्या हो सकते हैं)। दूसरे शब्दों में, क्या सभी गुणों को कार्यों के रूप में उपयोग करने या विषय पर अंतिम शब्द प्राप्त करने का सुझाव है? धन्यवाद।

@gotofritz हम वर्कअराउंड पर चर्चा कर रहे हैं क्योंकि ES6 के सभी गुणों को उदाहरणों पर जीने के लिए मजबूर करने का समाधान पैमाना नहीं है। बैकबोन का क्लास सिस्टम यहां सही काम कर रहा है।

ES7 कक्षाओं में स्थिर प्रोटोटाइप गुण जोड़ने के बारे में कुछ चर्चा है लेकिन अभी तक कुछ भी ठोस नहीं है। इस बीच मैं कहूंगा कि बैकबोन के extend साथ रहें।

धन्यवाद। मैं थोड़ी देर के लिए ES6 कक्षाओं की कोशिश करूँगा... :-)

इस पर ठोकर खाने वाले किसी और के लाभ के लिए, व्यवहार में मुझे "सुपरक्लास कंस्ट्रक्टर के लिए सभी गुणों को डिफ़ॉल्ट विकल्पों के रूप में पास करें" बेहतर लगता है - उदाहरण के लिए, हमारे ऐप में गतिशील (स्थानीयकृत) मार्ग हैं जिन्हें तत्काल समय पर पारित करने की आवश्यकता है, और एक मार्ग () विधि होने से काम नहीं चलता। जबकि निम्नलिखित करता है

class Router extends Backbone.Router {

 constructor (localizedRoutes) {
    _.defaults(localizedRoutes, {
        "nonLocalizedRouteA/": "routeA"
        "*actions": "defaultRoute"
     });
 super({ routes: localizedRoutes });
}

मैंने अभी इसे देखा है, और मुझे लगता है कि मॉडल के पास idAttribute संपत्ति के लिए दोनों कामकाज काम नहीं करते हैं। एक विधि काम नहीं करेगी क्योंकि बैकबोन संपत्ति तक पहुँचने के लिए model.idAttribute का उपयोग करता है; और मॉडल कंस्ट्रक्टर पूरी तरह से विकल्प के रूप में गुणों को जोड़ने का समर्थन नहीं करता है।

मुझे लगता है कि दोनों कामकाज idAttribute संपत्ति के लिए काम नहीं करते हैं

उत्कृष्ट पकड़, मैं इसे संबोधित करने वाले पीआर पर काम करूंगा। इस बीच, आप कस्टम idAttribute (और cidPrefix ) की आपूर्ति के लिए गेट्टर नोटेशन का उपयोग कर सकते हैं:

class Model extends Backbone.Model {
  get idAttribute() {
    return '_id';
  }

  get cidPrefix() {
    return '__c';
  }
}

एक विधि काम नहीं करेगी क्योंकि बैकबोन संपत्ति का उपयोग करने के लिए model.idAttribute का उपयोग करता है

get idAttribute() { return '_id'; } एक गेट्टर विधि है, जिसे सामान्य संपत्ति की तरह ही एक्सेस किया जाता है। this.idAttribute === '_id'; ।

ऐसा लगने लगा है कि एक बड़े पुनर्लेखन की आवश्यकता है। बैकबोन v2 शायद?

ऐसा लगने लगा है कि एक बड़े पुनर्लेखन की आवश्यकता है। बैकबोन v2 शायद?

बिल्कुल नहीं, हम पहले से ही ES6 उपवर्ग ( मॉडल के अपवाद के साथ) का समर्थन करते हैं। मुझे लगता है कि यह दिलचस्प होगा अगर किसी ने @ akre54 के स्थिर संपत्ति सुझाव की खोज की , लेकिन मूल पोस्ट में दो समाधानों के साथ भी यह आवश्यक नहीं है।

@jridgewell , त्वरित समाधान के लिए बहुत धन्यवाद!

इस धागे में सज्जाकारों का उल्लेख ऊपर किया गया था (विशेष रूप से येहुदा काट्ज़ का प्रस्ताव ), और यह अनसुलझा था कि क्या यह इस मुद्दे को हल करेगा।

मैं उनके साथ बस प्रस्तावित के रूप में खेल रहा था, और आप इस तरह एक सजावटी लिख सकते हैं:

function props(value) {
    return function decorator(target) {
        _.extend(target.prototype, value);
    }
}

और फिर हम जिस उदाहरण का उपयोग कर रहे हैं उसे इस तरह लिखा जा सकता है

@props({
      tagName: 'li',
      className: 'document-row',
      events: {
        "click .icon": "open",
        "click .button.edit": "openEditDialog",
        "click .button.delete": "destroy"
      }
    })
class DocumentRow extends Backbone.View {

    initialize() {
        this.listenTo(this.model, "change", this.render);
    }

    render() {
        //...
    }
}

ऐसा लगता है कि यह मेरे लिए ठीक काम करता है। क्लास कंस्ट्रक्टर के निष्पादित होने से पहले डेकोरेटर को क्लास में लागू किया जाता है। यह कहने का सिर्फ एक घोषणात्मक संस्करण है

class DocumentRow extends Backbone.View {

    initialize() {
        this.listenTo(this.model, "change", this.render);
    }

    render() {
        //...
    }
}
_.extend(DocumentRow.prototype, {
      tagName: 'li',
      className: 'document-row',
      events: {
        "click .icon": "open",
        "click .button.edit": "openEditDialog",
        "click .button.delete": "destroy"
      }
})

असल में, मैंने इसका परीक्षण नहीं किया है, लेकिन यदि आप स्थिर और प्रोटोटाइप प्रोप दोनों चाहते हैं तो आप शायद पूरी रीढ़ की हड्डी को सजावटी

दुर्भाग्य से यह अभी के लिए एक प्रस्ताव है, लेकिन बैबेल एक प्रयोगात्मक झंडे के पीछे इसका समर्थन करता है, इसलिए यदि लोग रोमांच महसूस कर रहे हैं, तो यह यहां एक संभावित समाधान है।

@benmccormick , डेकोरेटर तकनीक मेरे लिए अच्छा काम करती है। इसके अलावा अभी के लिए एक प्रस्ताव होने के अलावा, क्या इस दृष्टिकोण के साथ जाने के बारे में अन्य चिंताएं हैं?

@andrewrota मैं सचमुच इस सामग्री पर अभी एक ब्लॉग पोस्ट लिख रहा हूं (जब आपने टिप्पणी की थी तो इस धागे के माध्यम से पढ़ रहा था)। यह एक बड़ा "इसके अलावा" है, लेकिन मुझे व्यक्तिगत रूप से कोई भी दिखाई नहीं देता है। मुझे वास्तव में लगता है कि हम ऊपर वर्णित की तुलना में बेहतर कर सकते हैं, और डेकोरेटर्स के साथ बैकबोन के लिए कुछ अच्छे नए इंटरफेस बना सकते हैं।

@StevenLangbroek का यह सार देखें जिसने मुझे मूल रूप से इस बारे में सोचने पर https://gist.github.com/StevenLangbroek/6bd28d8201839434b843

मेरे द्वारा डाली जा रही अनुवर्ती पोस्ट का पूर्वावलोकन यहां दिया गया है: http://benmccormick.org/2015/07/06/backbone-and-es6-classes-revisited/ अब स्थायी लिंक के साथ अपडेट किया गया

यह इस सप्ताह की शुरुआत में किसी समय स्थायी url में चला जाएगा। लेकिन इस सूत्र का मूल सारांश और जो मैंने सीखा है वह है:

बैकबोन प्रॉपर्टीज को मौजूदा ES6 क्लास स्पेक के साथ काम करने के लिए 3 दृष्टिकोण हैं (पहले 2 को # 3684 को पूरी तरह से समर्थित माना जाना चाहिए):

1. कंस्ट्रक्टर में सभी गुणों को सुपर में पास करें
2. सभी गुणों को विधियों के रूप में मानें
3. एक वर्ग घोषित होने के बाद सीधे प्रोटोटाइप में गुण जोड़ें

मैं अभी भी इन सभी को किसी न किसी हद तक अभिव्यक्ति को सीमित करने के रूप में देखता हूं। लेकिन मुझे लगता है कि अगर डेकोरेटर आधिकारिक विनिर्देश बन जाते हैं तो समस्या कमोबेश हल हो जाएगी। सज्जाकारों के साथ 2 और विकल्प हैं।

1. एक प्रॉप्स डेकोरेटर जोड़ें जो प्रॉप्स को क्लास के शीर्ष पर ले जाए और उन्हें प्रोटोटाइप में जोड़ दे
2. कई विशेष उद्देश्य सज्जाकार बनाएं जो एक अधिक अभिव्यंजक/सुक्ष्म इंटरफ़ेस की अनुमति देते हैं।

मुझे नहीं लगता कि इनमें से किसी भी समाधान के लिए #3684 के अलावा बैकबोन में किसी अतिरिक्त संशोधन की आवश्यकता है, लेकिन बैकबोन-डेकोरेटर लाइब्रेरी के लिए एक दिलचस्प भूमिका होगी यदि/जब डेकोरेटर मानकीकृत हो जाते हैं।

पोस्ट पर सोमवार/मंगलवार को प्रकाशित करने से पहले मुझे कोई प्रतिक्रिया पसंद आएगी।

@benmccormick मुझे लगा कि किसी भी निर्माण के होने से पहले सज्जाकारों का मूल्यांकन किया जाता है, सुधार के लिए धन्यवाद। मैं सार को थोड़ा सा अपडेट करूंगा। यह भी: ब्लॉग पोस्ट में उल्लेख के लिए एक लाख धन्यवाद :) जब आप इसे प्रकाशित करते हैं तो मुझे ट्विटर पर पिंग करते हैं? :+1:

हम मैरियनेट में modelEvents और collectionEvents लिए समान सिंटैक्स का उपयोग कर सकते हैं, ट्रिगर्स के लिए नहीं। उन्हें क्लास डेकोरेटर (जैसे आपके ब्लॉग पोस्ट में टैगनाम और टेम्प्लेट) के माध्यम से उजागर किया जा सकता है, लेकिन मैं सोच रहा था: क्या हम इसके लिए स्थिर गुणों का उपयोग नहीं कर सकते? या वह बैकबोन में काम नहीं करता है?

मैं समझता हूं कि डेकोरेटर अभी भी स्टेज 0 हैं, लेकिन मुझे लगता है कि वे बैकबोन ऐप लिखने के तरीके में एक बेहतरीन अपग्रेड होंगे, विशेष रूप से एक इवेंट हैश पर मेथड डेकोरेटर, यह प्रोग्रामिंग स्टाइल की तरह है जो मुझे ग्रंट पर भी गल्प पसंद करता है।

@StevenLangbroek स्थिर गुणों के बारे में चर्चा के लिए ऊपर देखें।

वर्तमान में निर्दिष्ट सिंटैक्स प्रोटोटाइप में जोड़ने के बजाय प्रत्येक उदाहरण पर एक स्थानीय संपत्ति बनाता है। सुपर कंस्ट्रक्टर चलाने के बाद उन गुणों को जोड़ा जाता है।

@benmccormick , पोस्ट अच्छी लग रही है और मुझे लगता है कि प्रत्येक विकल्प के साथ ट्रेड ऑफ को समझाने में अच्छा काम करता है। इस बिंदु पर, मुझे वास्तव में विशेष प्रयोजन सज्जाकार दृष्टिकोण पसंद है, और यह सबसे अच्छा तरीका लगता है कि सज्जाकार इसे कल्पना में बनाते हैं।

क्या @benmccormick के डेकोरेटर को कंस्ट्रक्टर के साथ _#extend कॉल करना चाहिए जो प्रोटोटाइप नहीं है और फिर @akre54 की _.instOrStaticVar विधि का उपयोग _#result स्थान पर किया जाता है? मुझे एहसास है कि यह एक तोड़ने वाला बदलाव होगा, लेकिन ऐसा लगता है कि आईएमएचओ इस तरह साफ है। जैसे @ akre54 ने बताया कि गुणों को परिभाषित किया गया है कि प्रोटोटाइप-साझा स्ट्रिंग्स और ऑब्जेक्ट्स (यानी सभी उदाहरणों में साझा किए गए हैं) इसलिए उन्हें कक्षा के माध्यम से एक्सेस किया जाना चाहिए, है ना?

मैं आगे जा रहा हूं और जिस तरह से हमें जरूरत है, उस तरह से काम करने के लिए वर्ग गुण बना रहा हूं। वर्ग गुणों को भी एनोटेट किया जा सकता है, और हम विशेष डेकोरेटर बना सकते हैं, जो सजाए गए संपत्ति को प्रोटोटाइप से जोड़ता है।

class TodoView extends Backbone.View {
  <strong i="6">@protoprop</strong>
  static tagName = 'li';
}

function protoprop(target, name, descriptor) {
  target.prototype[name] = descriptor.initializer()
}

उदाहरण के साथ बेबेल आरईपीएल देखें। यह प्रायोगिक चीजों पर निर्भर है, लेकिन काम करता है।

@ जस्ट-बोरिस जैसा कि मेरे ब्लॉग टिप्पणियों में चर्चा की गई है, आप जो व्यवहार देख रहे हैं वह क्लास प्रॉपर्टीज और डेकोरेटर स्पेक्स के बैबेल के संचालन का एक कार्यान्वयन विवरण है। अभी किसी भी प्रस्ताव में इसका परिभाषित व्यवहार नहीं है। यदि आप चीजों को इस तरह से करना चाहते हैं तो आप कक्षा गुणों पर सजावटी बनाने के लिए यहां और/या यहां समस्याएं बनाना चाहते हैं एक मानकीकृत व्यवहार। अन्यथा आप जो कर रहे हैं वह किसी भी समय टूट सकता है (और शायद होगा)।

@benmccormick wycats/जावास्क्रिप्ट-सजावटी के पास पहले से ही संपत्ति प्रारंभकर्ताओं के संबंध में

वहां मुख्य चिंता यह है कि संपत्ति प्रारंभकर्ता एक सामान्य वर्णनकर्ता के साथ-साथ कक्षा के तरीके भी हैं, इसलिए सजावटी उन्हें भी लपेट सकते हैं। मुझे चिंता करने का कोई कारण नहीं दिखता, जबकि उस खंड में विशिष्टता अपरिवर्तित रहती है

आह बहुत बढ़िया, मैंने वह नहीं देखा था। यह बात बताने के लिए धन्यवाद।

सोम, 21 सितंबर, 2015 को पूर्वाह्न 11:29 बजे, बोरिस सर्डियुक नोटिफिकेशन @github.com
लिखा था:

@benmccormick https://github.com/benmccormick
https://github.com/wycats/javascript-decorators के पास पहले से ही अतिरिक्त है
संपत्ति प्रारंभकर्ताओं के संबंध में परिभाषा
https://github.com/wycats/javascript-decorators/blob/master/INITIALIZER_INTEROP.md
.

वहां मुख्य चिंता यह है कि संपत्ति प्रारंभकर्ता एक सामान्य वर्णनकर्ता है,
साथ ही कक्षा के तरीके, ताकि सज्जाकार उन्हें भी लपेट सकें। मैं नहीं देखता
चिंता के कारण, जबकि उस खंड में विशिष्टता अपरिवर्तित रहती है

-
इस ईमेल का सीधे उत्तर दें या इसे GitHub पर देखें
https://github.com/jashkenas/backbone/issues/3560#issuecomment -142015454
.

बस https://github.com/typhonjs/backbone-es6 बनाम @benmccormick द्वारा सुझाई गई विधि तकनीक का उपयोग करने के पेशेवरों/विपक्षों को जानना चाहता था।

बीटीडब्ल्यू , उत्कृष्ट ब्लॉग पोस्ट के लिए धन्यवाद

प्रस्ताव (#121) पुल-अनुरोध के अलावा यहां properties कार्रवाई में संलग्न विधि https://github.com/dsheiko/backbone-abstract/tree/master/demo-es6/src/Js
जैसा कि @ akre54 ने उल्लेख किया है, जस्टिन ने पहले से ही एक समान समाधान ( preInitialize विधि) का प्रस्ताव दिया है। मेरी शाखा में पहले से ही इसका उपयोग करते हुए, यह वास्तव में मेरे लिए समस्या का समाधान करता है। टाइपस्क्रिप्ट में भी उपयोगी होने के बावजूद वे घोषणात्मक वर्ग गुणों पर प्रतिबंध नहीं लगाते हैं।

PS preInitialize अधिक सामान्य लगता है और इसलिए इस संदर्भ में बेहतर है। यद्यपि, यह preConstruct अधिक पसंद करता है यदि हम सभी कंस्ट्रक्टर की नौकरियों से पहले विधि को कॉल करते हैं

वास्तव में हम चाहते हैं कि हम एक नया वर्ग गुण प्रस्ताव देखें जो उन्हें प्रोटोटाइप पर सेट करता है। ऐसा लगता है कि प्रस्ताव से जुड़े कई लोग निहितार्थों के बारे में चिंतित हैं, लेकिन मुझे यह अविश्वसनीय रूप से असंगत लगता है कि क्लास के तरीके सीधे प्रोटोटाइप से जुड़ जाते हैं, जबकि जेफमो का प्रस्ताव उन्हें कंस्ट्रक्टर में डाल देता है।

यदि वे गुणों को सीधे प्रोटोटाइप में संलग्न करने के साथ गए थे तो आप किसी भी प्रतिक्रिया/बैकबोन कोड को ES2015 कक्षाओं में स्थानांतरित करने में सक्षम होंगे।

बहुत बढ़िया ब्लॉग पोस्ट @benmccormick !! मेरी परियोजना में उन सज्जाकारों का उपयोग करने जा रहा है

@benmccormick , मैंने डिफ़ॉल्ट गुणों के साथ कक्षाओं को घोषित करने के लिए एक और तरीका https://github.com/epicmiller/es2015-default-class-properties

यह किसी भी ऐसे वातावरण में सामान्य रूप से चलता है जो मूल रूप से कक्षाओं का समर्थन करता है, अच्छी तरह से पारदर्शी होता है, और _far_ उन्हें कंस्ट्रक्टर में या घोषणा के बाद परिभाषित करने की तुलना में अच्छा लगता है। डेकोरेटर्स और क्लास प्रॉपर्टीज के प्रस्तावों के साथ ES2016/ES2017 के लिए पाइपलाइन में आने के साथ यह बैकबोन के लिए दीर्घकालिक समाधान की तुलना में एक अकादमिक अभ्यास से अधिक हो सकता है, लेकिन ऐसा कुछ निश्चित रूप से एक व्यवहार्य विकल्प है यदि 2-3 साल बहुत लंबा है रुको।

खैर, बात यह है कि एक्मास्क्रिप्ट प्रस्ताव स्टेज सिस्टम में क्लास प्रॉपर्टीज अभी भी स्टेज 1 पर है। मुझे पता नहीं क्यों, क्योंकि यह "उपयोगकर्ता को क्या मिलता है" के संदर्भ में एक उपहार जैसा लगता है। बेशक, मुझे नहीं पता कि यह वाक्य-रचना और संदर्भ कार्यान्वयन के संदर्भ में हुड के नीचे किस तरह की चीजें तोड़ सकता है।

https://github.com/tc39/ecma262
https://github.com/jeffmo/es-class-fields-and-static-properties

इसके माध्यम से पढ़ने पर मुझे https://github.com/epicmiller/es2015-default-class-properties एक अच्छा दृष्टिकोण मिलता है। कोशिश करते समय मैंने महसूस किया कि बैकबोन के पास इसके लिए बिल्ट-इन सपोर्ट है। उदाहरण के लिए:

class MyModel extends Backbone.Model.extend({
   idAttribute: 'id'
}) {
   // ...
};

उपरोक्त कोड MyModel.prototype.idAttribute को ठीक से सेट करेगा। ध्यान दें, टाइपस्क्रिप्ट के लिए डिक्लेरेशन फाइल को कंस्ट्रक्टर फ़ंक्शन इंटरफ़ेस को वापस करने के लिए थोड़ा समायोजित करने की आवश्यकता होती है, लेकिन यह ES6 उपयोगकर्ताओं के लिए अप्रासंगिक है ...

@ टी-बेकमैन यह एक बहुत अच्छा समाधान है - पठनीय दिखता है और इसमें न्यूनतम बदलाव की आवश्यकता होती है। धन्यवाद!

मुझे एहसास है कि यह धागा अब 2 साल से चल रहा है, लेकिन बैकबोन और ईएस 6 कक्षाओं की खोज करते समय यह अभी भी शीर्ष (और केवल) परिणामों में से एक है, और मैंने सोचा कि मैं यहां कई बार उल्लिखित वर्ग गुणों का उपयोग करने का संभावित समाधान साझा करूंगा .

अब जबकि वर्ग गुण चरण 2 में हैं और बेबेल प्रीसेट के साथ व्यापक रूप से उपलब्ध हैं, मैंने सोचा कि मैं इसे एक और रूप दूंगा। जैसा कि कहा गया है, उदाहरण/सदस्य गुणों के साथ मुद्दा यह है कि वे _after_ constructor() तक प्रोटोटाइप पर लागू नहीं होते हैं, लेकिन सेट करने के लिए आवश्यक कई गुण कंस्ट्रक्टर के भीतर उपयोग किए जाते हैं। स्थैतिक गुण तुरंत लागू होते हैं, लेकिन (डिज़ाइन द्वारा) कक्षा के उदाहरणों में कॉपी नहीं किए जाते हैं।

निम्नलिखित शिम कंस्ट्रक्टर को चलाने से पहले कंस्ट्रक्टर से स्थिर गुणों की प्रतिलिपि बनाता है (प्रभावी रूप से एक नया कंस्ट्रक्टर बनाता है, गुणों को लागू करता है, और फिर मूल कंस्ट्रक्टर को निष्पादित करता है)। हालांकि यह निश्चित रूप से एक हैक है, मैं परिणाम से बहुत खुश हूं:

शिम:

export default function StaticShim(Ctor) {
    const NewCtor = function shim(...args) {
       Object.keys(Ctor).forEach((key) => {
            if (this[key] === undefined) {
                this[key] = toApply[key];
            }
        });

        Object.assign(this, this.constructor);

        Ctor.apply(this, args);
    };

    NewCtor.prototype = Object.create(Ctor.prototype);
    NewCtor.prototype.constructor = NewCtor;

    Object.keys(Ctor).forEach((key) => {
        if (NewCtor[key] === undefined) {
            NewCtor[key] = Ctor[key];
        }
    });

    return NewCtor;
}

और फिर उपयोग में:

class TestModel extends StaticShim(Backbone.Model) {
    static idAttribute = '_id';
    static urlRoot = '/posts';

    initialize() {
        console.log(this.url()); // Correctly logs "/posts/{id}"
    }
}

अगर यह किसी और की मदद करता है, या किसी के पास इसके बारे में कोई विचार है तो बस इसे यहां छोड़ना चाहता था। धन्यवाद!

एक पुराने मुद्दे को पुनर्जीवित करने के लिए अनिवार्य खेद है।

क्या बैकबोन का उपयोग करने के लिए एक ES6 वर्ग घोषणा को रूपांतरित करने वाला एक बैबल प्लगइन लिखना संभव होगा या इसके लायक होगा।*.extend({...})?

@enzious निश्चित रूप से संभव लगता है। क्या यह इसके लायक है यह आप पर निर्भर है :)

@ टी-बेकमैन का समाधान सबसे सीधा लगता है। क्या हमें इसे रीढ़ की हड्डी में ही एकीकृत करना चाहिए?

मेरे लिए यह ठीक से नहीं दिखता है, क्या idAttribute सेट करने वाली विधि के लिए यह अधिक उचित नहीं होगा?

इसके अतिरिक्त, यदि Promise समर्थन है तो यह आश्चर्यजनक होगा। जो jQuery Deferred का उपयोग करने से अधिक मूल दृष्टिकोण है, जिसे मैं व्यक्तिगत रूप से बैकबोन के भीतर बहिष्कृत देखना पसंद करूंगा।

आधुनिक टूलिंग और भाषा सुविधाओं का उपयोग करने के लिए विरासत बैकबोन अनुप्रयोगों को ताज़ा करने के लिए यहां कहानी अभी भी बहुत अस्पष्ट है। यह विशेष रूप से निराशाजनक है कि Symbol.iterator जैसी चीजों को लागू किया गया और उत्पादन रिलीज में उपलब्ध नहीं है।

उन लोगों के लिए जो अभी भी इस प्रश्न के स्पष्ट उत्तर की तलाश में हैं, मैं टाइपस्क्रिप्ट को एक बैकबोन ऐप में जोड़ रहा हूं और इस टिप्पणी से समाधान को सबसे उपयोगी पाया।

अब तक यह काफी अच्छा काम कर रहा है, अच्छे अनुमान के बजाय सजावटी के माध्यम से पारित गुणों को स्पष्ट रूप से एनोटेट करने की कमी के साथ।

export function Props<T extends Function>(props: { [x:string]: any }) {
  return function decorator(ctor: T) {
    Object.assign(ctor.prototype, props);
  };
}

@Props({
  routes: {
    home: "home",
    about: "about",
    dashboard: "dashboard",
    blog: "blog",
    products: "products",
    accountSettings: "accountSettings",
    signOut: "signOut",
  },
})
export class Router extends Backbone.Router {
  home() {}
  about() {}
  // ...
}

@Props({
  model: CategoryModel,
  comparator: (item: CategoryModel) => item.display_value,
})
export class CategoryCollection extends Backbone.Collection<CategoryModel> {}

स्पष्टीकरण संपत्ति एनोटेशन का उदाहरण:

@raffomania , @jridgewell & Co., इसके लायक क्या है, मेरी टीम ने कक्षा के बाहर प्रोटोटाइप में idAttribute जोड़कर इस समस्या को हल किया।

वर्ग उदाहरण माता-पिता का उदाहरण बढ़ाता है {
// कक्षा के तरीके आदि यहाँ
}

x.उदाहरण = उदाहरण;

x.Example.prototype.idAttribute = 'customIdAttr';

@kamsci मैंने इस शाखा में वही किया जहाँ मैंने बैकबोन को ES6 कक्षाओं में परिवर्तित किया

कॉन्फ़िगरेशन ऑब्जेक्ट्स के _declarative_ होने के बिंदु पर बैकबोन _configuration_ का उपयोग करता है। यह अच्छा है लेकिन यह विरासत के साथ कभी अच्छा नहीं खेलने वाला है। (कक्षा को क्लोन करें, फिर इसे कॉन्फ़िगर करें। यह विरासत नहीं है।)

यदि हम बैकबोन का उपयोग करके नया कोड लिखने जा रहे हैं, तो अलग तरीके से सोचना ठीक है। ES5 कोड को काटना और चिपकाना और फिर इसे ES6 जैसा दिखाना काम नहीं करता है। तो क्या हुआ?

मुझे कॉन्फ़िगरेशन ऑब्जेक्ट के माध्यम से सबकुछ में गुजरने में कोई समस्या नहीं है। हम उस कॉन्फ़िगरेशन की सामग्री को कैसे उजागर करते हैं, या इसे पढ़ना/काम करना आसान बनाते हैं, हल करने के लिए एक समस्या है, रोने के लिए नहीं।

कोई भी कंस्ट्रक्टर को दो बार चलाना नहीं चाहता। यह मूर्खतापूर्ण है। लेकिन, का पैटर्न

Foo = BackboneThing.extend({LONG DECLARATIVE OBJECT LITERAL}) माँ-प्रेमी भी बदसूरत है। आप सभी इसे इतने लंबे समय से कर रहे हैं कि आप नहीं देखते कि यह कितना बदसूरत है।

एफवाईआई: मेरे पास एक बड़ी मैरियनेट परियोजना है, और ES6 वाक्यविन्यास का उपयोग करना चाहता था। मैंने एक जेएसकोडशिफ्ट ट्रांसफॉर्मर बनाया जो बैकबोन का अनुवाद ईएस 6 कक्षाओं में घोषणाओं को बढ़ाता है। यह कई सरल धारणाएँ बनाता है, लेकिन फिर भी आप में से कुछ के लिए उपयोगी हो सकता है, यदि केवल एक प्रारंभिक बिंदु के रूप में। यह @ t-beckmann द्वारा प्रस्तावित वाक्य रचना का अनुसरण करता है क्योंकि मैं सज्जाकारों के साथ मुद्दों में भाग गया था।
https://gist.github.com/maparent/83dfd65a37aaaabc4072b30b67d5a05d

मेरे लिए इस सूत्र में एक अजीब मिथ्या नाम है। ES6 के लिए 'स्थिर गुण' कंस्ट्रक्टर पर मौजूद गुण हैं जो बिना तात्कालिकता के कक्षा में मौजूद हैं (उदाहरण के लिए Class.extend)। इस धागे में 'स्थैतिक गुण' प्रोटोटाइप पर नामित विशेषताओं को 'स्थैतिक' मान (गेटर्स या फ़ंक्शंस नहीं) के साथ संदर्भित करता है। क्या वह अधिकार मुझे मिल गया है?

स्थिर मान वाले प्रोटोटाइप गुणों के लिए, बैकबोन प्री इनिशियलाइज़ वैल्यू को फंक्शन रिटर्न वैल्यू के रूप में घोषित करना काफी सीधा संक्रमण है और _.result के रूप में अच्छी तरह से काम करता है जैसा कि डिफॉल्ट्स, क्लासनाम, आईडी आदि के लिए अपेक्षित है। अन्य इंस्टेंस गुण ठीक घोषित किए गए प्रतीत होते हैं इनिशियलाइज़ फंक्शन का शीर्ष सामान्य के रूप में। यह समस्या केवल उत्पन्न होती है क्योंकि ES6 कक्षाओं में आप प्रोटोटाइप गुणों को वर्तमान में स्थिर मान के साथ परिभाषित नहीं कर सकते हैं, केवल गेटर्स, सेटर्स और फ़ंक्शंस।

किसी भी तरह से, निर्माता/वर्ग स्थिर गुण (Class.extend) रीढ़ की हड्डी में विरासत में नहीं हैं क्योंकि वे ES6 में हैं। बैकबोन हर बार क्लास स्टैटिक प्रॉपर्टीज को नए क्लास/कंस्ट्रक्टर में कॉपी करता है, जब इन गुणों को ES6 के रूप में इनहेरिट करने के बजाय एक्सटेंड फंक्शन करते हैं। मैंने इसे यहाँ ठीक करने के लिए एक जनसंपर्क बनाया है https://github.com/jashkenas/backbone/pull/4235

मैं कुछ टिप्पणियों/प्रतिक्रिया की सराहना करता हूं, मुझे यकीन नहीं है कि यह कुछ भी तोड़ देगा, मैंने इसका थोड़ा सा परीक्षण किया है और ऐसा लगता है कि यह अच्छी तरह से काम करता है। बैकबोन क्लासेस प्रत्येक नए कंस्ट्रक्टर के संदर्भ को कॉपी करने के बजाय Class.extend को इनहेरिट करती हैं।