【问题标题】:Dynamically creating a new javascript class from an existing object从现有对象动态创建新的 javascript 类
【发布时间】:2011-01-21 11:58:27
【问题描述】:

假设我有以下代码:

var album = new MyObject('album');

假设在构造对象时,通过 AJAX 加载了一堆仅与专辑相关的属性。是否可以创建一个Album 类,以便稍后我可以这样做:

var anotherAlbum = new Album();

Album 构造函数将根据创建 MyObject('album') 时加载的内容自动设置专辑对象独有的属性

【问题讨论】:

    标签: javascript dynamic class


    【解决方案1】:

    JavaScript 是原型的,不是经典的,所以如果你从类的角度来思考,那你就错了。

    您根本不必使用new 运算符。您可以使用对象字面量创建一个新对象:

    var myObject = {attr1: 'val1', attr2: 'val2'};
    

    然后您可以创建该对象的新实例:

    var mySecondObject = Object.create(myObject);
    

    现在您可以更改mySecondObject 的属性,如果它有方法,您可以同样轻松地重载它们:

    mySecondObject.attr1 = "Hello";
    
    mySecondObject.attr2 = function() {
                               return "World!";
                           };
    

    然后mySecondObject 当然会拥有你在创建时给myObject 的所有属性。

    请注意,这是一个简单的版本,这会使所有属性都“公开”。如果您需要一些隐私,可以通过添加一些功能来实现。不过这有点复杂,所以如果您有兴趣,请告诉我...

    【讨论】:

      【解决方案2】:

      JavaScript“类”,就像任何其他对象一样,可以动态创建。所以,是的,这是可以做到的。

      您可以在处理 AJAX 响应的代码中执行类似的操作(假设 AJAX 响应提供了新“类”的名称,并且它位于名为 newClassName 的变量中):

      window[newClassName] = function() {
        // New class name constructor code
      }
      
      window[newClassName].prototype = {
      
        someProperty: "someValue",
      
        someMethod: function(a, b) {
        },
      
        someOtherMethod: function(x) {
        }
      }
      

      【讨论】:

      • 我的主要问题是,如何创建“相册”对象,以便可以在应用程序中的任何位置调用它
      【解决方案3】:

      这实际上是 JavaScript 的唯一继承。 JavaScript 有prototypal inheritance(可用于重新创建经典继承)。这意味着继承来自另一个对象,而不是类定义。

      创建一个拥有另一个对象所有属性的对象很简单:

      function Album() {
         // do whatever initialization you need to here, all the properties of album 
         // are available on 'this'
         // e.g.,
         doSomething(this.albumName);
      }
      Album.prototype = album;
      
      var anotherAlbum = new Album();
      

      【讨论】:

        【解决方案4】:

        您可以使用 Douglas Crockford 的功能继承模式。 Javascript Good Parts 书中的代码

        var mammal = function (spec) {
            var that = {};
        
            that.get_name = function (  ) {
                return spec.name;
            };
        
            that.says = function (  ) {
                return spec.saying || '';
            };
        
            return that;
        };
        
        var myMammal = mammal({name: 'Herb'});
        
        
        var cat = function (spec) {
            spec.saying = spec.saying || 'meow';
            var that = mammal(spec);
            that.purr = function (n) {
                var i, s = '';
                for (i = 0; i < n; i += 1) {
                    if (s) {
                        s += '-';
                    }
                    s += 'r';
                }
                return s;
            };
            that.get_name = function (  ) {
                return that.says(  ) + ' ' + spec.name +
                        ' ' + that.says(  );
            return that;
        };
        
        var myCat = cat({name: 'Henrietta'});
        

        它使用函数来用新的函数和属性来装饰现有的 javascript 对象。像这样,您可以向现有对象动态添加新功能和属性

        【讨论】:

          【解决方案5】:

          你可以这样做

          var NewClass=function(){
              this.id=null;
              this.name=null;
              this.show=function(){
                  alert(this.id+" "+this.name;
              }
          }
          NewClass.prototype.clear=function(){
              this.id=null;
              this.name=null;
          };
          
          ...
          
          var ins1=new NewClass();
          var ins2=new NewClass();
          

          【讨论】:

          • 我不明白这如何回答 5 岁的问题。
          猜你喜欢
          • 2015-09-24
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 2017-10-24
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 2016-08-18
          相关资源
          最近更新 更多