先说Unit8Array、ArrayBuffer、charCodeAt的使用下面会用到这三个
Unit8Array:数组类型表示一个 8 位无符号整型数组,创建时内容被初始化为 0。创建完后,可以以对象的方式或使用数组下标索引的方式引用数组中的元素。
new Uint8Array(); // ES2017 最新语法 new Uint8Array(length); // 创建初始化为 0 的,包含 length 个元素的无符号整型数组 new Uint8Array(typedArray); new Uint8Array(object); new Uint8Array(buffer [, byteOffset [, length]]);
ArrayBuffer: 对象用来表示通用的原始二进制数据缓冲区。代表内存之中的一段二进制数据,可以通过“视图”进行操作。“视图”部署了数组接口,这意味着,可以用数组的方法操作内存;
它是一个字节数组,通常在其他语言中称为“byte array”。你不能直接操作 ArrayBuffer
中的内容;而是要通过类型化数组对象或 DataView 对象来操作,它们会将缓冲区中的数据表示为特定的格式,并通过这些格式来读写缓冲区的内容。
ArrayBuffer() 构造函数创建一个以字节为单位的给定长度的新 ArrayBuffer
。你也可以从现有的数据(例如,从 Base64 字符串或者从本地文件)获取数组缓冲区。
ArrayBuffer特性
1.固定长度连续内存空间的引用;
2.对象代表存储一段二进制数据的内存;
3.不能直接读写,只能通过视图(Typed Array View | Data View)来读写
数据类型 | 字节长度 | 含义 | 对应的C语言类型 |
---|---|---|---|
Int8 | 1 | 8位带符号整数 | signed char |
Uint8 | 1 | 8位不带符号整数 | unsigned char |
Uint8C | 1 | 8位不带符号整数(自动过滤溢出) | unsigned char |
Int16 | 2 | 16位带符号整数 | short |
Uint16 | 2 | 16位不带符号整数 | unsigned short |
Int32 | 4 | 32位带符号整数 | int |
Uint32 | 4 | 32位不带符号的整数 | unsigned int |
Float32 | 4 | 32位浮点数 | float |
Float64 | 8 | 64位浮点数 | double |
charCodeAt:方法是 JavaScript 字符串对象的一个方法,它用于返回给定位置的字符的 Unicode 编码值(整数)。Unicode 编码是一个标识字符的数字,它包含了世界上几乎所有字符的映射,包括常见字符、特殊字符和表情符号。
string.charCodeAt(index)
string
是要从中获取字符的字符串。index
是要获取字符的位置,它是从 0 开始的整数。
var str = "Hello, World!";
var charCode = str.charCodeAt(0); // 获取第一个字符 "H" 的 Unicode 编码值
console.log(charCode); // 输出 72
charCodeAt:方法通常用于处理字符串中的字符,以便执行各种文本操作,比如排序、查找、比较等。
接下来咱们开始说xlsx、file-saver下载xlsx文件
第一步下载xlsx、file-saver依赖
npm install xlsx
npm install file-saver
第二步导入xlsx以及file-saver
import FileSaver from 'file-saver'
import * as XLSX from 'xlsx';
定义一个公共方法:
export function fileBolbXlsx1(data, fields, fileName){
data.forEach(item => {
for (let i in item) {
if (fields.hasOwnProperty(i)) {
item[fields[i]] = item[i];
}
delete item[i]; //删除原先的对象属性
}
})
var s2ab = s => {
var buf;
if (typeof ArrayBuffer !== 'undefined') {
buf = new ArrayBuffer(s.length)
var view = new Uint8Array(buf)
for (var i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xff
return buf
} else {
buf = new Array(s.length);
for (var i = 0; i != s.length; ++i) buf[i] = s.charCodeAt(i) & 0xFF;
return buf;
}
}
const workbook = XLSX.utils.book_new();
let ws = XLSX.utils.json_to_sheet(data, { header: Object.values(fields) })
workbook.SheetNames.push(fileName)
workbook.Sheets[fileName] = ws
const wbout = XLSX.write(workbook, { bookType: 'xlsx', type: 'binary' });
FileSaver.saveAs(new Blob([s2ab(wbout)], { type: 'application/octet-stream' }), fileName + '.xlsx');
}
在页面中使用
欢迎大家参与讨论,虽然Unit8Array、ArrayBuffer、charCodeAt前端不经常使用,但是还是需要了解一下的,希望大家共同进步