When discussing primitive data types in JavaScript, most people know the basics from String, Number to Boolean. These primitive types are quite simple and behave in line with common sense. However, this article will focus more on the unique primitive data types Null and Undefined, what makes them so similar but plausible.
1. Understand null and undefined
In JavaScript, null is a literal and a keyword in the language, used to represent unrecognized object values. In other words, this is used to mean "no value", but you can decide when to get the expected value.
Although similar, undefined actually represents a non-existence of a value, i.e. you have something missing. Both are completely immutable, without attributes and methods, and cannot assign values to their attributes. In fact, when you try to access or define a property of null and undefined, a type error (TypeError) will be raised.
Boolean values that have no value representing are false, which means they will be evaluated as false in the conditional context, such as if statements. Use the equality operator (==) to compare these two values with other false values, and they are not equal to other than themselves:
null == 0; // false undefined == ""; // false null == false; // false undefined == false; // false null == undefined; // true
Despite this, and with other similarities, null and undefined are not equivalent. Each as the only member of its unique type, undefined is the Undefined type and null is the Object type. Comparison of these two values using the convergence operator (===), which requires that both types and values are equal, and the following proves this:
null === undefined; //false typeof null; //"object" typeof undefined; //"undefined"
The above description: null This is an object, but it is empty. And null is JavaScript reserved keywords.
In addition, when null participates in numerical operations, its value will be automatically converted to 0. Therefore, the following expression will obtain the correct value after calculating:
123 + null; //123 123 * null; //0
undefined is a special property of a global object (window) whose 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 a global object (window). Please see the following code:
alert('undefined' in window);//Output: truevar anObj = {};
alert('undefined' in anObj); //Output: false
From this we can see that undefined is an attribute of the window object, but it is not an attribute of the anObj object.
Notice:
- 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. Just to put it simply, NaN is another special property of the global object (window), so is Infinity. None of these special attributes are reserved keywords for JavaScript!
- When verifying that a value or an object is null, you need to use "===" to determine. If you only use "==", it cannot be determined whether it is null or undefined.
2. Undefined situation
There are many ways to generate a code with an undefined value. It is usually encountered when trying to access a value that does not exist. In this case, in a dynamic weak-type language like JavaScript, only an undefined value will be returned by default, rather than rising to an error.
1. Any variable that does not provide an initial value when declaring a variable will have a default value that is undefined:
var foo; // The default value is undefined
2. When trying to access an object property or array item that does not exist, an undefined value is returned:
var array = [1, 2, 3]; var foo = ; // The foo attribute does not exist, returns undefinedvar item = array[5]; // There is no entry in the array with index of 5, return undefined
3. If the function return statement is omitted, or the return statement returns undefined without any parameters:
var value = (function(){
})(); // Return undefinedvar value1 = (function(){
return;
})(); // Return undefined
4. When calling the function, the parameter that should be provided is not provided, and the parameter is equal to undefined
function f(x){
(x)
}
f(); // undefined
Finally, undefined is a predefined global variable (unlike the null keyword) initialized to an undefined value:
'undefined' in window; // true
In ECMAScript 5, this variable is read-only, and it was not the case before.
3. Use cases of null
The use case of null is the main aspect that sets him apart, because unlike undefined, null is considered more useful. This is exactly why the typeof operator returns "object" when it acts on a null value. The initial reason is that it is still, usually used as an expectation of an empty object, like a placeholder. This behavior of typeof has been identified as a bug, although a correction has been proposed, and this has remained unchanged for post-compatibility purposes.
Generally speaking, if you need to specify an invariant value to a variable or property, pass it to a function, or return null from a function, null is almost always the best choice. In short, JavaScript uses undefined and programmers should use null.
Another viable use case for null is also considered good practice to explicitly specify variables as invalid (object=null) when a reference is no longer required. By allocating null values, effectively clearing references and assuming that the object does not reference other code, specifying garbage collection, ensuring memory recycling.
4. Improve undefined performance
When we use undefined values in our program, we are actually using the undefined property of the window object. Similarly, when we define a variable but do not assign its initial value, for example:
var aValue;
At this time, JavaScript will set its initial value to a reference to the attribute at the so-called precompilation time, so when we compare a variable or value with an undefined, it is actually comparing with the undefined attribute of the window object. During this comparison, 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 a lot of property values, it takes time to search for the undefined property of the window object in every comparison with undefined. This can be a performance problem in functions that require frequent comparisons with undefined. Therefore, in this case, we can define a local undefined variable by ourselves to speed up the comparison of undefined. For example:
function anyFunc() {
var undefined;
//Customize local undefined variable if(x == undefined)
//Comparison of references on scope while(y != undefined)
//Comparison of references on scope};
Where, when undefined local variables are defined, their initial value will be a reference to the property value. The newly defined local undefined variable exists on the scope of the function. In the subsequent comparison operations, the way the JavaScript code is written has not changed at all, but the comparison speed is very fast. Because the number of variables in scope will be much smaller 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!
The above is all about this article, I hope it will be helpful to everyone's learning.