ตรวจสอบว่าวัตถุเป็นวัตถุ jQuery

มีวิธีที่รวดเร็วในการตรวจสอบว่าวัตถุเป็นวัตถุ jQuery หรือวัตถุ JavaScript ดั้งเดิมหรือไม่

ตัวอย่าง:

var o = {};
var e = $('#element');

function doStuff(o) {
    if (o.selector) {
        console.log('object is jQuery');
    }
}

doStuff(o);
doStuff(e);

เห็นได้ชัดว่ารหัสข้างต้นใช้งานได้ แต่ไม่ปลอดภัย คุณอาจเพิ่มคีย์ตัวเลือกลงในoวัตถุและรับผลลัพธ์เดียวกัน มีวิธีที่ดีกว่าในการตรวจสอบให้แน่ใจว่าวัตถุเป็นวัตถุ jQuery จริงหรือไม่

สิ่งที่สอดคล้องกับ (typeof obj == 'jquery')

คุณสามารถใช้instanceofโอเปอเรเตอร์:

if (obj instanceof jQuery){
    console.log('object is jQuery');
}

คำอธิบายที่: jQueryฟังก์ชั่น (aka $) จะดำเนินการเป็นฟังก์ชั่นคอนสตรัค ฟังก์ชันตัวสร้างจะถูกเรียกพร้อมกับส่วนnewนำหน้า

เมื่อคุณโทร$(foo)ภายใน jQuery แปลนี้1new jQuery(foo) จาวาสคริปต์ดำเนินการเพื่อเริ่มต้นthisภายในฟังก์ชั่นคอนสตรัคให้ชี้ไปที่อินสแตนซ์ใหม่ของjQueryการตั้งค่ามันเป็นคุณสมบัติที่พบในjQuery.prototype(aka jQuery.fn) ดังนั้นคุณจะได้รับnewวัตถุที่เป็นinstanceof jQuerytrue

¹ _{จริง ๆ แล้วnew jQuery.prototype.init(foo): คอนสตรัคชันของตรรกะได้ถูกถ่ายลงในฟังก์ชั่นคอนสตรัคเตอร์อื่นที่เรียกว่าinitแต่แนวคิดนั้นเหมือนกัน}

คุณอาจใช้คุณสมบัติ. jquery ตามที่อธิบายไว้ที่นี่: http://api.jquery.com/jquery-2/

var a = { what: "A regular JS object" },
b = $('body');

if ( a.jquery ) { // falsy, since it's undefined
    alert(' a is a jQuery object! ');    
}

if ( b.jquery ) { // truthy, since it's a string
    alert(' b is a jQuery object! ');
}

ตรวจสอบผู้ประกอบการinstanceof

var isJqueryObject = obj instanceof jQuery

วิธีที่ดีที่สุดในการตรวจสอบอินสแตนซ์ของวัตถุคือผ่านโอเปอเรเตอร์ของอินสแตนซ์หรือด้วยเมธอดisPrototypeOf ()ซึ่งตรวจสอบว่าต้นแบบของวัตถุอยู่ในห่วงโซ่ต้นแบบของวัตถุอื่นหรือไม่

obj instanceof jQuery;
jQuery.prototype.isPrototypeOf(obj);

แต่บางครั้งมันอาจล้มเหลวในกรณีของอินสแตนซ์ jQuery หลายรายการในเอกสาร ในฐานะ @Georgiy Ivankin พูดถึง:

ถ้าฉันมี$ใน namespace ปัจจุบันของฉันชี้ไปที่jQuery2และฉันมีวัตถุจาก namespace ด้านนอก (ที่$อยู่jQuery1) แล้วฉันไม่มีวิธีที่จะใช้instanceofสำหรับการตรวจสอบว่าวัตถุนั้นเป็นjQueryวัตถุ

วิธีหนึ่งที่จะเอาชนะปัญหานั้นได้คือการใช้นามแฝงวัตถุ jQuery ในการปิดหรือIIFE

//aliases jQuery as $
(function($, undefined) {
    /*... your code */

    console.log(obj instanceof $);
    console.log($.prototype.isPrototypeOf(obj));

    /*... your code */
}(jQuery1));
//imports jQuery1

วิธีอื่นในการเอาชนะปัญหานั้นคือการสอบถามjqueryคุณสมบัติในobj

'jquery' in obj

อย่างไรก็ตามหากคุณพยายามทำการตรวจสอบด้วยค่าดั้งเดิมมันจะทำให้เกิดข้อผิดพลาดดังนั้นคุณสามารถแก้ไขการตรวจสอบก่อนหน้าได้โดยทำให้แน่ใจว่าobjเป็นObject

'jquery' in Object(obj)

แม้ว่าวิธีก่อนหน้านี้จะไม่ปลอดภัยที่สุด (คุณสามารถสร้าง'jquery'คุณสมบัติในวัตถุ) แต่เราสามารถปรับปรุงการตรวจสอบโดยการทำงานกับทั้งสองวิธี:

if (obj instanceof jQuery || 'jquery' in Object(obj)) { }

ปัญหาที่นี่คือวัตถุใด ๆ ที่สามารถกำหนดคุณสมบัติjqueryเป็นของตัวเองดังนั้นวิธีที่ดีกว่าคือการถามในต้นแบบและให้แน่ใจว่าวัตถุนั้นไม่ได้nullหรือundefined

if (obj && (obj instanceof jQuery || obj.constructor.prototype.jquery)) { }

เนื่องจากการบังคับของifคำสั่งที่จะทำให้ไฟฟ้าลัดวงจรโดยการประเมิน&&ผู้ประกอบการเมื่อobjมีการใด ๆ ของfalsyค่า ( null, undefined, false, 0, "") และจากนั้นก็จะดำเนินการตรวจสอบอื่น ๆ

ในที่สุดเราสามารถเขียนฟังก์ชั่นยูทิลิตี้:

function isjQuery(obj) {
  return (obj && (obj instanceof jQuery || obj.constructor.prototype.jquery));
}

ลองดูที่: ผู้ประกอบการตรรกะและความจริง / เท็จ

return el instanceof jQuery ? el.size() > 0 : (el && el.tagName);

อย่างไรก็ตามมีอีกหนึ่งวิธีในการตรวจสอบวัตถุใน jQuery

jQuery.type(a); //this returns type of variable.

ฉันได้ทำตัวอย่างเพื่อทำความเข้าใจกับสิ่งต่าง ๆลิงก์ jsfiddle

สำหรับผู้ที่ต้องการทราบว่าวัตถุเป็นวัตถุ jQuery โดยไม่ต้องติดตั้ง jQuery ข้อมูลโค้ดต่อไปนี้ควรทำงาน:

function isJQuery(obj) {
  // Each jquery object has a "jquery" attribute that contains the version of the lib.
  return typeof obj === "object" && obj && obj["jquery"];
}

คุณสามารถตรวจสอบว่าวัตถุถูกผลิตโดย JQuery ด้วยjqueryคุณสมบัติ:

myObject.jquery // 3.3.1

=> ส่งคืนหมายเลขรุ่น JQuery ถ้าวัตถุที่สร้างโดย JQuery => มิฉะนั้นจะส่งคืนundefined

var elArray = [];
var elObjeto = {};

elArray.constructor == Array //TRUE
elArray.constructor == Object//TALSE

elObjeto.constructor == Array//FALSE
elObjeto.constructor == Object//TRUE