打字稿-设置员/信件的优点?

时间:2018-09-06 13:37:35

标签: javascript typescript setter getter

我是一个主要使用Java开发的后端开发人员,所以我被教导使用setter / getters而不是直接访问类的属性。

现在,我进入前端世界,现在进入js / ts。我见过很多人直接访问对象变量,而没有使用this.person.name之类的Java中的设置方法和获取方法。

这是为什么?如果您不需要添加额外的代码而只是获取值或对其进行设置,那么在ts和js上使用getter / setter会有任何优势吗?

谢谢。

2 个答案:

答案 0 :(得分:2)

使用getter或setter与直接访问对象变量之间的区别在于,getter / setter在赋值时自动被调用。因此,它看起来就像一个普通属性,但在幕后您可以在分配之前或之后运行额外的逻辑(或检查)。

因此,如果您决定将这种额外的逻辑添加到已经具有引用的现有对象属性之一中,则可以将其转换为getter / setter样式,而无需更改有权访问该属性的其余代码。

let person = {
    _age: 50,

    set age(newage){
      if(typeof newage === 'number'){
           this._age = newage;
            console.log('valid input')
      }
      else{
           console.log ('Invalid input');
      }
    }

  };

答案 1 :(得分:1)

@Pointy的说法是错误的:在学习JavaScript时忘记有关Java的一切真是个好主意。封装是一种面向对象的原理,即隐藏对象的内部状态和行为,使您的代码更具可维护性。

在javascript中,您可以使用无/混乱结构来处理内容。 Typescript是javascript的超集,如果您是C#,Java或任何其他面向对象的语言程序员,那么此人就是您的朋友。

示例:
在myobject中。 Ts

export class MyObject {

   // private property
   private _x: number;
   private _z: number;

   // public property
   y: number;

   constructor(private _d?: number) {
       this._x = 0;
       this.y = 0;
       this._z = 0;

       this.clog(_d)
   }

   // access modifier only for _x
   get x() {
       return this._x;
   }
   set x(value: number) {
       this._x = value;
   }

   private clog(d: number) { 
       console.log(d);
   }

   // arrow function -> public
   testf = () => { console.log('value of this._d' , this._d); }
}

然后进入myobject。 js

export class MyObject {
   constructor(_d) {
       this._d = _d;
       // arrow function -> public
       this.testf = () => { console.log('value of this._d', this._d); };
       this._x = 0;
       this.y = 0;
       this.clog(_d);
   }
   // access modifier
   get x() {
       return this._x;
   }
   set x(value) {
       this._x = value;
   }
   clog(d) {
       console.log(d);
   }
}

我们主要使用它。 Ts

import { MyObject } from './myobject';

let mo = new MyObject(15);

// set a value to the private property x
mo.x = 5;

// get the value of the private property x
// output 5
console.log(mo.x);

vscode和智能感知:
enter image description here

在vscode中使用intellisense,您会看到它没有显示私有属性_z和私有函数clog()。

我建议您观看本教程并提出一个更好的主意。 Link