とても長大な文字列と Uint8Array に格納されたデーターを合成する方法

Question

解決したいこと

複数の異なる形式で保存されている　１６進データーを
すべて１つに継ぎ足して
バイナリーファイルとして javascript 上で作成する方法
.

すでに手元にある　１６進データーの種類

[1]　文字列変数に保存されている　１０００文字以上の　１６進コード　空白なし
[2]　同上　１０文字以内の　１６進コード　文字列
[3]　Uint8Array　形式で作られた変数

データー見本

//	合成する前の各データー　３種類

stringLong  = "B744C12B58C09AEE3700 ... 000000FF00FF" ;
stringShort = "8C0409AE37" ;

u8a = Uint8Array([0xe0, 0x4d, 0x54, 0x72, 0x6b, 0x00, 0x00, 0x15]) ;

継ぎ足された　上記データーをバイナリーファイルとして保存する方法

上記　[1] のデーターを保存するのに用いたコードの主要部分は
以下のとおりです。

//	ファイル出力方法	
	
function saveBuffer( bytesD )
{  
	var dataToSave = new Uint8Array( bytesD );
		
	var blob = new Blob([dataToSave], {type: "application/octet-binary"});
	
	var urlObj = URL.createObjectURL(blob);
	
//	. . . .
		

質問内容

どのようなコードを作成すれば、上記のような異なる型のデーターをひとまとめにして
バイナリーファイルを作れるか、ご指導をお願いいたします。

Answer 1

とても長大な文字列

1000文字ですと、メモリ上では長大とは言えません。

文字コードがUTF-8の場合、日本語は**約3〜4[Byte/字]**と考えると、1000文字は約3〜4KBです。
現在使用されている画像ファイル1枚に比べてみると、微々たるものと考えられるはずです。

バイナリーファイルとして javascript 上で作成する方法

文字コードはコンピュータ版の数秘術のように考えると理解しやすいかもしれません
（中でもゲマトリアが文字コードやエンコーディングに近い）。

文字列とバイト配列を扱うなら Unicode について調べてみてください。

• Google検索 Unicode utf8 ucs2

[1]　文字列変数に保存されている　１０００文字以上の　１６進コード　空白なし

[2]　同上　１０文字以内の　１６進コード　文字列

1. 00〜FF を 1byte分のデータとしている
2. 文字列長は 2の倍数

function hex2bytes ( hex ) {
  if( hex.length % 2 == 0 ) {
    return hex.match(/[a-f\d]{2}/ig).map(n=>parseInt(n,16)); // i フラグ追記
  }
  return [];
}


var dataToSave = new Uint8Array( hex2bytes(bytesD) );

[3] については、前回のご質問に回答したコードが参考になりませんでしょうか。

console.log( dv.buffer );

// => ArrayBuffer(47) {}

MDN

• ArrayBuffer
• TypedArray
• Uint8Array
• DataView

MDN のページはPCブラウザで閲覧し、左のサイドメニューにある「関連トピック」のページは読み漁ります
（オブジェクトのもつ他のプロパティについて理解できるはずです）。

Answer 2

文字列 => 16進Array

let text = '00112233445566778899AABBCCDDEEFF';
let xs = text.match(/.{1,2}/g).map(x => parseInt(x, 16));
console.log(xs);

/*
[
    0,  17,  34,  51,  68,
   85, 102, 119, 136, 153,
  170, 187, 204, 221, 238,
  255
]
*/

結合

• 結合後のサイズを持つUint8Arrayを生成して、set()するとか
• 普通の配列の配列にしてflat()してUint8Arrayを生成するか

xs = new Uint8Array([1, 2, 3]) ;
ys = [4, 5, 6];
console.log(new Uint8Array([...xs, ys].flat()));
/*
Uint8Array(6) [ 1, 2, 3, 4, 5, 6 ]
*/