wat is de beste manier om het type variabele in javascript te controleren

Vraag:

Ik wil het type met hoofdletter controleren, dus ik gebruik capitalized instanceof String? Maar het toont: falsein console, ik wil capitalized instanceof Function, Objectniet proberen…Het zal te veel tijd kosten, dus wat is de beste manier om een type variabele te detecteren?


Antwoord 1, autoriteit 100%

De beste manier is om het trefwoord typeofte gebruiken.

typeof "hello" // "string"

De operator typeofwijst een operand toe aan een van de zes waarden: "string", "number", "object", "function", "undefined"en "boolean". De methode instanceoftest of het prototype van de geleverde functie zich in de prototypeketen van het object bevindt.

Dit Wikibooks-artikelsamen met deze MDN-artikelenvat de typen JavaScript vrij goed samen.


Antwoord 2, autoriteit 10%

gebruik typeof();

voorbeeld:

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

Dus je kunt het volgende doen:

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

Houd er rekening mee dat typeof alleen goed is voor het retourneren van de “primitieve” typen, number, boolean, object, string. Je kunt instanceof ook gebruiken om te testen of een object van een specifiek type is.

function MyObj(prop) {
  this.prop = prop;
}
var obj = new MyObj(10);
console.log(obj instanceof MyObj && obj instanceof Object); // outputs true

Antwoord 3, Autoriteit 3%

Type van kapitaal == ‘string’


Antwoord 4, Autoriteit 3%

De beste manier is met behulp van typeof

typeof "blahha" 

Ik heb een functie gemaakt met behulp van JQuery Library Code, jQuery Type bibliotheektype 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;
    }
}());

U kunt het noemen als getType("Hello")


Antwoord 5, Autoriteit 3%

De getVarTypemethode (hieronder) werkt voor bijna alle variabelen. Bekijk deze viool. Het gebruikt eerst het zeer snelle typeofvoor gevallen waarin de resultaten betrouwbaar zijn. Dan gebruikt het voor andere gevallen een duurdere toString-methode. Ten slotte, als het te maken heeft met een benoemd object (zoals geretourneerd door Firefox voor objecten zoals document.location), controleert het op array-achtige objecten en rapporteert deze als arrays.

Ter vergelijking: typeofis beschamend slecht. typeof([]) retourneert ‘object’, typeof(new Number()) retourneert object. Het retourneert ook ‘object’ voor veel andere variabelen die geen (voor praktische doeleinden) objecten zijn. Bekijk de vioolresultaten voor een vergelijking.

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

De enige mogelijke storingsmodus treedt op als u een benoemde array test die leeg is (bijvoorbeeld een leeg opsombaar DOM-object naast de StyleSheetList). Maar je kunt die desgewenst aan de type_of_map toevoegen.

Ik hoop dat dat helpt!


Antwoord 6

ES-Next-versie met ondersteuning voor 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

Other episodes