Skip to content
Related Articles

Related Articles

TypeScript Accessor
  • Difficulty Level : Easy
  • Last Updated : 30 Jul, 2019

In TypeScript, there are two supported methods getter and setter to access and set the class members. The greater method control over how a member is accessed on each object.

Methods of the typescript accessor property:

  • getter: This method comes when you want to access any property of an object.
  • setter: This method comes when you want to change any property of an object.

getter: For extracting the value of a variable getter accessor property is the conventional method. It is denoted by get keyword, in an object literal.
Syntax:

get accessName() {  
    // getter, the code executed on getting obj.accessName  
  },  

Example:




class MyClass {
    private _with:number = 5;
    private _height:number = 10;
    get square() {
        return this._with * this._height;
    }
}
console.log(new MyClass().square);

Output:



50

A getter can be public, protected, private. It is just artificial to make something behave like a property or a function. So, get square() and new MyClass().square is the same as square() and new MyClass().square().

Setter: For updating the value of a variable the setter accessor property is the conventional method which is used. They are denoted by set keyword in an object literal.

Syntax:

set accessName(value) {  
    // the code executed on setting 
    //obj.accessName = value, from setter  
  }  

Example:




set fullname {
    const parts = value.split ('');
    this.partname = firstname[0];
    this.partname = firstname[1];
}
person fullname = "Hitangshu Agarwal"
console.log(person);

output:

firstname: "Hitangshu"
lastname: "Agarwal"

Below example illustrates the concept of getter and setter clearly:

Example:




const company = {
    companyName = "GeeksforGeeks",
    companyTag = "Edutech",
      
    // Function that return the Full description
    // combined both comapnyName and companyTag
    get full_Desc () {
        return `${company.companyName} ${company.CompanyTag}`
    },
      
      
    // It will return separetely companyName and companyTag
    set full_Desc(value) {
        const parts = value.split ('');
        this.partname = companyName[0];
        this.partname = CompanyTag[1];
    }
};
  
company.full_Desc = "GeeksforGeeks Edutech";
console.log(company);

Output:

GeeksforGeeks Edutech

Point To Be Remember:

  • We achieved a proper control over, how a member is accessed on each object with the help of getter and setter.
  • TypeScript accessors require to set the compiler to output ECMAScript 5 or higher we should require typescript accessor. It does not support below ECMAScript 5.
  • Accessor with a get and no set property are automatically assumed to be read-only no need for manual work. This is helpful when we are generating a .d.ts file from our code.

Attention reader! Don’t stop learning now. Get hold of all the important DSA concepts with the DSA Self Paced Course at a student-friendly price and become industry ready.

My Personal Notes arrow_drop_up
Recommended Articles
Page :