DEV Community

loading...
Cover image for JavaScript Object Getter and Setter Methods

JavaScript Object Getter and Setter Methods

bello profile image Bello ・Updated on ・2 min read

image.png


Getter

Getter methods are used to return an object's properties.

See the examples below:

const person = {
  name: 'Bello',
  age: 27,
  getPerson() {
    if (typeof this.name === 'string' && typeof this.age === 'number') {
      return `${this.name} is ${this.age} years old!`;
    }

    return "Name or age is invalid";
  } 
}

console.log( person.getPerson() );
Enter fullscreen mode Exit fullscreen mode

We can add a little more get keyboard to the code snippet above.

const person = {
  name: 'Bello',
  age: 27,
  get getPerson() {
    if (typeof this.name === 'string' && typeof this.age === 'number') {
      return `${this.name} is ${this.age} years old!`;
    }

    return "Name or age is invalid";
  } 
}

console.log(person.getPerson); //  No parenthesis used
Enter fullscreen mode Exit fullscreen mode

The difference is when the get keyword was used, no parenthesis was used in the calling function.

getPerson, not getPerson()."

The name property

A function in on object looks like a property when the get keyword is used.

See the example:

const sayHi = {
  get name() {
    return "Hello World!";
  }
};

sayHi.name; // "Hello World!"
Enter fullscreen mode Exit fullscreen mode

The syntax above looks like object.property syntax.

We can get the name of a function with the name property.

See the example below:

function greet() {
  return "Hello World!";
}

console.log(greet.name); // greet
Enter fullscreen mode Exit fullscreen mode

A function name can also be accessible even if used as a default parameter in another function.

function func(greet = function() {}) {
  console.log(greet.name); // greet
}

func();
Enter fullscreen mode Exit fullscreen mode

The length property

The length or the number of parameters of a function can also be accessible by the length property.

See the example below:

const func = (name, age) => {
  return "${name} is ${age} today!";
}

console.log(func.length); // 2
Enter fullscreen mode Exit fullscreen mode

Setter

Setter methods are used to set or reassign values of existing properties within an object.

const person = {
  name: 'Bello',
  age: 27
} 

person.name = 'John';
console.log(person.name) // John;
Enter fullscreen mode Exit fullscreen mode

We can do more than the example above by checking if certain properties exist in an object.
In the example below, an existing property gets reassigned

const person = {
  name: 'Bello',

  set setPerson(name) {
    if (this.name) {
      this.name = name;
    } else { 
      console.log("Give a valid name");
    }
  } 

};

person.setPerson = 'John';
console.log(person.name, typeof person.name) // John string
Enter fullscreen mode Exit fullscreen mode

Happy coding!!!


image.png


Discussion (0)

pic
Editor guide