Type Checking के टूल्स
Type checking किसी JavaScript value का type ढूँढने में मदद करता है। jQuery इस काम के लिए उपयोगी utilities देता है।
In this page:
Syntax
$.isArray(value);
$.isFunction(value);
$.isNumeric(value);
$.type(value);Type Checking क्या है?
jQuery $.isArray() और $.isFunction() जैसे छोटे utility functions देता है किसी value के underlying JavaScript type को reliably check करने के लिए, कुछ browser inconsistencies को काम में लाते हुए।
उदाहरण: What is Type Checking?
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<style>
button { padding:6px 14px; margin:4px; background:#2c6aa0; color:white; border:none; border-radius:4px; cursor:pointer; }
#resetBtn { background:white; color:#2c6aa0; border:1px solid #2c6aa0; }
#output { margin-top:10px; padding:8px; border:1px solid #ccc; border-radius:4px; background:#f7f7f7; font-family:monospace; min-height:24px; }
</style>
</head>
<body>
<button id="runBtn">Run</button>
<button id="resetBtn">Reset</button>
<div id="output"></div>
<script>
$("#runBtn").click(function() {
$("#output").text(String($.isArray([1, 2, 3])) + " " + $.isFunction(function(){}));
});
$("#resetBtn").click(function() {
$("#output").empty();
});
</script>
</body>
</html>Arrays Check करना
Arrays कई values को order में store करते हैं, और आपको अक्सर data मिलेगा — किसी form से, एक AJAX response से, या user input से — जहाँ आप पहले से sure नहीं हो सकते।
उदाहरण: Check Arrays
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<style>
button { padding:6px 14px; margin:4px; background:#2c6aa0; color:white; border:none; border-radius:4px; cursor:pointer; }
#resetBtn { background:white; color:#2c6aa0; border:1px solid #2c6aa0; }
#output { margin-top:10px; padding:8px; border:1px solid #ccc; border-radius:4px; background:#f7f7f7; font-family:monospace; min-height:24px; }
</style>
</head>
<body>
<button id="runBtn">Run</button>
<button id="resetBtn">Reset</button>
<div id="output"></div>
<script>
$("#runBtn").click(function() {
const data = [1, 2, 3];
$("#output").text(String($.isArray(data)));
});
$("#resetBtn").click(function() {
$("#output").empty();
});
</script>
</body>
</html>Functions Check करना
Functions reusable code रखते हैं, और कभी-कभी आपको एक argument के रूप में एक value मिलेगी जो callable होनी चाहिए, जैसे एक optional callback parameter।
उदाहरण: Check Functions
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<style>
button { padding:6px 14px; margin:4px; background:#2c6aa0; color:white; border:none; border-radius:4px; cursor:pointer; }
#resetBtn { background:white; color:#2c6aa0; border:1px solid #2c6aa0; }
#output { margin-top:10px; padding:8px; border:1px solid #ccc; border-radius:4px; background:#f7f7f7; font-family:monospace; min-height:24px; }
</style>
</head>
<body>
<button id="runBtn">Run</button>
<button id="resetBtn">Reset</button>
<div id="output"></div>
<script>
$("#runBtn").click(function() {
function maybeCallback() { $("#output").text("called"); }
if ($.isFunction(maybeCallback)) {
maybeCallback();
}
});
$("#resetBtn").click(function() {
$("#output").empty();
});
</script>
</body>
</html>Objects Check करना
Objects related properties को एक साथ store करते हैं, जैसे किसी user का name और email एक value में। Type checking यह confirm करने में मदद करता है कि आप एक genuine object के साथ काम कर रहे हैं।
उदाहरण: Check Objects
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<style>
button { padding:6px 14px; margin:4px; background:#2c6aa0; color:white; border:none; border-radius:4px; cursor:pointer; }
#resetBtn { background:white; color:#2c6aa0; border:1px solid #2c6aa0; }
#output { margin-top:10px; padding:8px; border:1px solid #ccc; border-radius:4px; background:#f7f7f7; font-family:monospace; min-height:24px; }
</style>
</head>
<body>
<button id="runBtn">Run</button>
<button id="resetBtn">Reset</button>
<div id="output"></div>
<script>
$("#runBtn").click(function() {
const value = {name: "Alice"};
$("#output").text(String($.type(value) === "object"));
});
$("#resetBtn").click(function() {
$("#output").empty();
});
</script>
</body>
</html>Practical Type Checking
Type checks खासतौर पर तब उपयोगी हो जाते हैं जब वही variable legitimately अलग-अलग shapes में आ सकता है, जैसे एक API जो कभी-कभी एक single।
उदाहरण: Practical Type Checking
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<style>
button { padding:6px 14px; margin:4px; background:#2c6aa0; color:white; border:none; border-radius:4px; cursor:pointer; }
#resetBtn { background:white; color:#2c6aa0; border:1px solid #2c6aa0; }
#output { margin-top:10px; padding:8px; border:1px solid #ccc; border-radius:4px; background:#f7f7f7; font-family:monospace; min-height:24px; }
</style>
</head>
<body>
<button id="runBtn">Run</button>
<button id="resetBtn">Reset</button>
<div id="output"></div>
<script>
$("#runBtn").click(function() {
$("#output").empty();
function handle(data) {
if ($.isArray(data)) {
$("#output").append($("<div>").text("Got a list of " + data.length));
} else {
$("#output").append($("<div>").text("Got a single item"));
}
}
handle([1, 2, 3]);
});
$("#resetBtn").click(function() {
$("#output").empty();
});
</script>
</body>
</html>Related Topics
{# common_mistakes/chapter_summary/browser_support: on Hindi pages the
view already swaps in the hi_ translation fields (or blanks these
out if untranslated), so this renders correctly for both languages
without a lang_code check here. #}
आम गलतियां
- नए code में
$.isArray()और$.isFunction()इस्तेमाल करना, जबकि ये jQuery 3 में deprecated हैं औरArray.isArray()तथाtypeof x === "function"preferred हैं। typeof data === "array"से एक array check करना, जो कभी true नहीं होता क्योंकिtypeofarrays के लिए"object"return करता है।- यह मान लेना कि
$.isArray("apple")true है क्योंकि एक string में कई characters होते हैं, जबकि सिर्फ real arrays true return करते हैं।
🔒
Chapter Quiz — Complete all 6 topics to unlock
0/6 topics done
Complete these topics first: