In JavaScript development, I was asked: What is the difference between null and undefined?
It’s difficult to answer at the moment, especially undefined, because it involves the implementation principle of undefined. So, after thinking about it carefully, I wrote this article and asked you all for help.
As we all know: null == undefined
But: null !== undefined
So what is the difference between the two?
Please listen to my eloquent talk...
null
This is an object, but empty. Because it is an object, typeof null returns 'object' .
null is a JavaScript reserved keyword.
Whennull participates in numerical operations, its value will be automatically converted to 0. Therefore, the following expression will obtain the correct value after calculation:
Expression: 123 null Result value: 123
Expression: 123 * null Result value: 0
undefined
undefined is a special property of the global object (window), and its value is undefined. But typeof undefined returns 'undefined' .
Although undefined has a special meaning, it is indeed a property, and it is a property of the global object (window). Please look at the code below:
alert('undefined' in window); //Output: true
alert(undefined in window); //Output: true
var anObj = {};
alert('undefined' in anObj); //Output: false
It can be seen from this that undefined is a property of the window object, but it is not a property of the anObj object.
Note: Although undefined is an attribute with special meaning, it is not a reserved keyword in JavaScript.
When undefined participates in any numerical calculation, the result must be NaN.
By the way, NaN is another special property of the global object (window), and so is Infinity. None of these special attributes are reserved keywords for JavaScript!
Improve undefined performance
When we use the undefined value in the program, we actually use the undefined property of the window object.
Similarly, when we define a variable but do not assign it an initial value, for example:
var aValue;
At this time, JavaScript will set its initial value to a reference to the window.undefined property during so-called precompilation,
So, when we compare a variable or value with undefined, it is actually compared with the undefined property of the window object. During this comparison process, JavaScript will search for the property named 'undefined' of the window object, and then compare whether the reference pointers of the two operands are the same.
Since the window object has many attribute values, it will take time to search for the undefined attribute of the window object in each comparison with undefined. This can be a performance problem in functions that require frequent comparisons to undefined. Therefore, in this case, we can define a local undefined variable ourselves to speed up the comparison of undefined. For example:
function anyFunc()
{
var undefined; //Customized local undefined variable
if(x == undefined) //Reference comparison on scope
while(y != undefined) //Reference comparison on scope
};
Among them, when defining an undefined local variable, its initial value will be a reference to the window.undefined property value. The newly defined local undefined variable exists in the scope of the function. In subsequent comparison operations, there is no change in the way the JavaScript code is written, but the comparison speed is very fast. Because the number of variables in the scope will be far less than the properties of the window object, the speed of searching for variables will be greatly improved.
This is why many front-end JS frameworks often define a local undefined variable themselves!