JavaScript GETTERS & SETTERS are awesome!!! 📐

// getter = special method that makes a property readable
// setter = special method that makes a property writeable
// validate and modify a value when reading/writing a property
00:00:00 intro
00:01:42 example 1 setters
00:04:10 example 1 getters
00:07:16 example 2
00:08:31 example 2 setters
00:11:15 example 2 getters
00:12:48 conclusion

[@BroCodez]

// ---------- EXAMPLE 1 ----------
class Rectangle{
constructor(width, height){
this.width = width;
this.height = height;
}
set width(newWidth){
if(newWidth > 0){
this._width = newWidth;
}
else{
console.error("Width must be a positive number");
}
}
set height(newHeight){
if(newHeight > 0){
this._height = newHeight;
}
else{
console.error("Height must be a positive number");
}
}
get width(){
return `${this._width.toFixed(1)}cm`;
}

get height(){
return `${this._height.toFixed(1)}cm`;
}
get area(){
return `${(this._width * this._height).toFixed(1)}cm`;
}
}
const rectangle = new Rectangle(2, 3);
console.log(rectangle.width);
console.log(rectangle.height);
console.log(rectangle.area);
// ---------- EXAMPLE 2 ----------
class Person{
constructor(firstName, lastName, age){
this.firstName = firstName;
this.lastName = lastName;
this.age = age;
}
set firstName(newFirstName){
if(typeof newFirstName === "string" && newFirstName.length > 0){
this._firstName = newFirstName;
}
else{
console.error("First name must be a non-empty string");
}
}
set lastName(newLastName){
if(typeof newLastName === "string" && newLastName.length > 0){
this._lastName = newLastName;
}
else{
console.error("Last name must be a non-empty string");
}
}
set age(newAge){
if(typeof newAge === "number" && newAge >= 0){
this._age = newAge;
}
else{
console.error("Age must be a non-negative number");
}
}

get firstName(){
return this._firstName;
}
get lastName(){
return this._lastName;
}
get fullName(){
return this._firstName + " " + this._lastName;
}
get age(){
return this._age;
}
}
const person = new Person("Spongebob", "Squarepants", 30);
console.log(person.firstName);
console.log(person.lastName);
console.log(person.fullName);
console.log(person.age);

[@Loki_chan]

txs bro for these lessons

[@Sernik_z_rodzynkamii]

What a great explanation! I am doing the Codecademy course recently and their examples of getters and setters weren't that clear to me.

[@antcannon]

420 69’s parents was living a wild life. The birth certificate did not have any setters and getters.
Great video. This is going to help me tackle more coding challenges and create cleaner code.

[@vanta6lack]

As said by previous commentators, this is literally the best explanation that I've come across so far and Getters and Setters do seem to be quite extraordinary. Huge thank you!

[@yunusdurdygulyyew9270]

That's the best explanation that I could find online. Thank you for the work you do!

[@shafiulAlamShafi]

Thanks for explaining!!

[@matheusbalbinot2469]

best explanation i've ever seen here on youtube.
thank u so much bro!!!

[@cryssias]

this playlist has been soooo helpful! thank you for the amazing free content. hugs from brazil ✨

[@tonytodd7011]

Great explanation, thanks Bro!

[@Carrymejane]

You are live saver bro ❤

[@khalidmadaraobito8651]

Perfect💥

[@user-qv2sh6wm6j]

Thanks Bro!!

[@hunin27]

thanks bro. would you mind doing a javascript project with all the things we learned? At least i could try it myself as well before seeing how you do it

[@baxti7]

perfect

[@helioobianchi]

11:30 once you make a setter for an attribute, does a getter become necessary to access it (vice-versa maybe)? is it why it's printing 'undefined'?
looks like I have some reading and testing to do

[@maenam4520]

Greet content 👌
Why should the age to be >= in the Person class since
True >= 0 //true
Just use >= 1
True >= 1 // false

[@helioobianchi]

wait, did Javascript become OOP?
edit: no. after some googling, I learned that the OOP features introduced in ES6 are syntax sugar. Javascript is classified as a prototype-based procedural language (it's neither object oriented nor functional 😮) . so it's not meant to implement the known OOP design patterns. but it's useful nevertheless.
can't wait to learn all those features so I can start writing some type related bugs 😊

[@baxti7]

If you do an intermediate web project in html and css🙂☺

[@Mayukh04]

nothing happens with just html css tech is advancing Javascript,React JS,Next JS etc are crucial to build intermediate and advanced projects

[@mixxxer]

What is the benefit of doing get area() versus a method on the class like getArea()?

[@liammcgarrigle]

because instead of doing ‘console.log( rectangle.getArea() )’ you can do ‘console.log( rectangle.area )’
so it is like accessing a property and not a method, even though it is like a method is really getting the data under the hood

[@maenam4520]

Great job man! 👏👏 that is really awesome and simple explanation straight to my understanding.
Big thanks 🫶

[@gergvakapoharat4501]

Hi, are getters/setters exportable? I mean if you export myObject.myGetter it exports the value, not the getter itself, so if it changes later, the value won't follow in the export, or copy, etc. thank you

[@STR-DP]

37😁

[@michaelwinkler9257]

1er

[@Azoraqua]

Typescript be like..

[@vanta6lack]

420, 69 and pizza. Really? ))