我正在开发 angular2 应用程序,其中我的团队成员正在使用 getter 和 setter 来设置输入属性,如下所示
private _showModal;
@Input() set showModal(showModal){
this._showModal = showModal;
}
get showModal() {
return this._showModal;
}
但我不确定这是这样做的好方法。我认为在开发人员在设置或获取值时必须进行一些验证或检查或执行其他功能的情况下,应该使用 getter setter
我们在哪里进行阅读(get
)和写作(get
)主要决定了我们为性能支付多少成本。
set
之三
每次我们写入一些值时都会调用一个set
ter 函数。
现在我们通常做在 TypeScript 类中调用set
之三的写作部分。因此,除非有set
操作,否则他们不会经常被调用,这通常不是很频繁。
get
之三
每次我们读取某个值时都会调用一个get
ter 函数。
get
之三通常在模板中以不同的数据绑定语法调用,如字符串插值({{}}
),属性绑定([---]=""
),属性绑定([attr.---]=""
),样式绑定([style.---]=""
)等。
现在的问题是,每次 Angular 执行更改检测时,都会调用get
ters。只要你的get
没有太多逻辑就没问题。但这仍然为团队中的新开发人员留下了空间,可以在其中添加逻辑,而不知道它将要创建的性能影响。
所以总而言之,据我了解,有set
是可以的。但是拥有get
之三及其性能成本主要取决于这些get
之三的使用位置。如果它们在其中一个模板绑定语法中使用,那么首先不使用它们是安全的。如果模板中未使用它们,则可以使用它们。
我实际上已经写了一篇文章和一些关于各种StackOverflow线程的答案,你可能也想看看。所以我将它们添加为下面的列表:
Angular:防止 DomSanizer 更新 DOM 事件
角度性能:ngStyle 在每次点击随机输入时重新计算
角度7,有大数据时反应式形式响应缓慢
角度性能:DOM 事件导致不必要的函数调用
我更改了极深嵌套的角反应形式的实现,您不会相信发生了什么
希望这能给你一些视角。 :)
如果可能的话,特别避免使用getter。Getters 对更改检测有负面影响。为了知道视图是否应该更新,Angular 需要访问新值,将其与旧值进行比较,并决定是否应该更新视图。因此,在每个更改检测周期中比较和更新该值。如果由于某种原因,您需要在组件中更改 @Input() 时转换数据,则 setter 就可以了。
value;
@Input('myValue') set myValue(v) {
transformValue(v);
}
transformValue(v) {
...*sometransform*
this.value = transforrmedValue
}
在此示例中,在输入上放置一个资源库,并且每次将新的 myValue 推送到组件时都会转换值。但是,如果引入了吸气剂,则组件将在每次更改检测周期时检查吸气剂。你也可以使用其他的东西,如pipes或ngOnChange而不是setters。
更新
只要您的组件正在使用 ChangedetectionStategy.OnPush 现在使用 getter 就可以了,但如果您不使用 OnPush,仍然可以避免使用它
这是部分意见,部分是应用程序的要求。 使用吸气剂和二传手当然也不错。 但我也会谨慎使用它们,在大多数情况下,getter 和 setter 可能是不必要的。
在您提供的示例代码中,没有理由使用 getter 和 setter。 您是正确的,因为它可以在进行某种验证检查或取决于所设置的值等其他事情时提供帮助。 例如,当@Input()
属性更改值时,可能需要调用某个函数,这可能是实现此目的的简单方法。 但在许多情况下,这可能不是应用程序中的每个变量/输入的要求。
希望这有帮助。
只有当您在获取或设置中更改_showModal时,我才会这样做。
像您的团队成员一样使用它(带有支持属性)只会添加更多代码行。在这种情况下,我会公开显示模态属性。
我不知道是否有"最佳实践"。我认为这主要与个人喜好有关。
这是一个很好的做法,因为您可以更好地控制数据。特别是当您需要使用角度变化检测知道数据何时发生变化时。
大多数情况下,我在服务中使用它们来在多个组件之间共享数据。
它们还与可观察量很好地交互,以避免多次调用终结点来获取数据。