javascript - 理解 Javascript 函数中属性的执行

Question

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

假设我有这样的功能

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

现在在这个函数中，我有 num 和 timer 作为函数 Counter 的属性。当我尝试创建函数构造函数的实例时，计时器属性被执行

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

背后的原因是什么？

标签： javascriptecmascript-5

Answer 1

现在在这个函数中，我有 num 和 timer 作为函数 Counter 的属性。

不，您拥有作为构造函数调用（通过、或num等）创建timer的对象的属性。CounternewReflect.construct

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

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

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

如果你打算做一些事情timer来让它运行console.log，你会想把它放在一个函数中：

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

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

d.timer();

---

边注：

如果这就是你的意思，虽然在构造函数中创建这样的函数是非常好的，但将它们分配给原型对象更为常见，该对象new Counter将赋予它创建的对象。使用 ES5 及更早版本，您可以这样做：

function Counter() {
    this.num = 0;
} // <== No ; here, it's a declaration, not a statement

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

在 ES2015+ 中，您可能会改用class语法：

class Counter() {
    constructor() {
        this.num = 0;
    }

    timer() {
        console.log('hey');
    };
}

您以相同的方式使用它们（通过new）。