在角度2应用中使用getter setter是一个好习惯

Question

我正在开发angular2应用程序，我的团队成员正在使用getter和setter来设置输入属性，如下所示

private _showModal;
@Input() set showModal(showModal){
     this._showModal = showModal;
}
get showModal() {
     return this._showModal;
}

但我不确定这是一个很好的方法。我认为在设置或获取值时dev需要进行一些验证或检查或执行其他功能的情况下应该使用getter setter

Answer 1

我们在进行阅读（get和写作（get）的位置主要决定了我们为性能付出的成本。

set之三

每次我们写一些值时，都会调用一个set ter函数。

现在，我们通常会在TypeScript类中完成编写调用set ter的写作部分。因此，除非进行set操作，否则它们不会被频繁调用，该操作通常并不常见。

get之三

每次读取某个值时，都会调用一个get ter函数。

{get ter通常以不同的数据绑定语法在模板中调用，例如字符串插值（{{}}），属性绑定（[---]=""），属性绑定（[attr.---]=""），样式绑定（[style.---]=""）等。

现在要抓住的是，每当Angular执行更改检测时，get ter都会被调用。只要您的get中没有太多逻辑，就可以了。但这仍然为团队中的新开发人员留出了空间，可以在其中添加逻辑，而无需知道它将要创造的性能影响。

因此，总而言之，据我了解，可以有set个ter。但是拥有get ter及其性能成本将主要取决于使用这些get ter的位置。如果将它们用于模板绑定语法之一，则不要将它们放在第一位置是安全的。如果模板中未使用它们，则可以使用它们。

  

我实际上已经写了一篇文章和一些您可能还想检出的StackOverflow线程的一些答案。因此，我将它们添加为以下列表：

     

  

1. Angular: Prevent DomSanizer from updating on DOM Events

  

2. Angular performance: ngStyle recalculates on each click on random input

  

3. Angular 7 ,Reactive Form slow response when has large data

  

4. Angular Performance: DOM Event causes unnecessary function calls

  

5. I changed my implementation of an EXTREMELY deeply nested Angular Reactive Form and you won’t believe what happened ?

  

希望这给您一些视角。 ：）

Answer 2

如果你改变get或set中的_showModal，我只会这样做。

像团队成员一样使用它（带有支持属性）只需添加更多代码行。在这种情况下，我将创建一个公共showModal属性。

我不知道是否有最佳实践＆＃34;为了这。我认为这主要与个人偏好有关。

Answer 3

这是部分意见，部分是您的申请要求。使用getter和setter肯定不是 bad 。但我也会谨慎使用它们，在大多数情况下，吸气剂和制定者可能是不必要的。

在您提供的示例代码中，没有理由使用getter和setter。你是正确的，因为它可以帮助你进行某种验证检查，或者当其他东西取决于所设置的值等等。例如，当@Input()属性改变值时，你可能需要调用某个函数，这可以是一种简单的方法来实现这一目标。但在许多情况下，这可能不是您应用程序中每个变量/输入的要求。

希望这有帮助。

Answer 4

请尽可能避免使用吸气剂。吸气剂对变化检测有负面影响。为了知道是否应该更新视图，Angular需要访问新值，将其与旧值进行比较，然后决定是否应更新视图。因此，将在每个更改检测周期对值进行比较和更新。这可能会导致性能问题并绕过某些配置，例如OnPush。如果由于某种原因需要在组件中更改@Input（）时转换数据，则可以使用setter例如。

value;
@Input('myValue') set myValue(v) {
 transformValue(v);
}
transformValue(v) {
...*sometransofrm*
this.value = transofrmedValue
}

在此示例中，将setter放置在Input上，并且每次将新的myValue推入组件时，该值就会转换。但是，如果引入了吸气剂，则无论如何，每次更改检测周期，组件都会检查吸气剂。您也可以使用其他东西，例如管道或ngOnChange来代替setter。实际上，我更喜欢在应用程序中使用ngOnChange，因为它可以避免与大型开发团队完全混淆。

Answer 5

这是一个很好的做法，因为您可以更好地控制数据。特别是当您需要通过角度变化检测知道数据何时发生变化时。

大多数时候，我在我的服务中使用它们来共享几个组件的数据。

它们还与可观察对象很好地交互，以避免多次调用端点来获取数据。