web-dev-qa-db-ja.com

Javascriptで16進文字列と16進値をより簡単に操作する

16進数(実際には16進数の色)を表す文字列を取得し、それらを追加しています。したがって、aaaaaa + 010101 = abababを追加します。私の方法は不必要に長く複雑に思えます:

var hexValue = "aaaaaa";
hexValue = "0x" + hexValue;
hexValue = parseInt(hexValue , 16);
hexValue = hexValue + 0x010101;
hexValue = hexValue.toString(16);
document.write(hexValue); // outputs 'ababab'

16進値は0xを連結した後も文字列なので、数値に変更する必要がありますthen追加できますthenそれを16進形式に変更する必要がありますback!追加する番号が16進数文字列である場合、または開始する前に#を16進数の色から削除することを考慮する場合、さらに多くの手順があります。

確かに少ない手順でこれを行う方法があります! (そして、すべてを1行にまとめる(parseInt("0x"+"aaaaaa",16)+0x010101).toString(16)、または省略形を使用するという意味ではなく、実際に行う操作が少なくなることを意味します。)

Javascriptで数学演算のすべてに10進数の使用を停止し、代わりに16進数を使用する方法はありますか?または、JavascriptをHexでより簡単に動作させる他の方法はありますか?

22
brentonstrine

いいえ、JavaScript言語にデフォルトで10進数ではなく16進数整数形式を使用するように指示する方法はありません。コードは簡潔ですが、baseで「parseInt」を使用するときに「0x」ベースインジケータを追加する必要がないことに注意してください。

ここに私があなたの問題にどのようにアプローチするかがあります:

function addHexColor(c1, c2) {
  var hexStr = (parseInt(c1, 16) + parseInt(c2, 16)).toString(16);
  while (hexStr.length < 6) { hexStr = '0' + hexStr; } // Zero pad.
  return hexStr;
}

addHexColor('aaaaaa', '010101'); // => 'ababab'
addHexColor('010101', '010101'); // => '020202'
30
maerics

これはどう:

var hexValue = "aaaaaa";
hexValue = (parseInt(hexValue, 16) + 0x010101).toString(16);
document.writeln(hexValue); // outputs 'ababab'

ParseIntを使用する場合、0xプレフィックスを追加する必要はありません。

9
HBP

受け入れられた答えは間違っていると思います。 16進数の色表現は線形ではありません。しかし、代わりに、2つの文字の3つのセットがR、G&Bに与えられます。

したがって、整数だけを加算して、RGBが正しく加算されることを期待することはできません。

For Example

n1 = '005500'; <--- green
n2 = '00ff00'; <--- brighter green

これらの数値を追加すると、緑色がより緑色になります。決して、グリーンを追加してもREDが増加して増加するはずです。しかし、受け入れられた答えが何をしているのかを行うことによって、ちょうど整数を1つの数として扱うように、それからあなたはfよりも大きくなる数、f + 1 = 10まで持ち越します。

you get `015400` so by adding greens the RED increased .... WRONG

005500 + 00ff00を追加すると、= 00ff00になります。最大グリーンにさらにグリーンを追加することはできません。

5
Abubakar101