Working with Static Properties on a Class
Classes are syntactic sugar over functions and functions are also referred to as "callable" objects. So it is possible to treat a function like an object and give them key / value properties like objects. The static keyword gives us the ability to assign a key / value property to a class itself, not an instance of that class. This lesson will walk you through using the static keyword and even show how to replicate it with regular functions.
Instructor: [00:00] The static keyword sets the property to the class itself. It does not go on the [inaudible] object, but again on this class. They cannot be called on instances of the class. If you use the new keyword against this, you cannot easily access the static properties.
[00:16] If we knew [inaudible] rectangle, we have no access to the callRectangle function. As you can see, we're just going to get an error. What's neat about static properties is that they can be called by the super keyword and subclass components.
[00:28] Here, we have a square class that's extending rectangle. It itself also has a static property of WhoAmI as a function. We're going to return a string, "Hello all," plus super.callRectangle.
[00:39] When we console.log calling the static WhoAmI method property, we're going to see "Hello all. Hello world." As we can see, we're concatenating our return string from the static method WhoAmI on the square class with Rectangle's callRectangle method.
[00:56] If you wanted to see this static keyword recreated using a regular function and not a class, all we need to do is convert this class into a function and give the function a property called callRectangle and assigning it a function.
[01:09] As you can see, a console.log gives us the same result of "Hello, all. Hello, world." Again, this is because we are using just a regular function and giving it a property of callRectangle that lives directly on the function like the static keyword represents, and it has a function that returns the string "Hello, world."
So what if I put the keyword this inside static function ?
what will be the execute scope of it ?
So what if I put the keyword
thisinside static function ? what will be the execute scope of it ?
Hey doug check out the lessons within this course on using this. It depends on how the static property is called... this is determined at runtime. In this scenario, this is the Square class.
class Square {
static whoAmI(){
return this
}
}
Square.whoAmI()
Sorry, I spelt your name wrong! Meant to put dung!
"They cannot be called on instances of the class. If you use the new keyword against this, you cannot easily access the static properties." - this could be useful for private methods and props (?) e.g. what problem does this help us solve?
Interestingly enough that
extendshas worked just fine withfunctions and not withclasses only. Good to know:)