Menemukan Jenis Variabel dalam JavaScript

146

Di Jawa, Anda bisa menggunakan instanceOfatau getClass()pada variabel untuk mengetahui tipenya.

Bagaimana cara mengetahui tipe variabel dalam JavaScript yang tidak diketik dengan kuat?

Sebagai contoh, bagaimana saya tahu apakah baritu a Booleanatau a Number, atau a String?

function foo(bar) {
    // what do I do here?
}
Tom Tucker
sumber
lihat juga: stackoverflow.com/questions/24318654
dreftymac

Jawaban:

242

Gunakan typeof:

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

Jadi kamu bisa melakukan:

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

Berhati-hatilah jika Anda mendefinisikan primitif ini dengan pembungkus objeknya (yang seharusnya tidak pernah Anda lakukan, gunakan literal jika memungkinkan):

> typeof new Boolean(false)
"object"
> typeof new String("foo")
"object"
> typeof new Number(42)
"object"

Jenis array masih object. Di sini Anda benar-benar membutuhkaninstanceof operator.

Memperbarui:

Cara lain yang menarik adalah dengan memeriksa output dari 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]"

Dengan itu Anda tidak perlu membedakan antara nilai dan objek primitif.

Felix Kling
sumber
Apa yang akan menjadi sisi bawah menggunakan proto .constructor.name fungsi siple adalah: function getVariableType (objek) {return (objek .__ proto__.constructor.name); }
Stu
perbarui definisi fungsi yang saya sebutkan di atas: function getVariableType (objek) {return (objek === undefined? "Undefined": object.__proto__.constructor.name);
Stu
29

typeof hanya baik untuk mengembalikan tipe "primitif" seperti angka, boolean, objek, string, dan simbol. Anda juga dapat menggunakan instanceofuntuk menguji apakah suatu objek adalah tipe tertentu.

function MyObj(prop) {
  this.prop = prop;
}

var obj = new MyObj(10);

console.log(obj instanceof MyObj && obj instanceof Object); // outputs true
Juan Mendes
sumber
23

Menggunakan 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';
krishna singh
sumber
Tidak ada masalah dengan menggunakan Number(1), Boolean(true)...Satu-satunya masalah adalah ketika Anda menggunakan newdan objek kotak dibuat, menggunakannya sebagai fungsi sebenarnya dapat berguna mengkonversi dari tipe lain. Boolean(0) === false, Number(true) === 1
Juan Mendes
bagaimana null? typeof nullis 'object'
Dheeraj
15

Di Javascript Anda bisa melakukannya dengan menggunakan fungsi typeof

function foo(bar){
  alert(typeof(bar));
}
wajiw
sumber
3
Seperti yang saya sebutkan dalam jawaban saya, typof hanya akan mengembalikan angka, boolean, objek, string. Tidak berguna untuk menentukan jenis lain, seperti Array, RegExp atau jenis khusus.
Juan Mendes
7

Untuk menjadi sedikit lebih tepat ECMAScript-5.1-tepat daripada jawaban lain (beberapa mungkin mengatakan pedantic):

Dalam JavaScript, variabel (dan properti) tidak memiliki tipe: nilai memang. Lebih lanjut, hanya ada 6 jenis nilai: Tidak terdefinisi, Null, Boolean, String, Number, dan Object. (Secara teknis, ada juga 7 "spesifikasi jenis", tetapi Anda tidak dapat menyimpan nilai dari tipe tersebut sebagai properti objek atau nilai variabel - mereka hanya digunakan dalam spesifikasi itu sendiri, untuk menentukan cara kerja bahasa. Nilai-nilai tersebut Anda dapat memanipulasi secara eksplisit hanya dari 6 jenis yang saya cantumkan.)

Spec menggunakan notasi "Type (x)" ketika ingin berbicara tentang "type x". Ini hanya notasi yang digunakan dalam spesifikasi: ini bukan fitur bahasa.

Seperti jawaban lain memperjelas, dalam praktiknya Anda mungkin ingin tahu lebih banyak dari jenis nilai - terutama ketika jenisnya adalah Obyek. Apapun, dan untuk kelengkapan, berikut adalah implementasi JavaScript sederhana Tipe (x) seperti yang digunakan dalam spesifikasi:

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';
    }
}
Wes
sumber
Ada juga simbol
Juan Mendes
Tidak dalam ECMAScript 5.1, tidak ada.
Wes
6

Saya merasa frustasi karena typeofsangat terbatas. Ini versi yang ditingkatkan:

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);
    }   
};

uji sampel:

realtypeof( '' ) // "string"
realtypeof( new String('') ) // "[object String]"
Object.prototype.toString.call("foo bar") //"[object String]" 
Tom Söderlund
sumber
3

Untuk tipe JS bawaan Anda dapat menggunakan:

function getTypeName(val) {
    return {}.toString.call(val).slice(8, -1);
}

Di sini kita menggunakan metode 'toString' dari kelas 'Object' yang bekerja berbeda dari metode yang sama dari tipe lain.

Contoh:

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

Jika Anda membutuhkan nama kelas, Anda dapat menggunakan:

instance.constructor.name

Contoh:

({}).constructor.name       // "Object"
[].constructor.name         // "Array"
(new Date).constructor.name // "Date"

function MyClass() {}
let my = new MyClass();
my.constructor.name         // "MyClass"

Tetapi fitur ini ditambahkan dalam ES2015 .

WebBrother
sumber
1

Ini solusi lengkapnya.

Anda juga dapat menggunakannya sebagai kelas Penolong di Proyek Anda.

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

Untuk Modul CommonJs yang Dapat Diekspor atau Membutuhkan Modul ....

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

Saat ini sedang digunakan pada repo git publik. Proyek Github

Sekarang Anda dapat mengimpor kode Sys ini dalam file Sys.js. maka Anda dapat menggunakan fungsi objek Sys ini untuk mengetahui jenis Objek JavaScript

Anda juga dapat memeriksa apakah Object Defined atau type is Function atau Object is Empty ... etc.

  • Sys.isObject
  • Sys.isArguments
  • Sys.isFunction
  • Sys.isString
  • Sys.isArray
  • Sys. Tidak didefinisikan
  • Sys.isDate
  • Sys.isNumber
  • Sys.isRegExp

Sebagai contoh

var m = function(){};
Sys.isObject({});
Sys.isFunction(m);
Sys.isString(m);

console.log(Sys.isDefined(jQuery));
Tarandeep Singh
sumber
1

Dalam JavaScript semuanya adalah objek

console.log(type of({}))  //Object
console.log(type of([]))  //Object

Untuk mendapatkan tipe Real , gunakan ini

console.log(Object.prototype.toString.call({}))   //[object Object]
console.log(Object.prototype.toString.call([]))   //[object Array]

Semoga ini membantu

yogendra saxena
sumber