Cómo convertir decimal a hexadecimal en JavaScript

¿Cómo se convierten los valores decimales a su equivalente hexadecimal en JavaScript?

Convierta un número en una cadena hexadecimal con:

hexString = yourNumber.toString(16);

Y revierta el proceso con:

yourNumber = parseInt(hexString, 16);

Si necesita manejar cosas como campos de bits o colores de 32 bits, debe tratar con números con signo. La función de JavaScript toString(16)devolverá un número hexadecimal negativo que generalmente no es lo que desea. Esta función hace una adición loca para que sea un número positivo.

function decimalToHexString(number)
{
  if (number < 0)
  {
    number = 0xFFFFFFFF + number + 1;
  }

  return number.toString(16).toUpperCase();
}

console.log(decimalToHexString(27));
console.log(decimalToHexString(48.6));

El siguiente código convertirá el valor decimal d en hexadecimal. También le permite agregar relleno al resultado hexadecimal. Entonces 0 se convertirá en 00 por defecto.

function decimalToHex(d, padding) {
    var hex = Number(d).toString(16);
    padding = typeof (padding) === "undefined" || padding === null ? padding = 2 : padding;

    while (hex.length < padding) {
        hex = "0" + hex;
    }

    return hex;
}

function toHex(d) {
    return  ("0"+(Number(d).toString(16))).slice(-2).toUpperCase()
}

Para completar, si desea la representación hexadecimal del complemento a dos de un número negativo, puede usar el operador de desplazamiento de relleno cero a la derecha>>> . Por ejemplo:

> (-1).toString(16)
"-1"

> ((-2)>>>0).toString(16)
"fffffffe"

Sin embargo, hay una limitación: los operadores de bits de JavaScript tratan sus operandos como una secuencia de 32 bits , es decir, obtienes el complemento de dos de 32 bits.

Con acolchado:

function dec2hex(i) {
   return (i+0x10000).toString(16).substr(-4).toUpperCase();
}

Sin el bucle:

function decimalToHex(d) {
  var hex = Number(d).toString(16);
  hex = "000000".substr(0, 6 - hex.length) + hex;
  return hex;
}

// Or "#000000".substr(0, 7 - hex.length) + hex;
// Or whatever
// *Thanks to MSDN

Además, ¿no es mejor no usar pruebas de bucle que deben evaluarse?

Por ejemplo, en lugar de:

for (var i = 0; i < hex.length; i++){}

tener

for (var i = 0, var j = hex.length; i < j; i++){}

Combinando algunas de estas buenas ideas para una función de valor RGB a hexadecimal (agregue la #otra parte para HTML / CSS):

function rgb2hex(r,g,b) {
    if (g !== undefined)
        return Number(0x1000000 + r*0x10000 + g*0x100 + b).toString(16).substring(1);
    else
        return Number(0x1000000 + r[0]*0x10000 + r[1]*0x100 + r[2]).toString(16).substring(1);
}

La respuesta aceptada no tuvo en cuenta los códigos hexadecimales devueltos de un solo dígito. Esto se ajusta fácilmente mediante:

function numHex(s)
{
    var a = s.toString(16);
    if ((a.length % 2) > 0) {
        a = "0" + a;
    }
    return a;
}

y

function strHex(s)
{
    var a = "";
    for (var i=0; i<s.length; i++) {
        a = a + numHex(s.charCodeAt(i));
    }

    return a;
}

Creo que las respuestas anteriores han sido publicadas en numerosas ocasiones por otros de una forma u otra. Los envuelvo en una función toHex () así:

function toHex(s)
{
    var re = new RegExp(/^\s*(\+|-)?((\d+(\.\d+)?)|(\.\d+))\s*$/);

    if (re.test(s)) {
        return '#' + strHex( s.toString());
    }
    else {
        return 'A' + strHex(s);
    }
}

Tenga en cuenta que la expresión regular numérica proviene de más de 10 funciones útiles de expresión regular de JavaScript para mejorar la eficiencia de sus aplicaciones web .

Actualización: después de probar esto varias veces, encontré un error (comillas dobles en RegExp), así que lo solucioné. ¡SIN EMBARGO! Después de probar un poco y haber leído la publicación de almaz, me di cuenta de que no podía obtener números negativos para trabajar.

Además, leí un poco sobre esto y, dado que todos los números de JavaScript se almacenan como palabras de 64 bits, pase lo que pase, intenté modificar el código numHex para obtener la palabra de 64 bits. Pero resulta que no puedes hacer eso. Si coloca "3.14159265" COMO NÚMERO en una variable, todo lo que podrá obtener es el "3", porque la porción fraccional solo es accesible multiplicando el número por diez (IE: 10.0) repetidamente. O para decirlo de otra manera: el valor hexadecimal de 0xF hace que el valor de coma flotante se traduzca a un número entero antes de ser AND, lo que elimina todo lo que está detrás del punto. En lugar de tomar el valor como un todo (es decir: 3.14159265) y ANDing el punto flotante valor de contra el valor 0xF.

Entonces, lo mejor que puede hacer, en este caso, es convertir el 3.14159265 en una cadena y luego simplemente convertir la cadena. Debido a lo anterior, también facilita la conversión de números negativos porque el signo menos se convierte en 0x26 en el frente del valor.

Entonces, lo que hice fue determinar que la variable contiene un número, simplemente convertirlo en una cadena y convertir la cadena. Esto significa para todos que, en el lado del servidor, necesitará eliminar la cadena de entrada y luego determinar que la información entrante es numérica. Puede hacerlo fácilmente simplemente agregando un "#" al frente de los números y "A" al frente de una cadena de caracteres que regresa. Vea la función toHex ().

¡Que te diviertas!

Después de otro año y mucho pensar, decidí que la función "toHex" (y también tengo una función "fromHex") realmente necesitaba ser renovada. Toda la pregunta era "¿Cómo puedo hacer esto de manera más eficiente?" Decidí que una función hexadecimal to / from no debería importarle si algo es una parte fraccionaria, pero al mismo tiempo debería garantizar que las partes fraccionarias estén incluidas en la cadena.

Entonces la pregunta se convirtió en "¿Cómo sabes que estás trabajando con una cadena hexadecimal?". La respuesta es simple. Utilice la información estándar previa a la cadena que ya se reconoce en todo el mundo.

En otras palabras, use "0x". Entonces, mi función toHex mira para ver si eso ya está allí y si lo está, solo devuelve la cadena que se le envió. De lo contrario, convierte la cadena, el número, lo que sea. Aquí está la función toHex revisada:

/////////////////////////////////////////////////////////////////////////////
//  toHex().  Convert an ASCII string to hexadecimal.
/////////////////////////////////////////////////////////////////////////////
toHex(s)
{
    if (s.substr(0,2).toLowerCase() == "0x") {
        return s;
    }

    var l = "0123456789ABCDEF";
    var o = "";

    if (typeof s != "string") {
        s = s.toString();
    }
    for (var i=0; i<s.length; i++) {
        var c = s.charCodeAt(i);

        o = o + l.substr((c>>4),1) + l.substr((c & 0x0f),1);
    }

    return "0x" + o;
}

Esta es una función muy rápida que tiene en cuenta dígitos individuales, números de coma flotante e incluso verifica si la persona está enviando un valor hexadecimal para que se vuelva a hechizar. Solo usa cuatro llamadas a funciones y solo dos de ellas están en el bucle. Para deshechar los valores que usa:

/////////////////////////////////////////////////////////////////////////////
//  fromHex().  Convert a hex string to ASCII text.
/////////////////////////////////////////////////////////////////////////////
fromHex(s)
{
    var start = 0;
    var o = "";

    if (s.substr(0,2).toLowerCase() == "0x") {
        start = 2;
    }

    if (typeof s != "string") {
        s = s.toString();
    }
    for (var i=start; i<s.length; i+=2) {
        var c = s.substr(i, 2);

        o = o + String.fromCharCode(parseInt(c, 16));
    }

    return o;
}

Al igual que la función toHex (), la función fromHex () primero busca el "0x" y luego traduce la información entrante en una cadena si aún no es una cadena. No sé cómo no sería una cadena, pero por las dudas, lo compruebo. Luego, la función se ejecuta, captura dos caracteres y los traduce a caracteres ASCII. Si desea que traduzca Unicode, deberá cambiar el bucle a cuatro (4) caracteres a la vez. Pero también debe asegurarse de que la cadena NO sea divisible por cuatro. Si es así, entonces es una cadena hexadecimal estándar. (Recuerde que la cadena tiene "0x" en la parte delantera).

Un script de prueba simple para mostrar que -3.14159265, cuando se convierte en una cadena, sigue siendo -3.14159265.

<?php

    echo <<<EOD
<html>
    <head><title>Test</title>
        <script>
            var a = -3.14159265;
            alert( "A = " + a );
            var b = a.toString();
            alert( "B = " + b );
        </script>
    </head>
    <body>
    </body>
</html>
EOD;

?>

Debido a cómo funciona JavaScript con respecto a la función toString (), se pueden eliminar todos esos problemas que antes causaban problemas. Ahora todas las cadenas y números se pueden convertir fácilmente. Además, cosas como los objetos provocarán un error generado por el propio JavaScript. Creo que esto es tan bueno como parece. La única mejora que queda es que W3C solo incluya una función toHex () y fromHex () en JavaScript.

var number = 3200;
var hexString = number.toString(16);

El 16 es la raíz y hay 16 valores en un número hexadecimal :-)

Para cualquier persona interesada, aquí hay un JSFiddle que compara la mayoría de las respuestas dadas a esta pregunta .

Y aquí está el método con el que terminé yendo:

function decToHex(dec) {
  return (dec + Math.pow(16, 6)).toString(16).substr(-6)
}

Además, tenga en cuenta que si está buscando convertir de decimal a hexadecimal para usar en CSS como un tipo de datos de color , puede preferir extraer los valores RGB del decimal y usar rgb () .

Por ejemplo ( JSFiddle ):

let c = 4210330 // your color in decimal format
let rgb = [(c & 0xff0000) >> 16,  (c & 0x00ff00) >> 8,  (c & 0x0000ff)]

// Vanilla JS:
document..getElementById('some-element').style.color = 'rgb(' + rgb + ')'
// jQuery:
$('#some-element').css('color', 'rgb(' + rgb + ')')

Esto establece #some-elementla colorpropiedad CSS de rgb(64, 62, 154).

Restringido / rellenado a un número establecido de caracteres:

function decimalToHex(decimal, chars) {
    return (decimal + Math.pow(16, chars)).toString(16).slice(-chars).toUpperCase();
}

Aquí hay una versión recortada de ECMAScript 6:

const convert = {
  bin2dec : s => parseInt(s, 2).toString(10),
  bin2hex : s => parseInt(s, 2).toString(16),
  dec2bin : s => parseInt(s, 10).toString(2),
  dec2hex : s => parseInt(s, 10).toString(16),
  hex2bin : s => parseInt(s, 16).toString(2),
  hex2dec : s => parseInt(s, 16).toString(10)
};

convert.bin2dec('111'); // '7'
convert.dec2hex('42');  // '2a'
convert.hex2bin('f8');  // '11111000'
convert.dec2bin('22');  // '10110'

function dec2hex(i)
{
  var result = "0000";
  if      (i >= 0    && i <= 15)    { result = "000" + i.toString(16); }
  else if (i >= 16   && i <= 255)   { result = "00"  + i.toString(16); }
  else if (i >= 256  && i <= 4095)  { result = "0"   + i.toString(16); }
  else if (i >= 4096 && i <= 65535) { result =         i.toString(16); }
  return result
}

Si desea convertir un número a una representación hexadecimal de un valor de color RGBA, he encontrado que esta es la combinación más útil de varios consejos desde aquí:

function toHexString(n) {
    if(n < 0) {
        n = 0xFFFFFFFF + n + 1;
    }
    return "0x" + ("00000000" + n.toString(16).toUpperCase()).substr(-8);
}

El comentario AFAIK 57807 es incorrecto y debería ser algo así como: var hex = Number (d) .toString (16); en lugar de var hex = parseInt (d, 16);

function decimalToHex(d, padding) {
    var hex = Number(d).toString(16);
    padding = typeof (padding) === "undefined" || padding === null ? padding = 2 : padding;

    while (hex.length < padding) {
        hex = "0" + hex;
    }

    return hex;
}

¿Y si el número es negativo?

Aquí está mi versión.

function hexdec (hex_string) {
    hex_string=((hex_string.charAt(1)!='X' && hex_string.charAt(1)!='x')?hex_string='0X'+hex_string : hex_string);
    hex_string=(hex_string.charAt(2)<8 ? hex_string =hex_string-0x00000000 : hex_string=hex_string-0xFFFFFFFF-1);
    return parseInt(hex_string, 10);
}

Estoy haciendo la conversión a una cadena hexadecimal en un bucle bastante grande, así que probé varias técnicas para encontrar la más rápida. Mis requisitos eran tener una cadena de longitud fija como resultado y codificar los valores negativos correctamente (-1 => ff..f).

Simple .toString(16)no funcionó para mí, ya que necesitaba valores negativos para codificar correctamente. El siguiente código es el más rápido que he probado hasta ahora en valores de 1-2 bytes (tenga en cuenta que symbolsdefine el número de símbolos de salida que desea obtener, es decir, para un entero de 4 bytes, debería ser igual a 8):

var hex = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'a', 'b', 'c', 'd', 'e', 'f'];
function getHexRepresentation(num, symbols) {
    var result = '';
    while (symbols--) {
        result = hex[num & 0xF] + result;
        num >>= 4;
    }
    return result;
}

Funciona más rápido que .toString(16)en números de 1-2 bytes y más lento en números más grandes (cuando symbols> = 6), pero aún así debe superar a los métodos que codifican los valores negativos correctamente.

Como dice la respuesta aceptada, la forma más fácil de convertir de decimal a hexadecimal es var hex = dec.toString(16). Sin embargo, es posible que prefiera agregar una conversión de cadena, ya que garantiza que las representaciones de cadena "12".toString(16)funcionen correctamente.

// Avoids a hard-to-track-down bug by returning `c` instead of `12`
(+"12").toString(16);

Para revertir el proceso, también puede usar la solución a continuación, ya que es aún más corta.

var dec = +("0x" + hex);

Parece ser más lento en Google Chrome y Firefox, pero es significativamente más rápido en Opera. Ver http://jsperf.com/hex-to-dec .

Cómo convertir decimal a hexadecimal en JavaScript

No pude encontrar una conversión de decimal a hexadecimal brutalmente limpia / simple que no involucrara un desorden de funciones y matrices ... así que tuve que hacer esto por mí mismo.

function DecToHex(decimal) { // Data (decimal)

    length = -1;    // Base string length
    string = '';    // Source 'string'

    characters = [ '0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F' ]; // character array

    do { // Grab each nibble in reverse order because JavaScript has no unsigned left shift

        string += characters[decimal & 0xF];   // Mask byte, get that character
        ++length;                              // Increment to length of string

    } while (decimal >>>= 4); // For next character shift right 4 bits, or break on 0

    decimal += 'x'; // Convert that 0 into a hex prefix string -> '0x'

    do
        decimal += string[length];
    while (length--); // Flip string forwards, with the prefixed '0x'

    return (decimal); // return (hexadecimal);
}

/* Original: */

D = 3678;    // Data (decimal)
C = 0xF;    // Check
A = D;        // Accumulate
B = -1;        // Base string length
S = '';        // Source 'string'
H = '0x';    // Destination 'string'

do {
    ++B;
    A& = C;

    switch(A) {
        case 0xA: A='A'
        break;

        case 0xB: A='B'
        break;

        case 0xC: A='C'
        break;

        case 0xD: A='D'
        break;

        case 0xE: A='E'
        break;

        case 0xF: A='F'
        break;

        A = (A);
    }
    S += A;

    D >>>= 0x04;
    A = D;
} while(D)

do
    H += S[B];
while (B--)

S = B = A = C = D; // Zero out variables
alert(H);    // H: holds hexadecimal equivalent

Para resumir todo esto;

function toHex(i, pad) {

  if (typeof(pad) === 'undefined' || pad === null) {
    pad = 2;
  } 

  var strToParse = i.toString(16);

  while (strToParse.length < pad) {
    strToParse = "0" + strToParse;
  }

  var finalVal =  parseInt(strToParse, 16);

  if ( finalVal < 0 ) {
    finalVal = 0xFFFFFFFF + finalVal + 1;
  }

  return finalVal;
}

Sin embargo, si no necesita convertirlo de nuevo a un número entero al final (es decir, para los colores), bastará con asegurarse de que los valores no sean negativos.

No he encontrado una respuesta clara, sin verificaciones si es negativa o positiva, que utiliza el complemento de dos (números negativos incluidos). Para eso, muestro mi solución a un byte:

((0xFF + number +1) & 0x0FF).toString(16);

Puede usar esta instrucción para cualquier número de bytes, solo que agrega FFen los lugares respectivos. Por ejemplo, a dos bytes:

((0xFFFF + number +1) & 0x0FFFF).toString(16);

Si desea convertir un entero de matriz en una cadena hexadecimal:

s = "";
for(var i = 0; i < arrayNumber.length; ++i) {
    s += ((0xFF + arrayNumber[i] +1) & 0x0FF).toString(16);
}

En caso de que desee convertir a una representación 'completa' de JavaScript o CSS, puede usar algo como:

  numToHex = function(num) {
    var r=((0xff0000&num)>>16).toString(16),
        g=((0x00ff00&num)>>8).toString(16),
        b=(0x0000ff&num).toString(16);
    if (r.length==1) { r = '0'+r; }
    if (g.length==1) { g = '0'+g; }
    if (b.length==1) { b = '0'+b; }
    return '0x'+r+g+b;                 // ('#' instead of'0x' for CSS)
  };

  var dec = 5974678;
  console.log( numToHex(dec) );        // 0x5b2a96

Puede hacer algo como esto en ECMAScript 6 :

const toHex = num => (num).toString(16).toUpperCase();

Si está buscando convertir números enteros grandes, es decir, números mayores que Number.MAX_SAFE_INTEGER - 9007199254740991, puede usar el siguiente código

const hugeNumber = "9007199254740991873839" // Make sure its in String
const hexOfHugeNumber = BigInt(hugeNumber).toString(16);
console.log(hexOfHugeNumber)

Esto se basa en las soluciones de Prestaul y Tod. Sin embargo, esta es una generalización que explica el tamaño variable de una variable (por ejemplo, analizar el valor firmado de un registro serie del microcontrolador).

function decimalToPaddedHexString(number, bitsize)
{ 
  let byteCount = Math.ceil(bitsize/8);
  let maxBinValue = Math.pow(2, bitsize)-1;

  /* In node.js this function fails for bitsize above 32bits */
  if (bitsize > 32)
    throw "number above maximum value";

  /* Conversion to unsigned form based on  */
  if (number < 0)
    number = maxBinValue + number + 1;

  return "0x"+(number >>> 0).toString(16).toUpperCase().padStart(byteCount*2, '0');
}

Script de prueba:

for (let n = 0 ; n < 64 ; n++ ) { 
     let s=decimalToPaddedHexString(-1, n); 
     console.log(`decimalToPaddedHexString(-1,${(n+"").padStart(2)}) = ${s.padStart(10)} = ${("0b"+parseInt(s).toString(2)).padStart(34)}`);
   }

Resultados de la prueba:

decimalToPaddedHexString(-1, 0) =        0x0 =                                0b0
decimalToPaddedHexString(-1, 1) =       0x01 =                                0b1
decimalToPaddedHexString(-1, 2) =       0x03 =                               0b11
decimalToPaddedHexString(-1, 3) =       0x07 =                              0b111
decimalToPaddedHexString(-1, 4) =       0x0F =                             0b1111
decimalToPaddedHexString(-1, 5) =       0x1F =                            0b11111
decimalToPaddedHexString(-1, 6) =       0x3F =                           0b111111
decimalToPaddedHexString(-1, 7) =       0x7F =                          0b1111111
decimalToPaddedHexString(-1, 8) =       0xFF =                         0b11111111
decimalToPaddedHexString(-1, 9) =     0x01FF =                        0b111111111
decimalToPaddedHexString(-1,10) =     0x03FF =                       0b1111111111
decimalToPaddedHexString(-1,11) =     0x07FF =                      0b11111111111
decimalToPaddedHexString(-1,12) =     0x0FFF =                     0b111111111111
decimalToPaddedHexString(-1,13) =     0x1FFF =                    0b1111111111111
decimalToPaddedHexString(-1,14) =     0x3FFF =                   0b11111111111111
decimalToPaddedHexString(-1,15) =     0x7FFF =                  0b111111111111111
decimalToPaddedHexString(-1,16) =     0xFFFF =                 0b1111111111111111
decimalToPaddedHexString(-1,17) =   0x01FFFF =                0b11111111111111111
decimalToPaddedHexString(-1,18) =   0x03FFFF =               0b111111111111111111
decimalToPaddedHexString(-1,19) =   0x07FFFF =              0b1111111111111111111
decimalToPaddedHexString(-1,20) =   0x0FFFFF =             0b11111111111111111111
decimalToPaddedHexString(-1,21) =   0x1FFFFF =            0b111111111111111111111
decimalToPaddedHexString(-1,22) =   0x3FFFFF =           0b1111111111111111111111
decimalToPaddedHexString(-1,23) =   0x7FFFFF =          0b11111111111111111111111
decimalToPaddedHexString(-1,24) =   0xFFFFFF =         0b111111111111111111111111
decimalToPaddedHexString(-1,25) = 0x01FFFFFF =        0b1111111111111111111111111
decimalToPaddedHexString(-1,26) = 0x03FFFFFF =       0b11111111111111111111111111
decimalToPaddedHexString(-1,27) = 0x07FFFFFF =      0b111111111111111111111111111
decimalToPaddedHexString(-1,28) = 0x0FFFFFFF =     0b1111111111111111111111111111
decimalToPaddedHexString(-1,29) = 0x1FFFFFFF =    0b11111111111111111111111111111
decimalToPaddedHexString(-1,30) = 0x3FFFFFFF =   0b111111111111111111111111111111
decimalToPaddedHexString(-1,31) = 0x7FFFFFFF =  0b1111111111111111111111111111111
decimalToPaddedHexString(-1,32) = 0xFFFFFFFF = 0b11111111111111111111111111111111
Thrown: 'number above maximum value'

Nota: no estoy muy seguro de por qué falla por encima de 32 bits

Aquí está mi solución:

hex = function(number) {
  return '0x' + Math.abs(number).toString(16);
}

La pregunta dice: "Cómo convertir decimal a hexadecimal en JavaScript" . Mientras que la pregunta no especifica que la cadena hexadecimal debe comenzar con un prefijo 0x, cualquiera que escriba código debe saber que 0x se agrega a los códigos hexadecimales para distinguir los códigos hexadecimales de los identificadores programáticos y otros números (1234 podría ser hexadecimal, decimal o incluso octal).

Por lo tanto, para responder correctamente a esta pregunta, con el fin de escribir guiones, debe agregar el prefijo 0x.

La función Math.abs (N) convierte los negativos en positivos, y como beneficio adicional, no parece que alguien lo haya pasado por una astilladora.

La respuesta que quería, habría tenido un especificador de ancho de campo, por lo que podríamos, por ejemplo, mostrar valores de 8/16/32/64 bits de la forma en que los vería en una aplicación de edición hexadecimal. Esa es la respuesta correcta real.