了解Javascript函数中的属性执行

Question

我开始学习javascript，我对javascript函数中属性的执行感到困惑。

假设我有一个这样的功能

function Counter() {
  this.num = 0;
this.timer = console.log('hey');
};

现在在此功能中，我将num和timer作为功能Counter的属性。当我尝试创建构造函数的实例时，将执行timer属性

但是当我尝试显式调用timer属性时，我没有得到该值/该属性没有得到执行。

其背后的原因是什么？

Answer 1

  

现在在此函数中，我将num和timer作为计数器功能的属性。

否，您拥有对象的num和timer属性，这些对象是通过调用Counter作为构造函数（通过new或{{ 1}}等。

  

但是当我尝试显式调用timer属性时，我没有得到该值/该属性没有得到执行

仅简要介绍术语（因为这将有助于您继续学习），因此您不会“调用”属性，并且不会“执行”属性。您可以“获取”它们的值，或者“访问”它们，或者“读取”它们。 （或者，当它们位于任务的左侧时，您可以“设置”它们，或者“分配给”它们，或者“写入”它们。）

您的代码已成功获取Reflect.construct属性的值，该属性值是timer返回的值，即console.log('hey')。

如果您打算对undefined进行操作以使其运行timer，则需要将其放在函数中：

console.log

然后调用它（因为您执行“调用”功能）：

this.timer = function() {
    console.log('hey');
};

---

旁注：

如果是您要执行的操作，虽然可以在构造函数中创建这样的函数是很好的，但是将它们分配给d.timer(); 会提供给原型对象的情况稍微更常见到它创建的对象。对于ES5和更早的版本，您可以这样：

new Counter

在ES2015 +中，您可能会改用function Counter() { this.num = 0; } // <== No ; here, it's a declaration, not a statement Counter.prototype.timer = function() { console.log('hey'); }; 语法：

class

您以相同的方式使用它们（通过class Counter() { constructor() { this.num = 0; } timer() { console.log('hey'); }; } ）。

Answer 2

这很容易。

this.timer = console.log('hey');

此行将timer的返回值分配给属性console.log('hey')。

console.log在控制台中打印，但不返回任何内容，因此您的财产仍为undefined。

您很困惑，因为您将控制台中打印的内容与实际返回值混合在一起。

如果仅在控制台中运行以下命令：console.log('hey')，则会看到以下内容：hey然后undefined。 console.log函数输出的内容，然后是其返回值。

Answer 3

在使用Counter作为构造函数创建新对象时，将创建一个具有2个属性的新对象，即num和timer。 num初始化为0，而timer初始化为console.log()函数的返回值undefined。此返回值将存储为timer属性的值，并且每次在读取它时获得它。

如果我理解正确，您希望将某些功能作为函数添加到timer属性中，则可以通过将其添加到Counter的prototype属性中来实现，以便所有使用构造函数可以继承它。

function Counter() {
  this.num = 0;
};

Counter.prototype.timer = function() {
  this.timer = console.log('hey');
}

let obj = new Counter();

obj.timer();