Question

我很好奇这两个函数在Angular 4中会有什么区别：

get currentIndex(): number {
  return `Current Index is ${this.index}`;
}

public currentIndex(): number {
  return `Current Index is ${this.index}`;
}

它们是否做完全相同的事情？如果是这样，他们什么时候会做些不同的事情？

Answer 1

除了函数/方法倾向于暗示计算之外，它们几乎相同。因此，当您仅访问数据（如本例中的索引）时，一个函数看起来可能很奇怪，或者看起来像是过大。

使用吸气剂是两全其美。看起来像简单的数据访问-currentIndex与currentIndex()-同时允许您稍后在需要进行诸如计算之类的操作时添加逻辑。

尽管从技术上讲它们是不同的，但是您可以使用TypeScript PlayGround来查看它们如何编译成不同的代码。

Answer 2

getter/setter与属性的关系比方法更多，因此最好将getter/setter与常规属性进行比较。

和调用getter/setter就像任何普通属性一样，仅实现getter表示只读属性，而仅实现setter表示只写属性。

getter和setter添加额外的层以直接与属性进行交互

class Person {
 private _age:number;
 public get age() {
   //... do something 
   retutn this._age; 
 }

 public set age(value) {
   if (value >0){
    this._age = value
   }
 }
}

在上面的示例中，我们避免了年龄的确定无效值。

如果我们想在年龄中在年龄板上用吸盘显示吸气剂，例如{{age}}，但如果年龄是一个函数，它将像这样{{age()}}

正如我之前提到的，最好将getter/setter视为属性而不是方法

来自您的示例

get currentIndex(): number {
  return `Current Index is ${this.index}`;
}

上面的吸气剂可能会提供服务中的值或其他属性的计算值，看起来像普通属性

setter，getter

在Angular 4组件的上下文中获得函数有什么好处？

2 个答案: