使用現有對象屬性創建對象屬性的Javascript

Question

這就是我想做的

var myObject = {
  prop: "872349827194721934798",
  calcProp: (this.prop.length % 3),
  method1: function () { return this.calcProp; },
  method2: function () { return this.calcProp - 1; }
}

但是，它返回錯誤“ this.prop is undefined” 。

下面的作品：

var myObject = {
  prop: "872349827194721934798",
  calcProp: function () {this.prop.length % 3;},
  method1: function () { return this.calcProp(); },
  method2: function () ( return this.calcProp() - 1;}
}

現在calcProp的用法是myObject.calcProp()' and I want the usage to be myObject.calcProp`。 我知道這行得通。

var myObject = {
  init: function () { this.calcProp = this.prop.length % 3; },
  prop: "872349827194721934798",
  calcProp: null,
  method1: function () { 
    this.init();
    return this.calcProp; 
  },
  method2: function () { 
    this.init();
    return this.calcProp - 1;
  }
}

有一種方法可以實現calcProp ，其用法是Object.calcprop 。 不調用init() 。

編輯-附加要求

---

注意：應該添加到我的需求中，我想盡量避免在初始定義之外修改屬性。 我不想執行以下操作；

var myObject = {
  prop: "872349827194721934798",
  method1: function () { return this.calcProp; },
  method2: function () { return this.calcProp - 1; }
};
myObject.calcProp = (myObject.prop.length % 3);

我想將所有內容保留在初始定義中。

Answer 1

var myObject = {
  prop: "872349827194721934798",
  method1: function () { return this.calcProp; },
  method2: function () { return this.calcProp - 1; };
};
myObject.calcProp = (myObject.prop.length % 3);

或允許以內聯方式完成此操作，請編寫一個幫助程序：

function alloc(init) {
    var o = {};
    init.call(o);
    return o;
}

您現在可以說：

var myObject = alloc(function() {
   this.prop = "872349827194721934798";
   this.calcProp = (this.prop.length % 3);
   this.method1 = function () { return this.calcProp; };
   this.method2 = function () { return this.calcProp - 1; };
});

Answer 2

var myObject = {
  prop     : "872349827194721934798",
  get calcProp(){ return this.prop.length % 3; },
  method1  : function () { return this.calcProp; },
  method2  : function () { return this.calcProp - 1; }
};

---

使用示例： console.log(myObject.calcProp);

注意： get是在ECMAScript5 / Harmony中引入的，因此，如果未在舊版瀏覽器上更新JS引擎，則在這種情況下它可能無法工作。 有關較舊版本瀏覽器的更多支持，請參考Daniel的解決方案 。

Answer 3

您必須先創建對象，然后才能訪問其成員。

var myObject = { 
  prop: "872349827194721934798", 
  method1: function () { return this.calcProp; }, 
  method2: function () { return this.calcProp - 1; } 
};
myObject.calcProp = myObject.prop.length % 3; 

在對象文字表達式的上下文中， this是指表達式的上下文-可能是window 。 您會收到一個未定義的錯誤，因為您的當前上下文不包含prop屬性。 如果上下文具有名為prop的成員，則將使用該值：

var prop = [];
var myObject = {
  prop: "872349827194721934798",    
  calcProp: (this.prop.length % 3),    
  method1: function () { return this.calcProp; },    
  method2: function () { return this.calcProp - 1; }    
};
myObject.calcProp; // 0 (ie, [].length % 3)

編輯：您不需要訪問屬性，只需使用相同的值即可。 例如：

var myObject = {
  prop: "some literal string",
  calcProp: "some literal string".length % 3
};

要么

var myObject = {
  prop: someVariable,
  calcProp: someVariable.length % 3
};

或者，這是另一種方法：

function SomeObj(prop) {
    this.prop = prop;
    this.calcProp = this.prop.length % 3;
}
SomeObj.prototype.method1 = function () { return this.calcProp; };
SomeObj.prototype.method2 = function () { return this.calcProp - 1; };

var myObject = new SomeObj("872349827194721934798");

Answer 4

您別無選擇，只能進行部分初始化

var obj = { prop: ... };
obj.calcProp = ...

您可以使用一些技巧來仍然能夠內聯編寫此代碼：

//the module pattern allows for inline statements
var fullObj =(function(){
    var obj = { prop: ... };
    obj.calcProp = ...
    return obj;
}());

//a constructor function gives you unlimited power:
function init(obj){
    obj.calcProp = ...
    return obj;
}
var something = init({
    prop: "123"
    ...
});

Answer 5

這與其他答案幾乎相同：

 var propVal = "872349827194721934798";
    var myObject = {
      prop: propVal ,
      calcProp: (propVal.length % 3),
      method1: function () { return this.calcProp; },
      method2: function () { return this.calcProp - 1; }
    }