1. typeof
typeof operator returns a string representing the type of the uncalculated operand
How to use it is as follows:
typeof operand typeof(operand)
operand represents an expression of an object or original value, whose type will be returned
Give an example
typeof 1 // 'number'
typeof '1' // 'string'
typeof undefined // 'undefined'
typeof true // 'boolean'
typeof Symbol() // 'symbol'
typeof null // 'object'
typeof [] // 'object'
typeof {} // 'object'
typeof console // 'object'
typeof // 'function'
From the above example, the first 6 are all basic data types. Although typeof null is an object, this is just a long-standing bug in JavaScript, which does not mean that null is a reference data type, and null itself is not an object.
Therefore, null returns a problematic result after typeof and cannot be used as a way to judge null. If you need to determine whether it is null in the if statement, just use ===null to judge
At the same time, you can find reference type data. If you use typeof to judge, except for the function that will be recognized, the rest will output object
If we want to determine whether a variable exists, we can use typeof: (If(a) cannot be used. If a is not declared, an error will be reported)
if(typeof a != 'undefined'){
//The variable exists}
2. instanceof
The instanceof operator is used to detect whether the prototype attribute of the constructor appears on the prototype chain of an instance object.
Use as follows:
object instanceof constructor
object is an instance object, constructor is a constructor
The constructor can instance the object through new, instanceof can determine whether this object is the object generated by the previous constructor.
// Define the build functionlet Car = function() {}
let benz = new Car()
benz instanceof Car // true
let car = new String('xxx')
car instanceof String // true
let str = 'xxx'
str instanceof String // false
For the implementation principle of instanceof, please refer to the following:
function myInstanceof(left, right) {
// Here we first use typeof to determine the basic data type. If so, return false directly if(typeof left !== 'object' || left === null) return false;
// getProtypeOf is an API that comes with the Object object, which can get the prototype object that can get parameters let proto = (left);
while(true) {
if(proto === null) return false;
if(proto === ) return true;//Finish the same prototype object and return true proto = (proto);
}
}
That is, follow the prototype chain to search until the same prototype object is found, return true, otherwise it is false
3. Difference
Typeof and instanceof are both methods to judge data types, the differences are as follows:
- typeof will return the basic type of a variable, instanceof returns a boolean value
- instanceof can accurately judge complex reference data types, but cannot correctly judge basic data types
- Typeof also has disadvantages. Although it can judge the basic data type (except null), among the reference data types, except for the function type, no other data type can be judged.
1. The value returned for objects, arrays, and null is object. For example, the values returned by typeof(window), typeof(document), and typeof(null) are all objects.
2. For function type, the returned value is function. For example: typeof(eval), typeof(Date) returns all functions.
It can be seen that both of the above methods have disadvantages and cannot meet the needs of all scenarios.
If you need to detect the data type in general, you can use and call this method to return a string with the format "[object Xxx]" uniformly
as follows
({}) // "[object Object]"
({}) // Same result, plus call is OK(1) // "[object Number]"
('1') // "[object String]"
(true) // "[object Boolean]"
(function(){}) // "[object Function]"
(null) //"[object Null]"
(undefined) //"[object Undefined]"
(/123/g) //"[object RegExp]"
(new Date()) //"[object Date]"
([]) //"[object Array]"
(document) //"[object HTMLDocument]"
(window) //"[object Window]"
After understanding the basic usage of toString, we will implement a globally common data type judgment method.
function getType(obj){
let type = typeof obj;
if (type !== "object") { // Make typeof judgment first. If it is the basic data type, return directly return type;
}
// For the typeof return result is object, then make the following judgment and return the result regularly return (obj).replace(/^\[object (\S+)\]$/, '$1');
}
Use as follows
getType([]) // "Array" typeof [] is object, so toString returnsgetType('123') // "string" typeof directly returnsgetType(window) // "Window" toString returnsgetType(null) // The initial letter "Null" is capitalized, typeof null is object, and it needs to be judged by toStringgetType(undefined) // "undefined" typeof returns directlygetType() // "undefined" typeof returns directlygetType(function(){}) // "function" typeof can be judged, so the first letter is lowercasegetType(/123/g) //"RegExp" toString returns
This is the article about how rookies can understand the difference between typeof and instanceof in js. This is all about this article. For more related contents of typeof and instanceof in js, please search for my previous articles or continue to browse the related articles below. I hope everyone will support me in the future!