CODEWITHSUNDEEP
javascript
user2507818
user2507818

Reputation: 3037

What is the best way to check variable type in JavaScript?

<script type="text/javascript">   
function saveName (firstName) {
    function capitalizeName () {
        return firstName.toUpperCase();
    }
    var capitalized = capitalizeName();console.log(capitalized instanceof String);
    return capitalized; 
}
console.log(saveName("Robert")); // Returns "ROBERT"
</script>

I want to check the type of capitalized variable, so I use capitalized instanceof String. But it shows false in console. I do not want to try capitalized instanceof Function, Object. It will take too much time.

So what is the best way to detect a variable type?

Upvotes: 63

Views: 170338

Answers (8)

minigeek
minigeek

Reputation: 3166

My favourite way is not to use typeof, because it doesn't give true type for other than boolean, string, number & function.

Instead, here is small utility function using Object.prototype:

var trueTypeOf = (obj) => Object.prototype.toString.call(obj).slice(8, -1).toLowerCase()

Results:

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

Upvotes: 16

LandonSchropp
LandonSchropp

Reputation: 10244

The best way is to use the typeof keyword.

typeof "hello" // "string"

The typeof operator maps an operand to one of eight possible values:

  • "string"
  • "number"
  • "object"
  • "function"
  • "undefined"
  • "boolean"
  • "symbol"
  • "bigint"

The instanceof method tests if the provided function's prototype is in the object's prototype chain.

This MDN article does a pretty good job of summing up JavaScript's types.

Upvotes: 77

edai
edai

Reputation: 1

 //-- difference constructor & typeof --//

 const fx = () => {}
 const arr = []
 const obj = {}
 
 console.log( fx.constructor == Function ) // true
 console.log( arr.constructor == Array ) // true
 console.log( arr.constructor == Object ) // false
 console.log( obj.constructor == Object ) // true
 console.log( obj.constructor == Array ) // false
 
 console.log( typeof obj ) // object
 console.log( typeof arr ) // object

Upvotes: 0

xgqfrms
xgqfrms

Reputation: 12146

ES-Next version with support BigInt & Symbol


"use strict";

/**
 *
 * @author xgqfrms
 * @license MIT
 * @copyright xgqfrms
 * @created 2020-06-09
 * @modified
 *
 * @description js data type checker
 * @augments
 * @example
 * @link
 *
 */


const dataTypeChecker = (data, debug = false) => {
  const log = console.log;
  let result = ``;
  const typeString = Object.prototype.toString.call(data);
  result = typeString.replace(/\[object /gi, ``).replace(/\]/gi, ``);
  if(debug) {
    log(`true type`, result)
  }
  return result;
};



/*

export default dataTypeChecker;

export {
  dataTypeChecker,
};

*/

test

const dataTypeChecker = (data, debug = false) => {
  const log = console.log;
  let result = ``;
  const typeString = Object.prototype.toString.call(data);
  // const typeString = Object.prototype.toString.apply(data);
  result = typeString.replace(/\[object /gi, ``).replace(/\]/gi, ``);
  if(!debug) {
    log(`true type`, result)
  }
  return result;
};



const obj = {};
const func = () => {};


dataTypeChecker(NaN)
//"[object Number]"
dataTypeChecker(undefined)
//"[object Undefined]"
dataTypeChecker(true)
//"[object Boolean]"
dataTypeChecker({})
//"[object Object]"
dataTypeChecker(func)
//"[object Function]"
dataTypeChecker(obj)
//"[object Object]"
dataTypeChecker(Symbol())
//"[object Symbol]"
dataTypeChecker(null)
//"[object Null]"
dataTypeChecker(123)
//"[object Number]"
dataTypeChecker(BigInt(1n))
//"[object BigInt]"


// true type Number
// true type Undefined
// true type Boolean
// true type Object
// true type Function
// true type Object
// true type Symbol
// true type Null
// true type Number
// true type BigInt

Upvotes: 1

Michael Mikowski
Michael Mikowski

Reputation: 1279

The getVarType method (below) works for almost all variables. Check out this fiddle. It first uses the very fast typeof for cases where the results are reliable. Then it uses a more expensive toString method for other cases. Finally, if it is dealing with a named object (as returned by Firefox for objects like document.location) it checks for Array-like objects and reports them as arrays.

In comparison, typeof is embarrassingly poor. typeof([]) returns 'object', typeof(new Number()) returns object. It also returns 'object' for many other variables that aren't (for practical purposes) objects. See the fiddle results for a comparison.

  // Begin public utility /getVarType/
  // Returns 'Function', 'Object', 'Array',
  // 'String', 'Number', 'Null', 'Boolean', or 'Undefined'
  //
  getVarType = (function () {
    var typeof_map = {
      'undefined' : 'Undefined',
      'boolean'   : 'Boolean',
      'number'    : 'Number',
      'string'    : 'String',
      'function'  : 'Function',

      'Undefined' : 'Undefined',
      'Null'      : 'Null',
      'Boolean'   : 'Boolean',
      'Number'    : 'Number',
      'String'    : 'String',
      'Function'  : 'Function',
      'Array'     : 'Array',
      'StyleSheetList' : 'Array'
    };

    return function( data ) {
      var type, type_str;

      if ( data === null      ) { return 'Null'; }
      if ( data === undefined ) { return 'Undefined'; }

      type     = typeof( data );
      type_str = typeof_map[ type ];

      if ( type_str ) { return type_str; }

      type = {}.toString.call( data ).slice( 8, -1 );
      return typeof_map[ type ]
        || ( data instanceof Array ? 'Array' :
        ( data.propertyIsEnumerable(0) && data.length !== undefined
          ? 'Array' : 'Object' )
        );
    };
  }());
  // End public utility /getVarType/

The only possible failure mode happens if you are testing a named array that is empty (e.g. an empty enumerable DOM object besides the StyleSheetList). But on could add those to the type_of_map as needed.

I hope that helps!

Upvotes: 2

rab
rab

Reputation: 4144

The best way is using typeof

typeof "blahha"

I made a function with help of jQuery library code, jQuery library type method github link .

var getType = (function() {

    var objToString = ({}).toString ,
        typeMap     = {},
        types = [ 
          "Boolean", 
          "Number", 
          "String",                
          "Function", 
          "Array", 
          "Date",
          "RegExp", 
          "Object", 
          "Error"
        ];

    for ( var i = 0; i < types.length ; i++ ){
        typeMap[ "[object " + types[i] + "]" ] = types[i].toLowerCase();
    };    

    return function( obj ){
        if ( obj == null ) {
            return String( obj );
        }
        // Support: Safari <= 5.1 (functionish RegExp)
        return typeof obj === "object" || typeof obj === "function" ?
            typeMap[ objToString.call(obj) ] || "object" :
            typeof obj;
    }
}());

You can call it as getType("Hello")

Upvotes: 3

Fasil kk
Fasil kk

Reputation: 2187

use typeof();

example: 

> typeof "foo"
"string"
> typeof true
"boolean"
> typeof 42
"number"

So you can do:

if(typeof bar === 'string') {
   //whatever
}

Keep in mind that, typeof is only good for returning the "primitive" types, number, boolean, object, string. 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

Upvotes: 23

vladkras
vladkras

Reputation: 17228

typeof capitalized == 'string'

Upvotes: 2

Related Questions