Finding Variable Type in JavaScript
JavascriptJavascript Problem Overview
In Java, you can use instanceOf or getClass() on a variable to find out its type.
How do I find out a variable's type in JavaScript which isn't strongly-typed?
For example, how do I know if the bar is a Boolean or a Number, or a String?
function foo(bar) {
// what do I do here?
}
Javascript Solutions
Solution 1 - Javascript
Use typeof:
> typeof "foo"
"string"
> typeof true
"boolean"
> typeof 42
"number"
So you can do:
if(typeof bar === 'number') {
//whatever
}
Be careful though if you define these primitives with their object wrappers (which you should never do, use literals where ever possible):
> typeof new Boolean(false)
"object"
> typeof new String("foo")
"object"
> typeof new Number(42)
"object"
The type of an array is still object. Here you really need the instanceof operator.
Update:
Another interesting way is to examine the output of Object.prototype.toString:
> Object.prototype.toString.call([1,2,3])
"[object Array]"
> Object.prototype.toString.call("foo bar")
"[object String]"
> Object.prototype.toString.call(45)
"[object Number]"
> Object.prototype.toString.call(false)
"[object Boolean]"
> Object.prototype.toString.call(new String("foo bar"))
"[object String]"
> Object.prototype.toString.call(null)
"[object Null]"
> Object.prototype.toString.call(/123/)
"[object RegExp]"
> Object.prototype.toString.call(undefined)
"[object Undefined]"
With that you would not have to distinguish between primitive values and objects.
Solution 2 - Javascript
typeof is only good for returning the "primitive" types such as number, boolean, object, string and symbols. You can also use instanceof to test if an object is of a specific type.
function MyObj(prop) {
this.prop = prop;
}
var obj = new MyObj(10);
console.log(obj instanceof MyObj && obj instanceof Object); // outputs true
Solution 3 - Javascript
Using type:
// Numbers
typeof 37 === 'number';
typeof 3.14 === 'number';
typeof Math.LN2 === 'number';
typeof Infinity === 'number';
typeof NaN === 'number'; // Despite being "Not-A-Number"
typeof Number(1) === 'number'; // but never use this form!
// Strings
typeof "" === 'string';
typeof "bla" === 'string';
typeof (typeof 1) === 'string'; // typeof always return a string
typeof String("abc") === 'string'; // but never use this form!
// Booleans
typeof true === 'boolean';
typeof false === 'boolean';
typeof Boolean(true) === 'boolean'; // but never use this form!
// Undefined
typeof undefined === 'undefined';
typeof blabla === 'undefined'; // an undefined variable
// Objects
typeof {a:1} === 'object';
typeof [1, 2, 4] === 'object'; // use Array.isArray or Object.prototype.toString.call to differentiate regular objects from arrays
typeof new Date() === 'object';
typeof new Boolean(true) === 'object'; // this is confusing. Don't use!
typeof new Number(1) === 'object'; // this is confusing. Don't use!
typeof new String("abc") === 'object'; // this is confusing. Don't use!
// Functions
typeof function(){} === 'function';
typeof Math.sin === 'function';
Solution 4 - Javascript
In Javascript you can do that by using the typeof function
console.log(typeof bar);
Solution 5 - Javascript
To be a little more ECMAScript-5.1-precise than the other answers (some might say pedantic):
In JavaScript, variables (and properties) don't have types: values do. Further, there are only 6 types of values: Undefined, Null, Boolean, String, Number, and Object. (Technically, there are also 7 "specification types", but you can't store values of those types as properties of objects or values of variables--they are only used within the spec itself, to define how the language works. The values you can explicitly manipulate are of only the 6 types I listed.)
The spec uses the notation "Type(x)" when it wants to talk about "the type of x". This is only a notation used within the spec: it is not a feature of the language.
As other answers make clear, in practice you may well want to know more than the type of a value--particularly when the type is Object. Regardless, and for completeness, here is a simple JavaScript implementation of Type(x) as it is used in the spec:
function Type(x) {
if (x === null) {
return 'Null';
}
switch (typeof x) {
case 'undefined': return 'Undefined';
case 'boolean' : return 'Boolean';
case 'number' : return 'Number';
case 'string' : return 'String';
default : return 'Object';
}
}
Solution 6 - Javascript
I find it frustrating that typeof is so limited. Here’s an improved version:
var realtypeof = function (obj) {
switch (typeof(obj)) {
// object prototypes
case 'object':
if (obj instanceof Array)
return '[object Array]';
if (obj instanceof Date)
return '[object Date]';
if (obj instanceof RegExp)
return '[object regexp]';
if (obj instanceof String)
return '[object String]';
if (obj instanceof Number)
return '[object Number]';
return 'object';
// object literals
default:
return typeof(obj);
}
};
sample test:
realtypeof( '' ) // "string"
realtypeof( new String('') ) // "[object String]"
Object.prototype.toString.call("foo bar") //"[object String]"
Solution 7 - Javascript
For builtin JS types you can use:
function getTypeName(val) {
return {}.toString.call(val).slice(8, -1);
}
Here we use 'toString' method from 'Object' class which works different than the same method of another types.
Examples:
// Primitives
getTypeName(42); // "Number"
getTypeName("hi"); // "String"
getTypeName(true); // "Boolean"
getTypeName(Symbol('s'))// "Symbol"
getTypeName(null); // "Null"
getTypeName(undefined); // "Undefined"
// Non-primitives
getTypeName({}); // "Object"
getTypeName([]); // "Array"
getTypeName(new Date); // "Date"
getTypeName(function() {}); // "Function"
getTypeName(/a/); // "RegExp"
getTypeName(new Error); // "Error"
If you need a class name you can use:
instance.constructor.name
Examples:
({}).constructor.name // "Object"
[].constructor.name // "Array"
(new Date).constructor.name // "Date"
function MyClass() {}
let my = new MyClass();
my.constructor.name // "MyClass"
But this feature was added in ES2015.
Solution 8 - Javascript
In JavaScript everything is an object
console.log(type of({})) //Object
console.log(type of([])) //Object
To get Real type , use this
console.log(Object.prototype.toString.call({})) //[object Object]
console.log(Object.prototype.toString.call([])) //[object Array]
Hope this helps
Solution 9 - Javascript
Many people suggest typeOf but forget JS qwirks. Here is the one liner utility function you can use
const trueTypeOf = (obj) => Object.prototype.toString.call(obj).slice(8, -1).toLowerCase()
Output:
trueTypeOf([]); // array
trueTypeOf({}); // object
trueTypeOf(''); // string
trueTypeOf(new Date()); // date
trueTypeOf(1); // number
trueTypeOf(function () {}); // function.
trueTypeOf(/test/i); // regexp
trueTypeOf(true); // boolean
trueTypeOf(null); // null
trueTypeOf(); // undefined
Solution 10 - Javascript
##Here is the Complete solution.
>You can also use it as a Helper class in your Projects.
"use strict";
/**
* @description Util file
* @author Tarandeep Singh
* @created 2016-08-09
*/
window.Sys = {};
Sys = {
isEmptyObject: function(val) {
return this.isObject(val) && Object.keys(val).length;
},
/** This Returns Object Type */
getType: function(val) {
return Object.prototype.toString.call(val);
},
/** This Checks and Return if Object is Defined */
isDefined: function(val) {
return val !== void 0 || typeof val !== 'undefined';
},
/** Run a Map on an Array **/
map: function(arr, fn) {
var res = [],
i = 0;
for (; i < arr.length; ++i) {
res.push(fn(arr[i], i));
}
arr = null;
return res;
},
/** Checks and Return if the prop is Objects own Property */
hasOwnProp: function(obj, val) {
return Object.prototype.hasOwnProperty.call(obj, val);
},
/** Extend properties from extending Object to initial Object */
extend: function(newObj, oldObj) {
if (this.isDefined(newObj) && this.isDefined(oldObj)) {
for (var prop in oldObj) {
if (this.hasOwnProp(oldObj, prop)) {
newObj[prop] = oldObj[prop];
}
}
return newObj;
} else {
return newObj || oldObj || {};
}
}
};
// This Method will create Multiple functions in the Sys object that can be used to test type of
['Arguments', 'Function', 'String', 'Number', 'Date', 'RegExp', 'Object', 'Array', 'Undefined']
.forEach(
function(name) {
Sys['is' + name] = function(obj) {
return toString.call(obj) == '[object ' + name + ']';
};
}
);
<h1>Use the Helper JavaScript Methods..</h1>
<code>use: if(Sys.isDefined(jQuery){console.log("O Yeah... !!");}</code>
##For Exportable CommonJs Module or RequireJS Module....
"use strict";
/*** Helper Utils ***/
/**
* @description Util file :: From Vault
* @author Tarandeep Singh
* @created 2016-08-09
*/
var Sys = {};
Sys = {
isEmptyObject: function(val){
return this.isObject(val) && Object.keys(val).length;
},
/** This Returns Object Type */
getType: function(val){
return Object.prototype.toString.call(val);
},
/** This Checks and Return if Object is Defined */
isDefined: function(val){
return val !== void 0 || typeof val !== 'undefined';
},
/** Run a Map on an Array **/
map: function(arr,fn){
var res = [], i=0;
for( ; i<arr.length; ++i){
res.push(fn(arr[i], i));
}
arr = null;
return res;
},
/** Checks and Return if the prop is Objects own Property */
hasOwnProp: function(obj, val){
return Object.prototype.hasOwnProperty.call(obj, val);
},
/** Extend properties from extending Object to initial Object */
extend: function(newObj, oldObj){
if(this.isDefined(newObj) && this.isDefined(oldObj)){
for(var prop in oldObj){
if(this.hasOwnProp(oldObj, prop)){
newObj[prop] = oldObj[prop];
}
}
return newObj;
}else {
return newObj || oldObj || {};
}
}
};
/**
* This isn't Required but just makes WebStorm color Code Better :D
* */
Sys.isObject
= Sys.isArguments
= Sys.isFunction
= Sys.isString
= Sys.isArray
= Sys.isUndefined
= Sys.isDate
= Sys.isNumber
= Sys.isRegExp
= "";
/** This Method will create Multiple functions in the Sys object that can be used to test type of **/
['Arguments', 'Function', 'String', 'Number', 'Date', 'RegExp', 'Object', 'Array', 'Undefined']
.forEach(
function(name) {
Sys['is' + name] = function(obj) {
return toString.call(obj) == '[object ' + name + ']';
};
}
);
module.exports = Sys;
>Currently in Use on a public git repo. Github Project
Now you can import this Sys code in a Sys.js file. then you can use this Sys object functions to find out the type of JavaScript Objects
you can also check is Object is Defined or type is Function or the Object is Empty... etc.
- Sys.isObject
- Sys.isArguments
- Sys.isFunction
- Sys.isString
- Sys.isArray
- Sys.isUndefined
- Sys.isDate
- Sys.isNumber
- Sys.isRegExp
###For Example
var m = function(){};
Sys.isObject({});
Sys.isFunction(m);
Sys.isString(m);
console.log(Sys.isDefined(jQuery));
Solution 11 - Javascript
Here's a helpful solution:
newTypeOf = (value) => {
return Object.prototype.toString.call(value).split(' ')[1].split(']')[0].toString()
}
newTypeOf(12) // Number
newTypeOf('') // String
newTypeOf([]) // Array
newTypeOf({}) // Number
newTypeOf(null) // Null
newTypeOf(undefined) // Undefined
newTypeOf(()=>{}) // Function