Question

我想定义一个对象，并使用一个函数将数组填充为该对象的一个成员。我已经尝试在对象定义的内部和外部使用一个函数，但似乎都不起作用。这可能吗？这是我想要做的简化版本：

<!DOCTYPE html>
<html>
<body>
<p>object function test.</p>
<p id="demo"></p>

<script>
var test_object = {
    num1: 1,
    num2: 10,
    nums: make_array(this.num1, this.num2)       
};

function make_array(firstnum, lastnum) {
       myArray = [];
       for (i=firstnum; i <= lastnum; i++){
         myArray.push(i);
       }
    return myArray;
};
document.getElementById("demo").innerHTML = test_object.nums;
</script>
</body>
</html>

将num1和num2传递给函数时似乎是undefined。我做错了什么？

Answer 1

你必须在这里使用getter来获得所需的结果，

var test_object = {
    num1: 1,
    num2: 10,
    get nums() {
      return make_array(this.num1, this.num2)       
    }
};

让我告诉你为什么你的代码没有按预期工作，该对象文字中的this将指向上层上下文，而不是对象本身。

这对你来说会更好read。

Answer 2

在此上下文中，this引用父对象（window，如果代码在浏览器中运行），而不是test_object您处于中间位置定义：

var test_object = {
    num1: 1,
    num2: 10,
    nums: make_array(this.num1, this.num2)       
};

如果希望最终结果是普通对象，最简单的解决方案可能是分离分配，以便您可以按名称引用对象：

var test_object = {
    num1: 1,
    num2: 10
}
test_object.nums = make_array(test_object.num1, test_object.num2);

（另一个答案中提到的ES6 getter也是可能的，虽然它的工作方式略有不同（并且在某些旧浏览器中不起作用）：上面会立即评估数组; getters会在我们要求使用getter，例如，如果您在阅读test_object.num1之前更改了test_object.nums，则会得到不同的答案。这可能是您想要的，也可能不是。）

Answer 3

问题在于myArray内幕，你的函数make_array未被声明。

如何使用函数在JavaScript对象声明中填充数据？

3 个答案: