在JavaScript中的属性数组中嵌套属性[重复]

Question

我正在尝试使用我在此“obj”中定义的属性填充对象“obj”中的数组“arr” '，在这种情况下，属性 'x';

基本上数组会有 x 值，但是当访问 'arr' 时，所有条目都是未定义。

我做了什么：

var obj = {
  x: 1,
  arr: [this.x, this.x, this.x],
};

console.log(obj.arr)

我应该如何在数组中引用 x？我尝试用括号括起来 arr ，但这只会给我一个语法错误。我试着搜索它是如何工作的，但没有发现任何有用的......

此外，我希望 arr 是二维的，这样：

var obj = {
  x: 1,
  arr: [
  [this.x, this.x, this.x],
  [this.x, this.x, this.x],
  [this.x, this.x, this.x]
  ],
 };
 
 
 console.log(obj.arr);

那么它会如何运作呢？

Answer 1

您不能在对象中引用this，这适用于函数。要访问该属性，您可以分配和重用。

反过来，使用 ES6 可以简化它。但是在那种情况下你不能再把它放回去。它将是只读的。

检查示例。

var obj = {
  x: 1
};
obj.arr = [obj.x, obj.x, obj.x]

console.log(obj.arr)

/// Other way arround , USING ES6 get

var obj = {
  x: 1,
  get arr() {
    return [this.x, this.x, this.x];
  },
};
console.log(obj.arr); // [1,1,1]
obj.arr = [1] // modify
console.log(obj.arr); // [1,1,1] still same

.as-console-row {
  color: blue !important;
}

Answer 2

这是因为在创建对象之前，用户无法访问this 来初始化任何其他属性。如果你仍然想创建一个数组，那么你可以将它定义为一个方法，除非被调用，否则它的执行是挂起的。

var obj = {
  x: 1,
  arr: function() {
    return [this.x, this.x, this.x]
  }
};

console.log(obj.arr())

否则你可以在创建对象后创建一个 arr 属性。

var obj = {
  x: 1,
};
obj['arr'] = [obj.x, obj.x, obj.x];

console.log(obj.arr);

Answer 3

通常您不能在初始化期间引用对象。之后你必须这样做：

var obj = {
  x: 1,
 };

obj.arr = new Array(3).fill(obj.x);

console.log(obj);

但是，在 ECMAScript 2015 发布后，您可以使用 getter() 来执行此操作

    var obj = {
      x: 1,
      get arr() {
        return [this.x, this.x, this.x];
      }
     };

    console.log(obj);

Answer 4

您可以在本主题中看到许多解决方案：Self-references in object literals / initializers

这里有一些：

解决方案 1

var obj = {
  x: 1,
  get arr() {
    return [this.x, this.x, this.x]
  }
};

解决方案 2

var x = 1;
var obj = {
  x: x,
  arr: [x, x, x]
};

解决方案 3

var obj = {
  x: 1,
};

obj.arr = [ obj.x, obj.x, obj.x ];