- typeof
- Try it
- Syntax
- Parameters
- Description
- Examples
- Basic usage
- typeof null
- Using new operator
- Need for parentheses in syntax
- Interaction with undeclared and uninitialized variables
- Exceptional behavior of document.all
- Custom method that gets a more specific type
- Specifications
- Browser compatibility
- See also
- Context👀
- Why the null did you even do that? 🤷♂️
- The source code of the very early version of JavaScript Engine and introduction of the «necessary evil» 😈
- It is just another else if , let’s fix that 🚒
- What’s present today under the hood 🕵️
- CONCLUSION ✏️
typeof
The typeof operator returns a string indicating the type of the operand’s value.
Try it
Syntax
Parameters
An expression representing the object or primitive whose type is to be returned.
Description
The following table summarizes the possible return values of typeof . For more information about types and primitives, see also the JavaScript data structure page.
Type | Result |
---|---|
Undefined | «undefined» |
Null | «object» (reason) |
Boolean | «boolean» |
Number | «number» |
BigInt | «bigint» |
String | «string» |
Symbol | «symbol» |
Function (implements [[Call]] in ECMA-262 terms; classes are functions as well) | «function» |
Any other object | «object» |
This list of values is exhaustive. No spec-compliant engines are reported to produce (or had historically produced) values other than those listed.
Examples
Basic usage
// Numbers typeof 37 === "number"; typeof 3.14 === "number"; typeof 42 === "number"; typeof Math.LN2 === "number"; typeof Infinity === "number"; typeof NaN === "number"; // Despite being "Not-A-Number" typeof Number("1") === "number"; // Number tries to parse things into numbers typeof Number("shoe") === "number"; // including values that cannot be type coerced to a number typeof 42n === "bigint"; // Strings typeof "" === "string"; typeof "bla" === "string"; typeof `template literal` === "string"; typeof "1" === "string"; // note that a number within a string is still typeof string typeof typeof 1 === "string"; // typeof always returns a string typeof String(1) === "string"; // String converts anything into a string, safer than toString // Booleans typeof true === "boolean"; typeof false === "boolean"; typeof Boolean(1) === "boolean"; // Boolean() will convert values based on if they're truthy or falsy typeof !!1 === "boolean"; // two calls of the ! (logical NOT) operator are equivalent to Boolean() // Symbols typeof Symbol() === "symbol"; typeof Symbol("foo") === "symbol"; typeof Symbol.iterator === "symbol"; // Undefined typeof undefined === "undefined"; typeof declaredButUndefinedVariable === "undefined"; typeof undeclaredVariable === "undefined"; // Objects typeof a: 1 > === "object"; // use Array.isArray or Object.prototype.toString.call // to differentiate regular objects from arrays typeof [1, 2, 4] === "object"; typeof new Date() === "object"; typeof /regex/ === "object"; // The following are confusing, dangerous, and wasteful. Avoid them. typeof new Boolean(true) === "object"; typeof new Number(1) === "object"; typeof new String("abc") === "object"; // Functions typeof function () > === "function"; typeof class C > === "function"; typeof Math.sin === "function";
typeof null
// This stands since the beginning of JavaScript typeof null === "object";
In the first implementation of JavaScript, JavaScript values were represented as a type tag and a value. The type tag for objects was 0 . null was represented as the NULL pointer ( 0x00 in most platforms). Consequently, null had 0 as type tag, hence the typeof return value «object» . (reference)
A fix was proposed for ECMAScript (via an opt-in), but was rejected. It would have resulted in typeof null === «null» .
Using new operator
All constructor functions called with new will return non-primitives ( «object» or «function» ). Most return objects, with the notable exception being Function , which returns a function.
const str = new String("String"); const num = new Number(100); typeof str; // "object" typeof num; // "object" const func = new Function(); typeof func; // "function"
Need for parentheses in syntax
The typeof operator has higher precedence than binary operators like addition ( + ). Therefore, parentheses are needed to evaluate the type of an addition result.
// Parentheses can be used for determining the data type of expressions. const someData = 99; typeof someData + " Wisen"; // "number Wisen" typeof (someData + " Wisen"); // "string"
Interaction with undeclared and uninitialized variables
typeof is generally always guaranteed to return a string for any operand it is supplied with. Even with undeclared identifiers, typeof will return «undefined» instead of throwing an error.
typeof undeclaredVariable; // "undefined"
However, using typeof on lexical declarations ( let const , and class ) in the same block before the line of declaration will throw a ReferenceError . Block scoped variables are in a temporal dead zone from the start of the block until the initialization is processed, during which it will throw an error if accessed.
typeof newLetVariable; // ReferenceError typeof newConstVariable; // ReferenceError typeof newClass; // ReferenceError let newLetVariable; const newConstVariable = "hello"; class newClass >
Exceptional behavior of document.all
All current browsers expose a non-standard host object document.all with type undefined .
typeof document.all === "undefined";
Although document.all is also falsy and loosely equal to undefined , it is not undefined . The case of document.all having type «undefined» is classified in the web standards as a «willful violation» of the original ECMAScript standard for web compatibility.
Custom method that gets a more specific type
typeof is very useful, but it’s not as versatile as might be required. For example, typeof [] is «object» , as well as typeof new Date() , typeof /abc/ , etc.
For greater specificity in checking types, here we present a custom type(value) function, which mostly mimics the behavior of typeof , but for non-primitives (i.e. objects and functions), it returns a more granular type name where possible.
function type(value) if (value === null) return "null"; > const baseType = typeof value; // Primitive types if (!["object", "function"].includes(baseType)) return baseType; > // Symbol.toStringTag often specifies the "display name" of the // object's class. It's used in Object.prototype.toString(). const tag = value[Symbol.toStringTag]; if (typeof tag === "string") return tag; > // If it's a function whose source code starts with the "class" keyword if ( baseType === "function" && Function.prototype.toString.call(value).startsWith("class") ) return "class"; > // The name of the constructor; for example `Array`, `GeneratorFunction`, // `Number`, `String`, `Boolean` or `MyCustomClass` const className = value.constructor.name; if (typeof className === "string" && className !== "") return className; > // At this point there's no robust way to get the type of value, // so we use the base implementation. return baseType; >
For checking potentially non-existent variables that would otherwise throw a ReferenceError , use typeof nonExistentVar === «undefined» because this behavior cannot be mimicked with custom code.
Specifications
Browser compatibility
BCD tables only load in the browser
See also
Context👀
Let us run the following code in console and see what each of them returns for `Primitive` types:
typeof "Sourav" // "string" typeof 1 // "number" typeof 1n // "bigint" typeof true // "boolean" typeof undefined // "undefined" typeof Symbol('Debnath') // "symbol" typeof null // "object"
Wait a minute. what?? Why null is of type «object» when it should be of type «null»? What happened to the definition which we were considering ‘holy’ and as the single source of truth?
Well, this is what this blog is all about! We will explore the reason together, let us begin!
Why the null did you even do that? 🤷♂️
Obviously, this might be the first question which most of you would have been thinking!
Did the JavaScript God (Yes, [Brendan Eich](https://disqus.com/by/brendaneich/) 🙏) himself did this intentionally? Well of course not, we couldn’t have asked more given the time period he had in hand (10 days) to design a new language!
When you perform tasks or deliver your deliverables in a hurry, it is expected that your code might be shipped with bug(s). In modern days, we follow a model for Software Development where we have a dedicated phase for QA which was not the case in 1995-1996 in Netscape Communications. It was not called JavaScript either, it was [LiveScript](https://www.youtube.com/watch?v=v2ifWcnQs6M) — that’s a discussion for another day!.
The source code of the very early version of JavaScript Engine and introduction of the «necessary evil» 😈
In the early version, values were stored in 32-bit units, which consisted of a small type tag (1–3 bits) and the actual data of the value. The type tags were stored in the lower bits of the units. There were five of them:
- 000: object. The data is a reference to an object.
- 1: int. The data is a 31 bit signed integer.
- 010: double. The data is a reference to a double floating point number.
- 100: string. The data is a reference to a string.
- 110: boolean. The data is a boolean.
That is, the lowest bit was either one, then the type tag was only one bit long. Or it was zero, then the type tag was three bits in length, providing two additional bits, for four types.
There was a special value:
null (JSVAL_NULL) was the machine code NULL pointer. Or: an object type tag plus a reference that is zero.
**Let’s look at the classic JavaScript Source code used in the ’96 in SpiderMonkey courtesy: @evilpies: https://twitter.com/evilpies/
JS_PUBLIC_API(JSType) JS_TypeOfValue(JSContext *cx, jsval v) < JSType type = JSTYPE_VOID; JSObject *obj; JSObjectOps *ops; JSClass *clasp; CHECK_REQUEST(cx); if (JSVAL_IS_VOID(v)) < // (1) type = JSTYPE_VOID; >else if (JSVAL_IS_OBJECT(v)) < // (2) obj = JSVAL_TO_OBJECT(v); if (obj && (ops = obj->map->ops, ops == &js_ObjectOps ? (clasp = OBJ_GET_CLASS(cx, obj), clasp->call || clasp == &js_FunctionClass) // (3,4) : ops->call != 0)) < // (3) type = JSTYPE_FUNCTION; >else < type = JSTYPE_OBJECT; >> else if (JSVAL_IS_NUMBER(v)) < type = JSTYPE_NUMBER; >else if (JSVAL_IS_STRING(v)) < type = JSTYPE_STRING; >else if (JSVAL_IS_BOOLEAN(v)) < type = JSTYPE_BOOLEAN; >return type; >
#define JSVAL_IS_VOID(v) ((v) == JSVAL_VOID)
- The next check (2) is whether the value has an object tag. Now for null , It examined its type tag and the type tag said “object” and it went inside the else if .
- If it additionally is either callable (3) or its internal property [[Class]] marks it as a function (4) then v is a function. Otherwise, it is an object. This is the result that is produced by typeof null.
- On top of that, we do not even have a separate check for type null , which was easy to implement by a C macro similar to VOID but as I described above,
When you perform tasks or deliver your deliverables in a hurry, it is expected that your code might be shipped with bug(s).
It is just another else if , let’s fix that 🚒
**You can, but you should not!**
A proposal was given In ES5.1 to fix the typeof operator and it was implemented under the harmony version in V8 but it ended up breaking a lot of existing sites and this proposal had been rejected, described as,
In the spirit of One JavaScript this is not feasible.
What’s present today under the hood 🕵️
Things have moved to CPP and the code present today is pretty straight forward with the known bug of typeof null ; as Mr. JavaScript said in one of the proposal discussions,
«I think it is too late to fix typeof. The change proposed for typeof null will break existing code.»
Let’s look at the implementation of typeof in the CPP Interpreter in Mozilla from searchfox:
JSType js::TypeOfValue(const Value& v) < switch (v.type()) < case ValueType::Double: case ValueType::Int32: return JSTYPE_NUMBER; case ValueType::String: return JSTYPE_STRING; case ValueType::Null: // 😈 😈 😈 return JSTYPE_OBJECT; // 😈 😈 😈 case ValueType::Undefined: return JSTYPE_UNDEFINED; case ValueType::Object: return TypeOfObject(&v.toObject()); case ValueType::Boolean: return JSTYPE_BOOLEAN; case ValueType::BigInt: return JSTYPE_BIGINT; case ValueType::Symbol: return JSTYPE_SYMBOL; case ValueType::Magic: case ValueType::PrivateGCThing: break; >ReportBadValueTypeAndCrash(v); >
Where JSTYPE_OBJECT is a cpp Enum which could be observed here :
/* Result of typeof operator enumeration. */ enum JSType < JSTYPE_UNDEFINED, /* undefined */ JSTYPE_OBJECT, /* object */ JSTYPE_FUNCTION, /* function */ JSTYPE_STRING, /* string */ JSTYPE_NUMBER, /* number */ JSTYPE_BOOLEAN, /* boolean */ JSTYPE_NULL, /* null */ JSTYPE_SYMBOL, /* symbol */ JSTYPE_BIGINT, /* BigInt */ JSTYPE_LIMIT >;
CONCLUSION ✏️
Below the surface of the machine, the program moves. Without effort, it expands and contracts. In great harmony, electrons scatter and regroup. The forms on the monitor are but ripples on the water. The essence stays invisibly below.» — Master Yuan-Ma, The Book of Programming
We deal with a lot of stuff daily while developing a feature or a product but we might not actually explore those lines we write in detail to find why something happens. This blog is just a theoretical exploration of one such kind😇
Now, after all the C and CPP, let’s bring our thoughts down to JS! You might ask, isn’t typeof([]) === «object» a bug?
The answer is: No, it is not a bug.
Arrays aren’t primitive, so they are objects! So are dates, and everything not on the «primitive list».
Unlike null, they’re telling the truth!