JavaScript GETTERS & SETTERS are awesome!!! 📐

[@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.

[@angeljoachin1962]

I came for the same reason, how has been your journey??

[@yunusdurdygulyyew9270]

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

[@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!

[@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.

[@cryssias]

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

[@matheusbalbinot2469]

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

[@jayboy6430]

wow fantastic breakdown

[@user-rj7ez2qy4d]

hello I needed to know about getters and setters today and you upload the video in time, thanks🙂

[@shafiulAlamShafi]

Thanks for explaining!!

[@piotrmazgaj]

This is my seal. I have watched the entire video, understood it, and I can explain it in my own words, thus I have gained knowledge. This is my seal.

[@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

[@Carrymejane]

You are live saver bro ❤

[@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

[@williamhu9567]

​@czel-za-oczyszinoju why does the "_age" property get set to whatever the "age" property was in the constructor? edit: if you give the constructor an invalid "age", it'll be undefined. looks like the setters are called when the constructor is. edit2: if you try using "age" instead of "_age" in the setter, it'll keep calling the setter recursively and stack overflow... kinda makes sense now.

[@khalidmadaraobito8651]

Perfect💥

[@tonytodd7011]

Great explanation, thanks Bro!

[@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 😊

[@maenam4520]

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

[@johnnyklash5883]

"Person(420, 69, "pizza")" sounds like a good Saturday night to me.😂

[@Rafael_Perez21]

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

[@SreesaSarma]

Thanks Bro!!

[@maenam4520]

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

[@baxti7]

perfect

[@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

[@Syuzaki1301]

@@liammcgarrigleto add to that. Usually it is differentiated between state and behaviour when creating properties/methods. Methods should perform or adhere to some kind of behaviour while standard properties allow access to some sort of "state" of the instantiated object. Since area would be a state value, it makes sense to access it using standard property accessing syntax thus a getter is used to make it more conform.

[@williamhu9567]

@@liammcgarrigle in python, "properties" are called "attributes" and this rectangle.area would be considered a "property". this is kind of messing with me haha...

[@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

[@STR-DP]

37😁

[@alcidesJoyable]

how did you know my name and age????? 420, 69, 'pizza' the third

[@michaelwinkler9257]

1er

[@Azoraqua]

Typescript be like..

[@vanta6lack]

420, 69 and pizza. Really? ))