วิธีที่ดีกว่าในการรับตัวแปรของ Javascript

มีวิธีที่ดีกว่าในการรับชนิดของตัวแปรใน JS มากกว่าtypeof? มันทำงานได้ดีเมื่อคุณ:

> typeof 1
"number"
> typeof "hello"
"string"

แต่มันไร้ประโยชน์เมื่อคุณลอง:

> typeof [1,2]
"object"
>r = new RegExp(/./)
/./
> typeof r
"function"

ฉันรู้instanceofแต่สิ่งนี้คุณต้องรู้ล่วงหน้า

> [1,2] instanceof Array
true
> r instanceof RegExp
true

มีวิธีที่ดีกว่า?

Angus Croll เพิ่งเขียนบทความบล็อกที่น่าสนใจเกี่ยวกับเรื่องนี้ -

http://javascriptweblog.wordpress.com/2011/08/08/fixing-the-javascript-typeof-operator/

เขาต้องผ่านข้อดีข้อเสียของวิธีการต่าง ๆ แล้วกำหนดวิธีการใหม่ 'toType' -

var toType = function(obj) {
  return ({}).toString.call(obj).match(/\s([a-zA-Z]+)/)[1].toLowerCase()
}

constructor.nameคุณสามารถลองใช้

[].constructor.name
new RegExp().constructor.name

เช่นเดียวกับ JavaScript ทุกอย่างในที่สุดบางคนก็จะชี้ว่านี่เป็นสิ่งที่ชั่วร้ายดังนั้นนี่คือลิงก์ไปยังคำตอบที่ครอบคลุมสิ่งที่ดีงามนี้

ทางเลือกหนึ่งคือการใช้ Object.prototype.toString.call

Object.prototype.toString.call([])
Object.prototype.toString.call(/./)

ที่ดีพอสมควรฟังก์ชั่นการจับภาพประเภทหนึ่งที่ใช้โดยYUI3 :

var TYPES = {
    'undefined'        : 'undefined',
    'number'           : 'number',
    'boolean'          : 'boolean',
    'string'           : 'string',
    '[object Function]': 'function',
    '[object RegExp]'  : 'regexp',
    '[object Array]'   : 'array',
    '[object Date]'    : 'date',
    '[object Error]'   : 'error'
},
TOSTRING = Object.prototype.toString;

function type(o) {
    return TYPES[typeof o] || TYPES[TOSTRING.call(o)] || (o ? 'object' : 'null');
};

สิ่งนี้จะจับภาพดั้งเดิมจำนวนมากที่มีให้โดย javascript แต่คุณสามารถเพิ่มได้มากขึ้นโดยการแก้ไขTYPESวัตถุ โปรดทราบว่าtypeof HTMLElementCollectionใน Safari จะรายงานfunctionแต่ประเภท (HTMLElementCollection) จะกลับมาobject

คุณอาจพบว่าฟังก์ชั่นต่อไปนี้มีประโยชน์:

function typeOf(obj) {
  return {}.toString.call(obj).split(' ')[1].slice(0, -1).toLowerCase();
}

หรือใน ES7 (แสดงความคิดเห็นหากการปรับปรุงเพิ่มเติม)

function typeOf(obj) {
  const { toString } = Object.prototype;
  const stringified = obj::toString();
  const type = stringified.split(' ')[1].slice(0, -1);

  return type.toLowerCase();
}

ผล:

typeOf(); //undefined
typeOf(null); //null
typeOf(NaN); //number
typeOf(5); //number
typeOf({}); //object
typeOf([]); //array
typeOf(''); //string
typeOf(function () {}); //function
typeOf(/a/) //regexp
typeOf(new Date()) //date
typeOf(new Error) //error
typeOf(Promise.resolve()) //promise
typeOf(function *() {}) //generatorfunction
typeOf(new WeakMap()) //weakmap
typeOf(new Map()) //map

ขอบคุณ @ Johnrees ที่แจ้งให้ฉันทราบถึง: ข้อผิดพลาดสัญญา generatorfunction

นอกจากนี้เรายังสามารถเปลี่ยนตัวอย่างเล็กน้อยจากipr101

Object.prototype.toType = function() {
  return ({}).toString.call(this).match(/\s([a-zA-Z]+)/)[1].toLowerCase()
}

และโทรเป็น

"aaa".toType(); // 'string'

ฟังก์ชั่นหนึ่งบรรทัด:

function type(obj) {
    return Object.prototype.toString.call(obj).replace(/^\[object (.+)\]$/,"$1").toLowerCase()
}

สิ่งนี้ให้ผลลัพธ์เช่นเดียวกับ jQuery.type()

คุณสามารถนำObject.prototype.toStringไปใช้กับวัตถุใด ๆ :

var toString = Object.prototype.toString;

console.log(toString.call([]));
//-> [object Array]

console.log(toString.call(/reg/g));
//-> [object RegExp]

console.log(toString.call({}));
//-> [object Object]

นี้ทำงานได้ดีในเบราว์เซอร์ที่มีข้อยกเว้นของ IE - [object Object]เมื่อโทรนี้ในตัวแปรที่ได้รับจากหน้าต่างมันก็จะคายออกอีก

2 ¢ของฉัน! จริงๆส่วนหนึ่งของเหตุผลที่ฉันโยนนี้ขึ้นที่นี่แม้จะมีรายชื่อยาวของคำตอบคือการให้เล็ก ๆ น้อย ๆการแก้ปัญหาชนิดและได้รับกลับมาฟีดในอนาคตเกี่ยวกับวิธีการขยายให้มีมากกว่าall in onereal types

ด้วยวิธีการแก้ปัญหาต่อไปนี้เป็นข้างต้นรวมทั้งคู่ของการแก้ปัญหาที่พบที่นี่เช่นเดียวกับการรวมการแก้ไขกลับค่าjQueryใน jQuery วัตถุที่กำหนดถ้ามี ฉันยังผนวกวิธีการไปยังต้นแบบวัตถุดั้งเดิม ฉันรู้ว่ามักจะเป็นข้อห้ามตามที่มันจะยุ่งเกี่ยวกับนามสกุลอื่น ๆ ดังกล่าว user bewareแต่ฉันออกจากที่ หากคุณไม่ชอบวิธีนี้เพียงคัดลอกฟังก์ชันพื้นฐานทุกที่ที่คุณต้องการและแทนที่ตัวแปรทั้งหมดthisด้วยพารามิเตอร์อาร์กิวเมนต์เพื่อส่งต่อ (เช่นอาร์กิวเมนต์ [0])

;(function() {  //  Object.realType
    function realType(toLower) {
        var r = typeof this;
        try {
            if (window.hasOwnProperty('jQuery') && this.constructor && this.constructor == jQuery) r = 'jQuery';
            else r = this.constructor && this.constructor.name ? this.constructor.name : Object.prototype.toString.call(this).slice(8, -1);
        }
        catch(e) { if (this['toString']) r = this.toString().slice(8, -1); }
        return !toLower ? r : r.toLowerCase();
    }
    Object['defineProperty'] && !Object.prototype.hasOwnProperty('realType')
        ? Object.defineProperty(Object.prototype, 'realType', { value: realType }) : Object.prototype['realType'] = realType;
})();

จากนั้นใช้อย่างง่ายดายเช่น:

obj.realType()  //  would return 'Object'
obj.realType(true)  //  would return 'object'

หมายเหตุ:มี 1 อาร์กิวเมนต์ที่สามารถผ่านได้ ถ้าเป็นบูtrueลแล้วผลตอบแทนจะเป็นตัวพิมพ์เล็กเสมอ

ตัวอย่างเพิ่มเติม:

true.realType();                            //  "Boolean"
var a = 4; a.realType();                    //  "Number"
$('div:first').realType();                   // "jQuery"
document.createElement('div').realType()    //  "HTMLDivElement"

หากคุณมีอะไรเพิ่มเติมที่อาจเป็นประโยชน์เช่นการกำหนดเมื่อวัตถุถูกสร้างขึ้นด้วยห้องสมุดอื่น (หมู่ Proto, Yui, Dojo, ฯลฯ ... ) โปรดแสดงความคิดเห็นหรือแก้ไขสิ่งนี้และทำให้มันเป็นมากกว่า ถูกต้องและแม่นยำ หรือหมุนไปที่GitHubฉันทำเพื่อมันและแจ้งให้เราทราบ คุณจะพบลิงค์ด่วนไปยังไฟล์ cdn min ที่นั่น

function getType(obj) {
    if(obj && obj.constructor && obj.constructor.name) {
        return obj.constructor.name;
    }
    return Object.prototype.toString.call(obj).slice(8, -1).toLowerCase();
}

ในการทดสอบเบื้องต้นของฉันนี้ทำงานได้ค่อนข้างดี กรณีแรกจะพิมพ์ชื่อของวัตถุใด ๆ ที่สร้างขึ้นด้วย "ใหม่" และกรณีที่ 2 ควรจับทุกอย่างอื่น

ฉันใช้(8, -1)เพราะฉันสมมติว่าผลลัพธ์จะเริ่มต้นด้วย[objectและจบด้วยเสมอ]แต่ฉันไม่แน่ใจว่าเป็นเรื่องจริงในทุกสถานการณ์

ผมคิดว่าวิธีการแก้ปัญหาสากลมากที่สุดที่นี่ - คือการตรวจสอบundefinedและเป็นครั้งแรกแล้วก็โทรnullconstructor.name.toLowerCase()

const getType = v =>
  v === undefined
    ? 'undefined'
    : v === null
      ? 'null'
      : v.constructor.name.toLowerCase();




console.log(getType(undefined)); // 'undefined'
console.log(getType(null)); // 'null'
console.log(getType('')); // 'string'
console.log(getType([])); // 'array'
console.log(getType({})); // 'object'
console.log(getType(new Set())); // `set'
console.log(getType(Promise.resolve())); // `promise'
console.log(getType(new Map())); // `map'

typeof เงื่อนไขที่ใช้ในการตรวจสอบประเภทตัวแปรถ้าคุณกำลังตรวจสอบประเภทตัวแปรในเงื่อนไข if-else เช่น

if(typeof Varaible_Name "undefined")
{

}