在 blob 或文件中存储/检索大数组（字符串和类型数组的混合）的最佳方式

Question

假设我有一个大数组，其中包含不同类型的数据，例如 json 字符串 和 typed array，例如 mainData

var strObj = JSON.stringify({'name' : 'suman', 'age' : 29};);
var strObj2 = JSON.stringify({'name' : 'laxmi', 'age' : 29});

var tpArr = new Uint8Array(2);
    tpArr[0]  = 42;
    tpArr[1]  = 52;

var tpArr2 = new Uint8Array(2);
    tpArr[0]  = 32;
    tpArr[1]  = 52;

var mainData = [{pt : 20, recObjs : strObj}, {pt : 30, recObjs : strObj2},
                {pt : 40, recObjs : tpArr}, {pt : 50, recObjs : tpArr2}];

我创建了带有数组mainData 的blob 文件（json 类型）并将其导出到json 文件中，例如

var stringiFyData = JSON.stringify(mainData);   
var myBlob = new Blob([stringiFyData], {'type': 'application/json'});
var link2 = document.getElementById('mydata');
link2.href = window.URL.createObjectURL(myBlob);

现在文件导出为 json 后，我读取了类似的文件，

var fileInput = document.getElementById('fileInput');
var file = fileInput.files[0];
var reader = new FileReader();
reader.onload = function(e) {
     mainData = JSON.parse(reader.result);
}
reader.readAsText(file);    

现在mainData 数组、tpArr、tpArr2 的元素将它们的原始类型从 Uint8Array 丢失为 Object。

我需要原始数据tpArr、tpArr2。为此，首先我将tpArr 对象转换为数组。得到数组的长度后，创建类型化数组类似

newTypeArr = new Uint8Array(conNewArr.length);
for(var i=0; i<conNewArr.length; i++ ){
    newTypeArr[i] = conNewArr[i];
}

但是conNewArr 数组的长度大约是 3000，这意味着我们必须运行循环 6000，首先 3000 将对象转换为数组以知道长度，第二个 3000 用于创建类型化数组。

当然mainData 可能有成千上万的这种数组。

其他选择

我尝试将其导出（new Blob(mainData, {'type': 'application/octet-stream'}）到数组缓冲区中，在读取导出的文件后，我得到了类型数组格式的所有数据，但我需要这些数据，因为它是导出之前的（字符串和类型数组的混合） .

我的问题是

1. 我们如何在 blob 文件中导出字符串和类型化数组的混合数据，并从 blob/文件中检索这些数据而不丢失其原始形式（类型）？
2. 我的方法好吗？
3. 如何在我的方法中减少如此大循环的迭代？

window.URL = window.URL || window.webkitURL;
	var myObject = {'name' : 'suman', 'age' : 29};
	var myObject2 = {'name' : 'laxmi', 'age' : 29};
	
	var strObj = JSON.stringify(myObject);
	var strObj2 = JSON.stringify(myObject2);
	
	var tpArr = new Uint8Array(5);
		tpArr[0]  = 42;
		tpArr[1]  = 52;
		tpArr[2]  = 62;
		tpArr[3]  = 22;
		tpArr[4]  = 42;
	    
	var	tpArr2 = new Uint8Array(5);
		tpArr[0]  = 32;
		tpArr[1]  = 52;
		tpArr[2]  = 42;
		tpArr[3]  = 402;
		tpArr[4]  = 142;

	var mainData = [
		{pt : 20, recObjs : strObj},
		{pt : 30, recObjs : strObj2},
		{pt : 40, recObjs : tpArr},
		{pt : 50, recObjs : tpArr2}
		];
	
	
	var stringiFyData = JSON.stringify(mainData);	
	var myBlob = new Blob([stringiFyData], {'type': 'application/json'});
	var link2 = document.getElementById('mydata');
	link2.href = window.URL.createObjectURL(myBlob);
	
	function readFile (){
		var fileInput = document.getElementById('fileInput');
		var file = fileInput.files[0];
		var reader = new FileReader();
		reader.onload = function(e) {
			 data = JSON.parse(reader.result);
		}
		reader.readAsText(file);	
	}

<a href="#"	 id="mydata" >Download Data</a>
	<input type='file' id="fileInput" accept='text/plain' onchange='readFile()'>

Answer 1

为什么要导出一切都是 Blob？ 也许您想将所有数据导出为单个文件并在稍后阶段再次导入。

我建议关注。

最后将所有 Typed 数组转换为 Base64 和 JSON。

https://jsfiddle.net/esusedf7/2/

// Create a array with dummy Values
var typed_array = new Uint8Array(100000);
for (var i=0;i<100000;i++) {
    typed_array[i]=i;
}

// Convert Array into Base64
var sMyBase64 = base64EncArr(typed_array);
// Convert Base64 to Array
var ori1 = base64DecToArr(sMyBase64);

// Convert Array into String (comma seperated)
var comma = bufferToString(typed_array);
// Convert String (comma seperated) into Array
var ori2 = stringToBuffer(comma);

// Compare if converted array is exactly equal to Original Array
if (typed_array.length == ori2.length) {
    var match=0;
    for (var i=0;i<2000;i++) {
        if (typed_array[i] !== ori2[i]) {
            match = 1;
        }
    }
    if (match == 1) {
        alert('ori2 Fail');
    }
} else {
    alert('ori2 Fail');
}

原始数组：100000
Base64 字符串：136844 百分比增加 137%
逗号字符串：356989 百分比增加 357%
Json 字符串：1145881 百分比增加 1146%