工作笔记 - 一个浏览器环境适用的类型转换工具

概述

平常工作中，经常遇到需要将数据在各种类型之间进行转换的情况。在nodejs环境中，这些转换通常都可以通过buffer来进行。但在浏览器环境中，就没有这么好用的工具了。看了很多程序，它们都可以进行各种操作，但总体而言比较散乱，用到时候想起来要查询，使用不太方便，开发的体验也不一致。

所以笔者借助buffer的思想，自己编写了一个转换工具来使用。这个工具的基本设定如下：

基于浏览器环境，不能用buffer或者crypto
简单，无第三方依赖
支持多种类型的相互转换
使用方便和一致，并容易移植和扩展

工具支持的转换类型，特别是对密码学操作相关的，应当包括：

utf8: 普通文本
json: json对象，支持utf
base64: 用字符串表示二进制数据，特别是url版本的
hex: 常用于密钥
buf: 底层数据类型arrayBuffer或者Uint8Array

根据以上设定，笔者开发了简单的转换工具，记录如下。

实现

先看代码，就是一个函数：

js 复制代码

// sample utf8, obj,b64,hex,buf
const codec = (vinput, ctype = "")=>{
    // convert type 
    let [vfrom,vto] = ctype.split("->");
    if (!vfrom || !vto) return vinput;
    
    let buf ;
    switch(vfrom) {
        case "obj": 
        case "json": return codec(JSON.stringify(vinput), "utf8->"+vto);
        case "buf":  buf = vinput; break;
        case "utf8": 
        case "str": buf = new TextEncoder().encode(vinput); break;
        case "hex":  buf = new Uint8Array(vinput.length/2).map((v,i)=> parseInt(vinput.substr(i*2,2), 16)); break;
        case "b64": 
            vinput = vinput.replaceAll("-","+").replaceAll("_","/");
            buf = new Uint8Array([...atob(vinput)].map(ch => ch.charCodeAt(0))); 
        break;
    }
    
    switch(vto) {
        case "buf": return buf; 
        case "hex": return buf.reduce((c,v,i)=>(c += v.toString(16).padStart(2, '0'),c),""); 
        case "b64": return btoa(buf.reduce((c,v,i)=>(c += String.fromCharCode(v),c),""))
                                .replaceAll("+","-").replaceAll("/","_").replace("=","");
        case "utf8":
        case "str":
        return new TextDecoder().decode(buf);
        case "obj":
        case "json": 
        return JSON.parse(new TextDecoder().decode(buf));
    }
    
    // not convert 
    return vinput;
};

// 使用示例:
const o = { name: "China@中国" };
const b64 = codec(o, "obj->b64"); // 从json到base64
console.log(b64);
console.log(codec(b64,"b64->utf8"));


// 运行结果
eyJuYW1lIjoiQ2hpbmFA5Lit5Zu9In0
{"name":"China@中国"}

代码其实自己已经说明并表达了主要的设计意思。简单总结和说明一下：

两个参数，第一个是任意类型的输入，第二个定义转换来源和方向
转换方向，使用字符串表示，并使用 "->" 连接
转换类型的关键字是： utf8/str,obj/json,b64,hex,buf
转换的核心是先转成buf，然后再转到目标类型，这样非常容易扩展和修改
完全没有第三方依赖和高级依赖，都是标准函数
后期考虑增加自动类型判断(可能有风险)
现在暂时没有错误处理机制
性能并非考虑的要素，主要是易用通用，如果关注性能，可以裁剪成特定代码

小结

本文作为工作笔记，记录了笔者编写和使用的一个简单通用的工具函数，可以实现在浏览器环境中，各种和密码学操作相关的数据类型的转换。它使用简单，一致性好，无第三方依赖，而且容易扩展和移植。