erral)
Creating maintainable JavaScript code is important if want to keep using the code.
In this article, we’ll look at the basics of creating maintainable JavaScript code by looking at how to check for various kinds of data.
typeof and null
The typeof operator returns 'object' if the operand is null .
This is one primitive value that we can’t use typeof to check for.
Comparing against null doesn’t give us enough information generally.
However, we can check for null if we use the === and !== operators.
For instance, we can write:
const element = document.querySelector("div");
if (element !== null) {
element.className = "found";
}
to check if an element with the given selector exists.
querySelector returns null if the element doesn’t exist.
So we can use the !== or === operator to check for the value.
Detecting Reference Values
We can’t use the typeof operator to check for objects.
Therefore, we need another way to check for them.
Objects include object literals and objects created from constructors like Object , Array , Date and Error .
If we use the typeof operator, it always returns 'object' .
This means it won’t be of much use to us.
typeof null also returns 'object' so it’s also not useful for checking for null .
Instead, we can use the instanceof operator to detect values of a particular reference type.
The general syntax of instanceof is:
value instanceof constructor
where value is the value we’re checking for.
And constructor is the constructor that we want to check whether value os created from.
For example, we can use it to detect a Date instance by writing:
if (date instanceof Date) {
console.log(date.getFullYear());
}
instanceof not only checks the constructor used to create the object.
It also checks for the constructor up the prototype chain.
Since almost all objects inherits from Object , date instanceof Object also returns true .
Therefore, we can’t use value instanceof Object to check for a particular type of object.
The instanceof operator also works with custom types that we defined ourselves.
For instance, we can write:
function Person(name) {
this.name = name;
}
const jane = new Person("jane");
console.log(jane instanceof Object);
console.log(jane instanceof Person);
Then both console logs will be true .
The first one is true because jane inherits from Object.prototype .
And the 2nd one is true because jane is created from the Person constructor.
The instanceof operator is the only way to detect custom types in JavaScript.
However, it does have one limitation.
If we pass one object from one frame to another.
If we have:
frameAPerson instanceof frameAPerson
then that returns true .
But if we have:
frameAPerson instanceof frameBPerson
then that returns false .
Each frame has its own copy of Person and instanceof only considers the Person in the current frame.
This is the case even if they’re identical.
Conclusion
The instanceof operator lets us check for various kinds of object.
The only ones it can’t check are the ones passed from different frames.
