在 javascript 中检查变量类型的最佳方法是什么

Question

<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>

Question:

I want to check the type of capitalized, 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?

Answer 1

The best way is to use the typeof keyword.

typeof "hello" // "string"

The typeof operator maps an operand to one of six values: "string" , "number" , "object" , "function" , "undefined" and "boolean" . The instanceof method tests if the provided function's prototype is in the object's prototype chain.

This Wikibooks article along with this MDN articles does a pretty good job of summing up JavaScript's types.

Answer 2

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

Answer 3

typeof 大写 == 'string'

Answer 4

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")

Answer 5

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 (eg an empty enumerable DOM object besides the StyleSheetList). But on could add those to the type_of_map as needed.

I hope that helps!

Answer 6

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

Answer 7

2021+ one liner answer.

My favourite way is not to use typeof

Why? because it doesn't give true type for other than boolean,string,number & function.

Then what? 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

Answer 8

 //-- 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