Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
Separating digits of a number in JavaScript
In JavaScript, separating digits of a number is a common programming task. This tutorial shows how to extract and display each digit of a number individually using different approaches.
Problem Statement
We need to create a program that takes a number as input and displays each digit separately. For example, if the input is 43354, the output should be:
4 3 3 5 4
Method 1: Using Mathematical Operations
This approach uses the modulo operator (%) and integer division to extract digits from right to left:
<!DOCTYPE html>
<html>
<head>
<title>Separate Digits</title>
</head>
<body>
<button onclick="separateDigits()">Enter Number</button>
<div id="output"></div>
<script>
function separateDigits() {
let num = parseInt(prompt("Enter a number:"));
let output = document.getElementById("output");
let digits = "";
if (isNaN(num) || num < 0) {
output.innerHTML = "<p>Please enter a valid positive number</p>";
return;
}
let temp = num;
while (temp > 0) {
let digit = temp % 10;
temp = Math.floor(temp / 10);
digits = "<p>" + digit + "</p>" + digits; // Prepend to maintain order
}
output.innerHTML = digits || "<p>0</p>"; // Handle zero case
}
</script>
</body>
</html>
Method 2: Using String Conversion
A simpler approach converts the number to a string and iterates through each character:
function separateDigitsString(num) {
let numStr = num.toString();
let digits = [];
for (let i = 0; i < numStr.length; i++) {
if (numStr[i] !== '-') { // Skip negative sign
digits.push(parseInt(numStr[i]));
}
}
return digits;
}
// Example usage
let number = 43354;
let result = separateDigitsString(number);
console.log("Number:", number);
result.forEach(digit => console.log(digit));
Number: 43354 4 3 3 5 4
Method 3: Using Array Methods
This modern approach uses array methods for a more functional programming style:
function separateDigitsArray(num) {
return Math.abs(num)
.toString()
.split('')
.map(digit => parseInt(digit));
}
// Example with different numbers
let numbers = [12345, 9876, 102];
numbers.forEach(num => {
console.log(`Digits of ${num}:`);
separateDigitsArray(num).forEach(digit => console.log(digit));
console.log('---');
});
Digits of 12345: 1 2 3 4 5 --- Digits of 9876: 9 8 7 6 --- Digits of 102: 1 0 2 ---
Comparison
| Method | Approach | Handles Zero? | Code Complexity |
|---|---|---|---|
| Mathematical | Modulo & Division | Requires special handling | Medium |
| String Conversion | toString() & Loop | Yes | Low |
| Array Methods | Functional approach | Yes | Very Low |
Handling Edge Cases
function separateDigitsComplete(num) {
// Handle non-numeric input
if (typeof num !== 'number' || isNaN(num)) {
return "Invalid input";
}
// Handle zero
if (num === 0) {
return [0];
}
// Handle negative numbers
let absNum = Math.abs(num);
let digits = absNum.toString().split('').map(d => parseInt(d));
return digits;
}
// Test edge cases
console.log("Zero:", separateDigitsComplete(0));
console.log("Negative:", separateDigitsComplete(-123));
console.log("Invalid:", separateDigitsComplete("abc"));
Zero: [ 0 ] Negative: [ 1, 2, 3 ] Invalid: Invalid input
Conclusion
The string conversion method is most straightforward for separating digits, while array methods provide cleaner code. Choose the mathematical approach when you need to understand the underlying logic of digit extraction.
1K+ Views
