Jak przekonwertować wartości dziesiętne na ich szesnastkowy odpowiednik w JavaScript?
javascript
hex
tostring
base
number-formatting
Luke Smith
źródło
źródło
Odpowiedzi:
Konwertuj liczbę na ciąg szesnastkowy za pomocą:
I odwróć proces za pomocą:
źródło
yourNumber
są zmiennymi. Jeśli chcesz użyć literału numerycznego, musisz zrobić coś takiego(45).toString(16)
, ale jeśli zapisujesz cyfrę na sztywno, po prostu napisz ją jako ciąg szesnastkowy ...(45).toString(16)
zawsze będzie równy'2d'
, więc nie marnuj procesora cykle, aby to rozgryźć.42..toString(16)
Jeśli potrzebujesz obsługiwać pola bitowe lub kolory 32-bitowe, musisz radzić sobie z podpisanymi liczbami. Funkcja JavaScript
toString(16)
zwróci ujemną liczbę szesnastkową, która zwykle nie jest tym, czego chcesz. Ta funkcja ma jakiś szalony dodatek, dzięki czemu jest liczbą dodatnią.źródło
number = 0x100000000 + number;
>>>
operatora można przekonwertować liczbę na reprezentację bez znaku, np .((-3253) >>> 0).toString(16)
Zwroty"fffff34b"
.+1
przydatny dodatek, ale jeśli konwertujesz liczby na inną notację, wszystkie liczby są już „zwykle” dodatnie, lub chcesz wyniki ujemne.Poniższy kod konwertuje wartość dziesiętną d na szesnastkową. Pozwala także dodać dopełnienie do wyniku szesnastkowego. Tak więc 0 będzie domyślnie 00.
źródło
źródło
function hexRep(number, width) { return (number+Math.pow(16, precision)).toString(16).slice(-width); }
const hex = d => Number(d).toString(16).padStart(2, '0')
😁Aby uzyskać kompletność, jeśli chcesz dwójkową reprezentację szesnastkową uzupełnienia liczby ujemnej, możesz użyć operatora przesunięcia zera i wypełnienia w prawo
>>>
. Na przykład:Jest jednak jedno ograniczenie: operatory bitowe JavaScript traktują swoje operandy jako sekwencję 32 bitów , co oznacza, że otrzymujemy uzupełnienie 32-bitowe dwa.
źródło
C# number to hexadecimal
przynosiłem inne wyniki niżJavascript number to hexadecimal
. Wygląda na to, że JavaScript ma problem z liczbami ujemnymi. Ta odpowiedź wydaje się być rozwiązaniem problemu.((-2)>>>0).toString(16).substring(2)
Z wyściółką:
źródło
Bez pętli:
Czy nie lepiej też nie używać testów pętli, które należy ocenić?
Na przykład zamiast:
mieć
źródło
Łącząc niektóre z tych dobrych pomysłów na funkcję RGB-wartość-szesnastkową (dodaj
#
gdzie indziej dla HTML / CSS):źródło
Przyjęta odpowiedź nie uwzględniała zwracanych jednocyfrowych kodów szesnastkowych. Można to łatwo regulować poprzez:
i
Uważam, że powyższe odpowiedzi zostały opublikowane wiele razy przez innych w takiej czy innej formie. Zawijam je w funkcję toHex () w następujący sposób:
Pamiętaj, że liczbowe wyrażenie regularne pochodzi z ponad 10 przydatnych funkcji wyrażeń regularnych JavaScript, które poprawiają wydajność twoich aplikacji internetowych .
Aktualizacja: Po kilkukrotnym przetestowaniu tej rzeczy znalazłem błąd (podwójne cudzysłowy w RegExp), więc to naprawiłem. JEDNAK! Po kilku testach i przeczytaniu posta przez almaz - zdałem sobie sprawę, że nie mogę uzyskać liczb ujemnych do działania.
Co więcej - przeczytałem o tym i ponieważ wszystkie numery JavaScript są przechowywane jako 64-bitowe słowa bez względu na wszystko - próbowałem zmodyfikować kod numHex, aby uzyskać 64-bitowe słowo. Ale okazuje się, że nie możesz tego zrobić. Jeśli wstawisz „3.14159265” JAKO NUMER do zmiennej - wszystko, co będziesz w stanie uzyskać, to „3”, ponieważ część ułamkowa jest dostępna tylko poprzez wielokrotne pomnożenie liczby przez dziesięć (IE: 10.0). Innymi słowy - wartość szesnastkowa 0xF powoduje, że wartość zmiennoprzecinkowa jest tłumaczona na liczbę całkowitą przed dodaniem AND, co usuwa wszystko poza kropką. Zamiast brać wartość jako całość (tj. 3,14159265) i ANDing zmiennoprzecinkowy wartość z wartością 0xf.
Najlepszą rzeczą do zrobienia w tym przypadku jest konwersja 3.14159265 na łańcuch, a następnie po prostu konwersja łańcucha. Z tego powodu ułatwia także konwersję liczb ujemnych, ponieważ znak minus po prostu staje się 0x26 z przodu wartości.
Więc postanowiłem, że zmienna zawiera liczbę - wystarczy przekonwertować ją na ciąg znaków i przekonwertować ciąg. Oznacza to dla wszystkich, że po stronie serwera będzie trzeba odznaczyć przychodzący ciąg, a następnie ustalić, czy przychodzące informacje są numeryczne. Możesz to łatwo zrobić, dodając „#” na początku liczb i „A” na początku powracającego ciągu znaków. Zobacz funkcję toHex ().
Baw się dobrze!
Po kolejnym roku i długich przemyśleniach zdecydowałem, że funkcja „toHex” (i mam również funkcję „fromHex”) naprawdę wymaga zmiany. Całe pytanie brzmiało: „Jak mogę to zrobić bardziej wydajnie?” Zdecydowałem, że funkcja szesnastkowa do / z nie powinna dbać o to, czy coś jest częścią ułamkową, ale jednocześnie powinna upewnić się, że części ułamkowe są zawarte w ciągu.
Więc pytanie brzmiało: „Skąd wiesz, że pracujesz z łańcuchem szesnastkowym?”. Odpowiedź jest prosta. Użyj standardowych informacji wstępnych, które są już rozpoznawane na całym świecie.
Innymi słowy - użyj „0x”. Więc teraz moja funkcja toHex sprawdza, czy już tam jest, a jeśli tak - po prostu zwraca ciąg, który został do niej wysłany. W przeciwnym razie konwertuje ciąg, liczbę, cokolwiek. Oto poprawiona funkcja toHex:
Jest to bardzo szybka funkcja, która bierze pod uwagę pojedyncze cyfry, liczby zmiennoprzecinkowe, a nawet sprawdza, czy dana osoba wysyła wartość szesnastkową, aby ponownie została przekreślona. Używa tylko czterech wywołań funkcji i tylko dwa z nich są w pętli. Aby cofnąć heksowanie używanych wartości:
Podobnie jak funkcja toHex (), funkcja fromHex () najpierw szuka „0x”, a następnie tłumaczy przychodzące informacje na ciąg, jeśli nie jest to już ciąg. Nie wiem, jak by to nie był sznurek - ale na wszelki wypadek - sprawdzam. Następnie funkcja przechodzi, przechwytuje dwa znaki i tłumaczy je na znaki ASCII. Jeśli chcesz, aby tłumaczył Unicode, musisz zmienić pętlę na cztery (4) znaki jednocześnie. Ale musisz także upewnić się, że łańcuch NIE jest podzielny przez cztery. Jeśli tak, to jest to standardowy ciąg szesnastkowy. (Pamiętaj, że ciąg ma z przodu „0x”).
Prosty skrypt testowy pokazujący, że -3,14159265, po przekonwertowaniu na ciąg znaków, ma nadal wartość -3,14159265.
Ze względu na to, jak JavaScript działa w odniesieniu do funkcji toString (), wszystkie te problemy można wyeliminować, które wcześniej powodowały problemy. Teraz wszystkie ciągi i liczby można łatwo przekonwertować. Co więcej, takie obiekty jak obiekty powodują błąd generowany przez sam JavaScript. Uważam, że jest to tak dobre, jak to możliwe. Jedyne ulepszenie, jakie pozostało, to włączenie przez W3C funkcji toHex () i fromHex () w JavaScript.
źródło
if( s.substr(0,2)
przedif (typeof s != "string")
prawdopodobnie nie jest to, co chcesz, na przykład. To, co wróciłem, nie było tym, czego się spodziewałem (toHex(0x1f635)
daje"0x313238353635"
). Nie badałem dalej.substr
&toLowerCase
na non-string ... więc albotypeof
trzeba przyjść wcześniej, albo, jeśli spodziewałeśtoHex
się rzucić non-string tutaj, powinieneśtypeof
całkowicie usunąć czek. Ma sens? To znaczy, gdybym użył kodu tutaj bez edycji i zadzwoniłtoHex(0x1f635)
, dostałbymUncaught TypeError: s.substr is not a function
. Jeśli przesunę rzut rzutu wcześniej, masz rację, być może liczba najpierw rzuci się na dziesiętną i wszystko pójdzie na boki. Co oczywiście oznacza, że nie można tu wykonać prostej obsady, jeślis
nie jest to struna.16 to podstawa, a liczba szesnastkowa zawiera 16 wartości :-)
źródło
Dla wszystkich zainteresowanych, oto JSFiddle porównujący większość odpowiedzi udzielonych na to pytanie .
A oto metoda, którą ostatecznie wybrałem:
Należy również pamiętać, że jeśli chcesz przekonwertować z dziesiętnego na szesnastkowy w celu użycia w CSS jako typu danych koloru , możesz zamiast tego wolić wyodrębnić wartości RGB z dziesiętnej i użyć rgb () .
Na przykład ( JSFiddle ):
Ustawia właściwość
#some-element
CSScolor
nargb(64, 62, 154)
.źródło
Ograniczone / uzupełnione do określonej liczby znaków:
źródło
Oto skrócona wersja ECMAScript 6:
źródło
źródło
color: rgb(r,g,b)
gdzie rg i b są liczbami dziesiętnymi.function decimalToHexString(i) { var result = "00"; 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 }
Jeśli chcesz przekonwertować liczbę na szesnastkową reprezentację wartości koloru RGBA, to jest to najbardziej przydatna kombinacja kilku wskazówek stąd:
źródło
Komentarz AFAIK 57807 jest niepoprawny i powinien wyglądać następująco: var hex = Number (d) .toString (16); zamiast var hex = parseInt (d, 16);
źródło
A jeśli liczba jest ujemna?
Oto moja wersja.
źródło
Robię konwersję na ciąg szesnastkowy w dość dużej pętli, więc wypróbowałem kilka technik, aby znaleźć najszybszą. W rezultacie moje wymagania miały mieć ciąg o stałej długości i poprawnie kodować wartości ujemne (-1 => ff..f).
Prosty
.toString(16)
nie działało dla mnie, ponieważ potrzebowałem poprawnie zakodowanych wartości ujemnych. Poniższy kod jest najszybszym, jaki do tej pory testowałem na wartościach 1-2 bajtowych (zwróć uwagę, żesymbols
określa liczbę symboli wyjściowych, które chcesz uzyskać, to znaczy dla 4-bajtowej liczby całkowitej powinien wynosić 8):Działa szybciej niż
.toString(16)
na liczbach 1-2 bajtowych i wolniej na większych liczbach (gdysymbols
> = 6), ale nadal powinien przewyższać metody, które poprawnie kodują wartości ujemne.źródło
Zgodnie z przyjętą odpowiedzią najłatwiejszym sposobem konwersji z dziesiętnego na szesnastkowy jest
var hex = dec.toString(16)
. Możesz jednak dodać konwersję ciągów, ponieważ zapewnia to, że takie reprezentacje ciągów"12".toString(16)
działają poprawnie.Aby odwrócić proces, możesz również skorzystać z poniższego rozwiązania, ponieważ jest ono jeszcze krótsze.
Wydaje się być wolniejszy w Google Chrome i Firefox, ale w Operze jest znacznie szybszy. Zobacz http://jsperf.com/hex-to-dec .
źródło
Jak przekonwertować liczbę dziesiętną na szesnastkową w JavaScript
Nie byłem w stanie znaleźć brutalnie czystej / prostej konwersji dziesiętnej na szesnastkową, która nie wymagałaby bałaganu funkcji i tablic ... więc musiałem to zrobić dla siebie.
źródło
Podsumowując wszystko;
Jeśli jednak nie musisz konwertować go z powrotem na liczbę całkowitą (np. W przypadku kolorów), wystarczy upewnić się, że wartości nie są ujemne.
źródło
Nie znalazłem jasnej odpowiedzi, bez sprawdzenia, czy jest ona negatywna czy pozytywna, która używa uzupełnienia do dwóch (włączając liczby ujemne). W tym celu pokazuję moje rozwiązanie jednobajtowemu:
Możesz użyć tej instrukcji do dowolnej liczby bajtów, tylko dodajesz
FF
w odpowiednich miejscach. Na przykład do dwóch bajtów:Jeśli chcesz rzutować liczbę całkowitą tablicy na ciąg szesnastkowy:
źródło
Jeśli chcesz przekonwertować na „pełną” reprezentację JavaScript lub CSS, możesz użyć czegoś takiego:
źródło
Możesz zrobić coś takiego w ECMAScript 6 :
źródło
Jeśli chcesz przekonwertować duże liczby całkowite, tzn. Liczby większe niż liczba.MAX_SAFE_INTEGER - 9007199254740991, możesz użyć następującego kodu
źródło
Jest to oparte na rozwiązaniach Prestaul i Tod. Jest to jednak uogólnienie uwzględniające zmienny rozmiar zmiennej (np. Parsing podpisana wartość z dziennika szeregowego mikrokontrolera).
Skrypt testowy:
Wyniki testów:
Uwaga: Nie jestem pewien, dlaczego zawodzi powyżej 32-bitowego rozmiaru
źródło
Oto moje rozwiązanie:
Pytanie brzmi: „Jak przekonwertować dziesiętne na szesnastkowe w JavaScript” . Chociaż pytanie nie określa, że ciąg szesnastkowy powinien zaczynać się od przedrostka 0x, każdy, kto pisze kod, powinien wiedzieć, że 0x jest dodawany do kodów szesnastkowych w celu odróżnienia kodów szesnastkowych od identyfikatorów programowych i innych liczb (1234 może być szesnastkowy, dziesiętny lub nawet ósemkowy).
Dlatego, aby poprawnie odpowiedzieć na to pytanie, w celu pisania skryptów, musisz dodać przedrostek 0x.
Funkcja Math.abs (N) konwertuje negatywy na pozytywy, a jako bonus nie wygląda na to, że ktoś przejechał go przez rębak.
Odpowiedź, której potrzebowałem, miałaby specyfikator szerokości pola, dzięki czemu moglibyśmy na przykład pokazywać wartości 8/16/32/64-bitowe w sposób, w jaki widziałbyś je na liście w aplikacji do edycji szesnastkowej. To jest właściwa, prawidłowa odpowiedź.
źródło
Number('0xFF') === 255;
dla wszystkich, którzy chcą operacji odwrotnej.