We did not explicitly mention this, but we've been discussing a concept called object-oriented programming. It is a programming paradigm where we use objects to create everything. Under this paradigm, our program will be divided into reusable pieces in the form of objects.
However, it is not yet time for us to discuss this concept in detail, because there are many things we have to talk about first. For this lesson, we'll be focusing on the getters and setters. They are special properties inside of an object, which are in charge of getting and setting a property value.
Getters
Getters are created with the keyword get, and they are defined like methods.
1let user = {
2 firstName: "John",
3 lastName: "Doe",
4 role: "Visitor",
5 get fullName() {
6 return `${this.firstName} ${this.lastName}`;
7 },
8};However, to external programs, they act like properties, and should be accessed like properties.
1console.log(user.fullName);1John DoeIf you try to access them as a method, JavaScript will return an error.
1console.log(user.fullName());1/Users/. . ./index.js:10
2console.log(user.fullName());
3 ^
4
5TypeError: user.fullName is not a function
6 at Object.<anonymous> (/Users/. . ./index.js:10:18)
7 . . .
8
9Node.js v21.6.0Setters
Setters are created with the keyword set. As the name suggests, they are used to set property values.
1let user = {
2 firstName: "John",
3 lastName: "Doe",
4 role: "Visitor",
5 get fullName() {
6 return `${this.firstName} ${this.lastName}`;
7 },
8
9 set fullName(value) {
10 [this.firstName, this.lastName] = value.split(" ");
11 },
12};They are also accessed as a property, not a method.
1user.fullName = "Alice Cooper";The string "Alice Cooper" will be passed to fullName(value) as its value.
value.split(" ") will split the string at the space character (" ") and return an array. The first item in the array will be assigned to this.firstName, and the second item in the array will be assigned to this.lastName.
1let user = {
2 firstName: "John",
3 lastName: "Doe",
4 role: "Visitor",
5 get fullName() {
6 return `${this.firstName} ${this.lastName}`;
7 },
8
9 set fullName(value) {
10 [this.firstName, this.lastName] = value.split(" ");
11 },
12};
13
14console.log(user.fullName);
15
16user.fullName = "Alice Cooper";
17
18console.log(user.fullName);1John Doe
2Alice CooperThey are properties, not methods
There are two types of properties in objects, data properties and accessor properties. The data properties are used to store information, such as the firstName, lastName, and role properties in our previous examples.
The accessor properties are the getters and setters. They are used to get or set one or more properties. Even though they are defined like a method, they are not methods. To external programs, they are just regular properties.