JavaScript में + ऑपरेटर स्ट्रिंग्स के साथ कन्कैटिनेशन करता है। इनपुट फ़ील्ड से मिलने वाले मान स्ट्रिंग होते हैं, इसलिए उन्हें संख्या में बदलने के लिए parseInt(), parseFloat(), Number() या यूनरी + ऑपरेटर का उपयोग करें।
समस्या
"5" + "3" // "53" (स्ट्रिंग कन्कैटिनेशन)
5 + 3 // 8 (संख्या जोड़)
समाधान
// parseInt() - पूर्णांक के लिए
parseInt("5") + parseInt("3") // 8
// parseFloat() - दशमलव के लिए
parseFloat("5.5") + parseFloat("3.2") // 8.7
// Number() - सामान्य रूपांतरण
Number("5") + Number("3") // 8
// यूनरी + ऑपरेटर (सबसे छोटा)
+"5" + +"3" // 8
पूरा HTML उदाहरण
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>संख्या जोड़</title>
</head>
<body>
First Number: <input type="number" class="num1" placeholder="पहली संख्या"><br>
Second Number: <input type="number" class="num2" placeholder="दूसरी संख्या"><br><br>
<button onclick="sumOfTwoNumbers()">जोड़ें</button>
<p class="output"></p>
<script>
function sumOfTwoNumbers() {
// मान प्राप्त करें और संख्या में बदलें
var num1 = parseFloat(document.querySelector(".num1").value) || 0;
var num2 = parseFloat(document.querySelector(".num2").value) || 0;
var addition = num1 + num2;
document.querySelector(".output").innerHTML =
"दो संख्याओं का योग = " + addition;
}
</script>
</body>
</html>
चलाने का तरीका
फ़ाइल को addition.html नाम से सेव करें और VS Code में "Open with Live Server" से खोलें।
बेस्ट प्रैक्टिस
type="number"इनपुट में उपयोग करें (ब्राउज़र वैलिडेशन देता है)|| 0से खाली/अमान्य इनपुट के लिए डिफ़ॉल्ट 0 सेट करें- दशमलव संख्याओं के लिए
parseFloat()उपयोग करें - उपयोगकर्ता इनपुट को हमेशा वैलिडेट करें