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
How to convert a string into an integer without using parseInt() function in JavaScript?
The parseInt() is a built-in function in JavaScript that parses a string and returns an integer. However, there are times when we want to convert a string into an integer without using this function. In this article, we'll explore several alternative methods to achieve this conversion.
Using the Unary Plus Operator
One way to convert a string into an integer is by using the unary plus operator (+). This operator converts its operand into a number. For instance, the following program converts the string "123" into the number 123:
<html>
<head>
<title>Unary Plus Operator Example</title>
</head>
<body>
<div id="result1"></div>
<div id="result2"></div>
<div id="result3"></div>
<script>
let str = "123";
document.getElementById("result1").innerHTML = "Original: " + str + " (type: " + typeof str + ")";
let num = +str; // Convert to number using unary plus
document.getElementById("result2").innerHTML = "Converted: " + num;
document.getElementById("result3").innerHTML = "Type after conversion: " + typeof num;
</script>
</body>
</html>
The unary plus operator can also convert other values into numbers, including booleans:
<html>
<head>
<title>Boolean Conversion Example</title>
</head>
<body>
<div id="result"></div>
<script>
let bool = true;
let num = +bool; // Converts true to 1
document.getElementById("result").innerHTML = "Boolean " + bool + " converted to: " + num;
</script>
</body>
</html>
Using the Number() Function
Another way to convert a string into a number is by using the Number() function. This function takes an argument and returns a number:
<html>
<head>
<title>Number() Function Example</title>
</head>
<body>
<div id="result1"></div>
<div id="result2"></div>
<div id="result3"></div>
<script>
let str = "456";
document.getElementById("result1").innerHTML = "Original: " + str + " (type: " + typeof str + ")";
let num = Number(str); // Convert using Number()
document.getElementById("result2").innerHTML = "Converted: " + num;
document.getElementById("result3").innerHTML = "Type after conversion: " + typeof num;
</script>
</body>
</html>
The Number() function can also convert booleans and other values:
<html>
<head>
<title>Number() with Boolean</title>
</head>
<body>
<div id="result"></div>
<script>
let bool = false;
let num = Number(bool); // Converts false to 0
document.getElementById("result").innerHTML = "Boolean " + bool + " converted to: " + num;
</script>
</body>
</html>
Using the Math.floor() Function
The Math.floor() function returns the largest integer less than or equal to a given number. When combined with string-to-number conversion, it can convert a string to an integer:
<html>
<head>
<title>Math.floor() Example</title>
</head>
<body>
<div id="result1"></div>
<div id="result2"></div>
<div id="result3"></div>
<script>
let str = "123.7";
document.getElementById("result1").innerHTML = "Original: " + str + " (type: " + typeof str + ")";
let num = Math.floor(str); // Converts and floors the number
document.getElementById("result2").innerHTML = "Converted: " + num;
document.getElementById("result3").innerHTML = "Type after conversion: " + typeof num;
</script>
</body>
</html>
Using Bitwise Operators
Bitwise operators perform operations on binary representations of numbers. The bitwise OR operator (|) with 0 can convert strings to integers by forcing type conversion:
<html>
<head>
<title>Bitwise Operator Example</title>
</head>
<body>
<div id="result1"></div>
<div id="result2"></div>
<div id="result3"></div>
<script>
let str = "765";
document.getElementById("result1").innerHTML = "Original: " + str + " (type: " + typeof str + ")";
let num = str | 0; // Bitwise OR with 0
document.getElementById("result2").innerHTML = "Converted: " + num;
document.getElementById("result3").innerHTML = "Type after conversion: " + typeof num;
</script>
</body>
</html>
Using the Math.ceil() Function
The Math.ceil() function returns the smallest integer greater than or equal to a given number. It can also be used for string-to-integer conversion:
<html>
<head>
<title>Math.ceil() Example</title>
</head>
<body>
<div id="result1"></div>
<div id="result2"></div>
<div id="result3"></div>
<script>
let str = "123.2";
document.getElementById("result1").innerHTML = "Original: " + str + " (type: " + typeof str + ")";
let num = Math.ceil(str); // Converts and rounds up
document.getElementById("result2").innerHTML = "Converted: " + num;
document.getElementById("result3").innerHTML = "Type after conversion: " + typeof num;
</script>
</body>
</html>
Comparison of Methods
| Method | Syntax | Handles Decimals | Performance |
|---|---|---|---|
| Unary Plus | +str |
Yes (preserves decimals) | Fastest |
| Number() | Number(str) |
Yes (preserves decimals) | Fast |
| Math.floor() | Math.floor(str) |
Yes (rounds down) | Moderate |
| Bitwise OR | str | 0 |
Yes (truncates) | Fast |
| Math.ceil() | Math.ceil(str) |
Yes (rounds up) | Moderate |
Conclusion
There are several effective ways to convert strings to integers without using parseInt(). The unary plus operator (+) and Number() function are the most straightforward for general conversion, while Math.floor(), Math.ceil(), and bitwise operators provide additional control over decimal handling.
