Angular模板中getter和调用函数之间的性能差异答案

【问题标题】：Performance difference between a getter and calling a function in Angular templateAngular模板中getter和调用函数之间的性能差异
【发布时间】：2019-03-20 13:41:19
【问题描述】：

在我的模板中，我想检查是否有服务可用于启用/禁用按钮。现在我想我有两个选择：

模板：

<button [disabled]="isServiceAvailable()"></button>

TS：

isServiceAvailable(): boolean {
    return true;
}

或

模板：

<button [disabled]="isServiceAvailable"></button>

TS：

get isServiceAvailable() {
    return true;
}

两者之间有性能差异吗？我知道第一个被认为是不好的，因为每次更改检测运行时都会调用该函数。第二种选择也是如此吗？每次都会执行getter，还是这是一个好的解决方案？

【问题讨论】：

我想你可以在这里找到答案stackoverflow.com/questions/46749904/…
不是真的，我知道只提供一个属性对于更改检测更好，但我不确定通过get property() 使用属性是否表现得像直接属性或函数调用。
我相信get XX(){return true }和普通的函数调用没有区别。您可以通过像 stackblitz.com/edit/angular-c4j8dz 这样的测试看到在 cahnges 上两者都以相同的方式被调用。

标签： angular

【解决方案1】：

使用像https://stackblitz.com/edit/angular-c4j8dz 这样的简单测试，您会发现get foo(){ return true; } 和普通函数foo(){return true;} 在事件发生变化时的方法调用没有区别。

【讨论】：