How do you convert numbers between different bases in JavaScript?
The API
To convert to a number from a hex string:
parseInt(string, radix)
string: Required. The string to be parsed
radix: Optional. A number (from 2 to 36) that represents the numeral system to be used
NumberObject.toString(radix)
- radix: Optional. Specifies the base radix you would like the number displayed as.
- 2 - The number will show as a binary value
- 8 - The number will show as an octal value
- 16 - The number will show as an hexadecimal value
Example Usage
Integer value to hex:
var i = 10;console.log( i.toString(16) );
Convert from one base to another in JavaScript
Call parseInt(str, fromBase)
to convert to base 10 (or rather, to an actual number), then call num.toString(toBase)
.
JavaScript Base10 to Base2 Function
This is because the value of num
is a string. So doing toString
on a string isn't going to do anything. You simply need to change num
to a number. You can do this by either doing var num = +val
or var num = parseInt(val)
:
function Dec2Bin(val){ var num = +val; var n = num.toString(2); convert.o.value = n;}
<form name="convert" class="alignment"> <input type="number" name="num"> <input type="button" value="Convert" onclick="Dec2Bin(num.value)"> <output name="o" value=""></output> </form>
How do I convert an integer to binary in JavaScript?
A solution i'd go with that's fine for 32-bits, is the code the end of this answer, which is from developer.mozilla.org(MDN), but with some lines added for A)formatting and B)checking that the number is in range.
Some suggested x.toString(2)
which doesn't work for negatives, it just sticks a minus sign in there for them, which is no good.
Fernando mentioned a simple solution of (x>>>0).toString(2);
which is fine for negatives, but has a slight issue when x is positive. It has the output starting with 1, which for positive numbers isn't proper 2s complement.
Anybody that doesn't understand the fact of positive numbers starting with 0 and negative numbers with 1, in 2s complement, could check this SO QnA on 2s complement. What is “2's Complement”?
A solution could involve prepending a 0 for positive numbers, which I did in an earlier revision of this answer. And one could accept sometimes having a 33bit number, or one could make sure that the number to convert is within range -(2^31)<=x<2^31-1. So the number is always 32bits. But rather than do that, you can go with this solution on mozilla.org
Patrick's answer and code is long and apparently works for 64-bit, but had a bug that a commenter found, and the commenter fixed patrick's bug, but patrick has some "magic number" in his code that he didn't comment about and has forgotten about and patrick no longer fully understands his own code / why it works.
Annan had some incorrect and unclear terminology but mentioned a solution by developer.mozilla.org
Note- the old link https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Bitwise_Operators now redirects elsewhere and doesn't have that content but the proper old link , which comes up when archive.org retrieves pages!, is available here https://web.archive.org/web/20150315015832/https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Bitwise_Operators
The solution there works for 32-bit numbers.
The code is pretty compact, a function of three lines.
But I have added a regex to format the output in groups of 8 bits. Based on How to format a number with commas as thousands separators? (I just amended it from grouping it in 3s right to left and adding commas, to grouping in 8s right to left, and adding spaces)
And, while mozilla made a comment about the size of nMask(the number fed in)..that it has to be in range, they didn't test for or throw an error when the number is out of range, so i've added that.
I'm not sure why they named their parameter 'nMask' but i'll leave that as is.
https://web.archive.org/web/20150315015832/https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Bitwise_Operators
function createBinaryString(nMask) {
// nMask must be between -2147483648 and 2147483647
if (nMask > 2**31-1)
throw "number too large. number shouldn't be > 2**31-1"; //added
if (nMask < -1*(2**31))
throw "number too far negative, number shouldn't be < -(2**31)" //added
for (var nFlag = 0, nShifted = nMask, sMask = ''; nFlag < 32;
nFlag++, sMask += String(nShifted >>> 31), nShifted <<= 1);
sMask=sMask.replace(/\B(?=(.{8})+(?!.))/g, " ") // added
return sMask;
}
console.log(createBinaryString(-1)) // "11111111 11111111 11111111 11111111"
console.log(createBinaryString(1024)) // "00000000 00000000 00000100 00000000"
console.log(createBinaryString(-2)) // "11111111 11111111 11111111 11111110"
console.log(createBinaryString(-1024)) // "11111111 11111111 11111100 00000000"
//added further console.log example
console.log(createBinaryString(2**31 -1)) //"01111111 11111111 11111111 11111111"
Related Topics
How to Know When I'Ve Stopped Scrolling
How to Send Images to Node Js with Axios
How Does Internationalization Work in JavaScript
Remove HTML Comments with Regex, in JavaScript
How to Sign into Google with Selenium Automation Because of "This Browser or App May Not Be Secure."
Alternative or Polyfill for Array.From on the Internet Explorer
Overriding Interface Property Type Defined in Typescript D.Ts File
Javascript: Listen for Attribute Change
Click Everywhere But Here Event
External Resource Not Being Loaded by Angularjs
Splicing a JavaScript Array from Within the Callback Passed to Foreach
Understanding JavaScript Immutable Variable
Why Does JavaScript Getyear() Return 108
What Is Ngdefaultcontrol in Angular
How to Reset the Scale/Zoom of a Web App on an Orientation Change on the Iphone