Ext JSコンストラクタの配列に項目を押し込むと複数の項目になります

Question

私が定義したExt JSクラスがあります。このクラスのconstructorでは、テキストフィールドをアイテム配列にプッシュし、テスト文字列に追加します。配列と文字列の両方がクラス定義で空として宣言されています。しかし、複数のクラスインスタンスを作成しようとすると、items配列が各インスタンスで共有されていることがわかりますが、文字列は共有されません。

これはクラスの定義がテンプレートの一種として使用されることを期待しているので、これは奇妙に思えるので、新しいクラスのそれぞれはゼロから始まります。これは真実ではないようですので、これはプリミティブとオブジェクトとの関係がありますが、その理由は完全にわかりません。これを行うExt JSの背後にある技術的な説明は何ですか？コンストラクタ内のthisは実際のクラス定義ではなく、その特定のインスタンスを参照していませんか？

私はこの問題を解決する方法を求めていません...私はそれを行う方法を知っています（initComponent /コンストラクタ内の配列とオブジェクトを宣言します）。私はこれの背後にある技術的な説明が何であるか尋ねています。私が集めたことから、これはES6クラスの振る舞いではないので、これはExt JSクラスシステムの設計によるものと仮定しています。

ここにはexampleがあります。

Ext.application({ 
    name : 'Fiddle', 

    launch : function() { 
     Ext.define('MyClass', { 
      extend: 'Ext.panel.Panel', 
      alias: 'widget.myClass', 
      items: [], 
      border: true, 
      myTestString: '', 
      constructor: function(config) { 
       this.items.push({ 
        xtype: 'textfield', 
        fieldLabel: 'test' 
       }); 
       this.myTestString += 'hi'; 
       this.callParent(arguments); 
      } 
     }); 
     var v = Ext.create('Ext.container.Viewport', { 
      defaults: { 
       xtype: 'myClass', 
       listeners: { 
        afterrender: function(panel) { 
         console.log(panel.myTestString); 
        } 
       } 
      }, 
      items: [{ 
       title: 'One' 
      }, { 
       title: 'Two' 
      }, { 
       title: 'Three' 
      }] 
     }); 
    } 
}); 

Answer 1

Sencha Forums上のオーバーエヴァンTrimboliによると、これはプロトタイプ継承によるものです。つまり、クラスの定義に追加されたプロパティは、オブジェクトのプロトタイプに追加されるように扱われます。オブジェクトが参照渡しされるという事実と相まって、配列に追加すると、クラスのプロトタイプで更新され、次のインスタンスの作成に使用されます。 ECMAScriptの6では

function MyClass(item) { 
    this.items.push(item); 
} 
MyClass.prototype.items = []; 
var c1 = new MyClass(1); 
var c2 = new MyClass(2); 
console.log(c2.items); // returns an array of [1, 2] 

、クラスのシステムは、クラスのプロパティを許可していませんが、それは明らかに（このSO answerあたり）ES7のために検討されている：それは、次の例に似ています。