DEV Community

Cover image for JavaScript Object Getter and Setter Methods
Bello Osagie
Bello Osagie

Posted on β€’ Edited on

2 2

JavaScript Object Getter and Setter Methods

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


Image of Docusign

πŸ› οΈ Bring your solution into Docusign. Reach over 1.6M customers.

Docusign is now extensible. Overcome challenges with disconnected products and inaccessible data by bringing your solutions into Docusign and publishing to 1.6M customers in the App Center.

Learn more

Top comments (0)

A Workflow Copilot. Tailored to You.

Pieces.app image

Our desktop app, with its intelligent copilot, streamlines coding by generating snippets, extracting code from screenshots, and accelerating problem-solving.

Read the docs

πŸ‘‹ Kindness is contagious

Explore a sea of insights with this enlightening post, highly esteemed within the nurturing DEV Community. Coders of all stripes are invited to participate and contribute to our shared knowledge.

Expressing gratitude with a simple "thank you" can make a big impact. Leave your thanks in the comments!

On DEV, exchanging ideas smooths our way and strengthens our community bonds. Found this useful? A quick note of thanks to the author can mean a lot.

Okay