Javascript:在该对象中调用对象方法

时间:2012-06-06 16:25:12

标签: javascript oop methods

实现以下目标的最佳设计模式是什么(哪些不起作用)?

var obj = (function() {

  // code defining private variables and methods

  var _obj = {
    property: value,
    method1: function() {
      // do stuff
    },
    method2: function() {
      // use property
      var prop = _obj.property; // obviously doesn't work
      // call method1
      obj.method1(); // "obj" not finished being defined yet!
    }
  };

  // obviously now I could do...
  var prop = _obj.property;

  return _obj;

})();

// and I could now do...
obj.method1();

我认为应该有效的变体是

var obj = (function() {

  var property = value,
      method1 = function() {
        // do stuff
      },
      method2 = function() {
        // use property
        var prop = property;
        // call method1
        method1();
      },
      _obj = {
        property: property,
        method1: method1,
        method2: method2
      };

  return _obj;

})();

同样,它如何用于使用new运算符创建的对象?在构造函数本身中,您可以编写this.method()。但是如果你想保持构造函数很小,只定义那些可能在创建时自定义的东西,然后在原型中定义其余的东西呢? (这似乎是常见的模式。)原型中的属性/方法可以以任何方式进行交互吗?

var MyObj = function(name) {
  this.name = name;
};

var obj = new MyObj('Bob');

MyObj.prototype = {
  called_often: function() {
    // lots more code than just the following
    return document.getElementById('someID').value;
  },

  global_default: 'value', // can be changed, so need to pull value when run

  does_stuff: function(value) {
    var str = global_default + value, // can't access global_default on its own
        input = MyObj.called_often(), // doesn't work; MyObj.prototype.called_often() DOES
        name = this.name; // 'this' used in the prototype doesn't work
                          // even within a created object
    return name + input + str;
  }
};

我确定每当遇到这个问题时,有更好的方法来实现我的结果。此代码不是特定于具体情况,只是说明了一般问题。因此,您无法为我遇到的特定情况提供替代方案。但也许你可以帮我整体思考。

2 个答案:

答案 0 :(得分:34)

嗯,从你的第一个例子开始:

var _obj = {
    property: value,
    method1: function() {
      // do stuff
    },
    method2: function() {
      // use property
      var prop = this.property; 
      // call method1
      this.method1(); 
    }
  };

这就是this值的含义。

现在,你不能做的是从对象文字语法的其他地方引用“正在构建”对象的属性。 (很难给出一个例子,因为它在语法上是不可能的。)如果你想这样做,你需要一个或多个单独的赋值语句。

答案 1 :(得分:9)

猜猜是什么?你正在制作复杂的简单东西。 Pointy的答案很好,但由于几个原因原型方法更好。这就是我在最后一种方法中描述(而不是纠正)的原因。 Check this fiddle

var MyObj = function(name) {
  this.name = name;
};

MyObj.prototype = {
  called_often: function() {
    // lots more code than just the following
    return 'VALUE'; //document.getElementById('someID').value;
  },

  global_default: 'value', // can be changed, so need to pull value when run

  does_stuff: function(value) {
    var str = this.global_default + value, // can't access global_default on its own
        input = this.called_often(), // doesn't work; MyObj.prototype.called_often() DOES
        name = this.name; // 'this' used in the prototype doesn't work
                          // even within a created object
    return name + input + str;
  }
};

var obj = new MyObj('Bob');