DEV Community

Cover image for JAVASCRIPT GETTERS AND SETTERS
Maame Afia Fordjour
Maame Afia Fordjour

Posted on

1 1 1 1 1

JAVASCRIPT GETTERS AND SETTERS

INTRODUCTION

Special methods in JavaScript that provide you access to object properties are called getters and setters. It is the purpose of getters to read values from properties and setters to write values to them. You will learn how to use getters and setters in JavaScript by following this tutorial.

WHY DO WE NEED TO USE GETTERS AND SETTERS?

📌You can manage who can access and change the properties of your object by using getters and setters.

📌 Before data is set to an object, it can be verified using getters and setters.

📌 It is possible to create attributes that are dynamically calculated by using getters and setters.

GETTER

Getters are functions that provide access to an object's properties. Though they are not invoked on an instance of an object, they are comparable to methods. They are called on the actual item instead. Getters are frequently used to retrieve values—like nested properties—from an object that are not readily available.

The get keyword is used to define getters, followed by a function. This function returns a value and accepts no arguments. Any valid JavaScript value, including objects and arrays, may be the value that is returned.

Lets take an example of a getter defined on an object named person is provided below. The value of the object's name property is returned by the getter, name:

const user = {
  firstName: 'John',
  lastName: 'Doe',
  get fullName(firstName, lastName) {
    return `${firstName} ${lastName}`;
  }
};

Enter fullscreen mode Exit fullscreen mode

An object named "user" with a getter named "fullName" is used in this example. The getter delivers the user's entire name after receiving two arguments: firstName and lastName. The user's whole name may then be retrieved using the getter: user.fullName('John', 'Doe') // returns 'John Doe'

SETTERS

You will master the fundamentals of utilizing the JavaScript Setter in this course. We'll go over how to make and use a setter as well as how to use it to organize and streamline your codebase. You will know more about using the JavaScript Setter to improve the codebase by the end of this session.

WHY SHOULD WE USE SETTERS?

📌 Divide up your code into distinct functions to help you organize your codebase.

📌 The Setter makes it simple to access and edit particular sections of your code.

📌 Having a centralized location to debug your code will streamline the debugging process.

A function that modifies an object's property value is called a setter. Usually, setters are used when you wish to regulate the setting of a property. For instance, you could wish to guarantee that a property's value is always valid when it is set. The set keyword, the property name, and the function declaration are used to define setters.

Lets take an example;

let myObject = {
  myProperty: 'value',
  set myProperty(value) {
    if (value === 'valid value') {
      this.myProperty = value;
    }
  }
};
Enter fullscreen mode Exit fullscreen mode

set myProperty(value) { ... } To use a setter, you can assign a value to the property like you would any other property.

let myObject = {
  myProperty: 'value',
  set myProperty(value) {
    if (value === 'valid value') {
      this.myProperty = value;
    }
  }
};

myObject.myProperty = 'value';
Enter fullscreen mode Exit fullscreen mode

myObject.myProperty = 'value'; When you give a property a value, the setter function is called. The assigned value is supplied as an input to the setter.

let myObject = {
  myProperty: 'value',
  set myProperty(value) {
    if (value === 'valid value') {
      this.myProperty = value;
    }
  }
};

myObject.myProperty = 'value';
Enter fullscreen mode Exit fullscreen mode

myObject.myProperty = 'value'; Before the value is set, you can do any validation or change on it inside the setter.

let myObject = {
  myProperty: 'value',
  set myProperty(value) {
    if (value === 'valid value') {
      this.myProperty = value;
    }
  }
};

myObject.myProperty = 'value';
console.log(myObject.myProperty);
Enter fullscreen mode Exit fullscreen mode

myObject.myProperty = 'value'; myObject.myProperty // 'value' Setters are helpful for making sure values are always valid and for modifying values before setting them if needed.

Neon image

Resources for building AI applications with Neon Postgres 🤖

Core concepts, starter applications, framework integrations, and deployment guides. Use these resources to build applications like RAG chatbots, semantic search engines, or custom AI tools.

Explore AI Tools →

Top comments (0)

Jetbrains image

Build Secure, Ship Fast

Discover best practices to secure CI/CD without slowing down your pipeline.

Read more

👋 Kindness is contagious

Dive into this thoughtful article, cherished within the supportive DEV Community. Coders of every background are encouraged to share and grow our collective expertise.

A genuine "thank you" can brighten someone’s day—drop your appreciation in the comments below!

On DEV, sharing knowledge smooths our journey and strengthens our community bonds. Found value here? A quick thank you to the author makes a big difference.

Okay