js格式转换

1.数值类型转换:

//转为布尔
    var a = 'true'; var a1 = Boolean(a); console.log(a1, typeof a1) // true "boolean"

//转为字符串
    var b = true;var b1 = String(b);console.log(b1 ,typeof b1) // true string

//转为数字
    var c = '2.23, 2.3';var c1 = parseInt(c);console.log(c1, typeof c1) // 2 "number"

    var c = '2.23, 2.3';var c1 = parseFloat(c);console.log(c1, typeof c1) // 2.23 "number"

2.引用类型转换:

2.1.取值:

对象:
  let obj = {name: 'wan'};   console.log(obj.name) || console.log(obj['name']);

数组:

   var arr1 = [1,2,3,4,5];

   console.log(arr1[1]);

   arr1['newStr'] = 1; console.log(arr1['newStr']) // 1

// 说明:使用 for (var key in xx){} 不管循环对象还是数组,key都是键,xx[key]就是值,数组没有键那key就以索引作为键


 2.2.数组转对象

//正常使用 for in 实现,以索引为键

var arr = ["123","456","789"];
var list = {};
for (var key in arr) {
    console.log(arr[key])   // 123 \n 456 \n 789
    console.log(key)        // 0 \n 1 \n 2
    list[key] = arr[key];   // 键 :值 ok
}
console.log(list)           //{0: "123", 1: "456", 2: "789"}
 
//如果不想以索引为键如下1
 
   var arr = ["root.VENC.streamMixType=1","root.VENC.h264EncLvl=2","root.VENC.frameRate=30"];
     var obj = {}
     arr.forEach(function(x){
            
        console.log(x.split('=')) // 将数组里的每一项转为数组已 = 区分隔开--> ["root.VENC.streamMixType", "1"] \n  ["root.VENC.h264EncLvl", "2"] \n  ["root.VENC.frameRate", "30"]
        
        console.log(x.split('=')[0]) // 取得索引为0的数据作为键--> root.VENC.streamMixType \n root.VENC.h264EncLvl \n root.VENC.frameRate
            
        console.log(x.split('=')[1])  // 将数组里的每一项转为数组已 = 区分隔开并取得索引为1的数据作为值 --> 1 \n 2 \n 30

        obj[x.split('=')[0]] = x.split('=')[1]  // 键 :值 ok
 
      })
      console.log(obj) // {root.VENC.streamMixType: "1", root.VENC.h264EncLvl: "2", root.VENC.frameRate: "30"}
 
//如果不想以索引为键如下2
 var all = 'sumit_form_name=封兴&sumit_form_age=10&xb=男&hy=未婚&gfx=无&crj=无&sumit_form_temperature=36.5&zh=干咳&zh=鼻塞&sumit_form_address=大浪谭罗华侨新村2区&sumit_form_phone=18274305123&tiema=2021-07-07 0:53:13'
        var dataForm = all.split('&')
        console.log(dataForm)
        var objForm = {}
        for(var key in dataForm){
            console.log(dataForm[key].split('='))
            objForm[dataForm[key].split('=')[0]] = dataForm[key].split('=')[1]
        }
     console.log(objform)
 2.3.对象转数组
//正常使用 for in 实现
let obj = {'name': '小团团', 'age': 18, 'like': '唱歌'};
        var arr = []
        for (let key in obj) {
            arr.push(obj[key]);    //将值变为数组内容
            //arr.push(key);       //将键变为数组内容
        }
        console.log(arr);          // ["小团团", 18, "唱歌"]
 
//快速转换
 let obj = {
        0: 'nihao',
        1: 'haha',
        2: 'gansha',
    }
    let arr = Object.values(obj)   // 使用Object.values需满足条件:键必须是数值
    console.log(arr);              // ["nihao", "haha", "gansha"]

2.4.对象转为数组对象
 let obj = {
     name: "小团团",
     label: "真厉害"
 }
  
 let arr = []

 for(let key in obj) {
    console.log(obj)            //   {name: "小团团", label: "真厉害"} \n {name: "小团团", label: "真厉害"}
    console.log(key)            //   name \n label
    console.log(obj[key])       //   小团团 \n 真厉害
    arr.push({
         objname: key,          //   objname: 所有对象的键
         objlabel: obj[key]     //   objlabel: 所有对象的值
    })
 }
 console.log(arr);              //   [{objname: "name", objlabel: "小团团"},{objname: "label", objlabel: "真厉害"}]
 console.log(arr[0])            //   {objname: "name", objlabel: "小团团"}
 console.log(arr[0].objname)    //   name

2.5.数组对象转对象
 let arr = [
  {
    "name": "小团团",
    "label": "真厉害"
  },
  {
    "name": "小丫丫",
    "label": "也厉害"
  }
 ]
 
 let obj = {}
 
 arr.forEach(item=> {
    console.log(item.name)          //   小团团 \n 小丫丫
    console.log(item.label)         //   真厉害 \n 也厉害
    obj[item.name] = item.label     //   键 :值 ok
 })

 console.log(obj)                  //    {小团团: "真厉害", 小丫丫: "也厉害"}

 

3.底层数组转换:

 

前端 File 上传、下载,Canvas 保存图片,Ajax 和 Fetch 二进制流传输,PDF 预览,浏览器上 WebAssembly 的应用 等等都需要用到 ArrayBuffer 和 Blob 。文件就具体介绍一下这些对象的相互转换。

介绍:
    FileReader 对象允许Web应用程序异步读取存储在用户计算机上的文件(或原始数据缓冲区)的内容,使用 File 或 Blob 对象指定要读取的文件或数据。
    Blob 对象表示一个不可变、原始数据的类文件对象。它的数据可以按文本或二进制的格式进行读取,也可以转换成 ReadableStream 来用于数据操作。Blob 表示的不一定是 JavaScript 原生格式的数据。File 接口基于 Blob,继承了 blob 的功能并将其扩展使其支持用户系统上的文件。 是浏览器环境上提供的一种大对象,通常是影像、声音或多媒体文件等原始数据的二进制对象,它和 ArrayBuffer 没有必然联系,但是又可以互相转化,Blob用于操作二进制文件,而 ArrayBuffer 用于操作内存。 
    ArrayBuffer 对象代表储存二进制数据的一段内存,它不能直接读写,只能通过视图(TypedArray 视图和 DataView 视图)来读写,视图的作用是以指定格式解读二进制数据。
    Uint8Array 对象是 ArrayBuffer 的一个数据类型(8 位不带符号整数)。
    TextEncoder 接受代码点流作为输入,并提供 UTF-8 字节流作为输出。
    TextDecoder 接口表示一个文本解码器,一个解码器只支持一种特定文本编码,例如 utf-8、iso-8859-2、koi8、cp1261,gbk 等等。解码器将字节流作为输入,并提供代码点流作为输出。

注意: 二进制数组并不是真正的数组,而是类似数组的对象。



转换:
1. TextEncoder => ArrayBuffer
let encoder = new TextEncoder();
let uint8Array = encoder.encode("你好啊"); // 字符 转 Uint8Array
let arrayBuffer = uint8Array.buffer // Uint8Array 转 ArrayBuffer

2. Blob => ArrayBuffer
let str = 'hello,你好吗?'
let blob = new Blob([str],{type:'text/plain;charset=utf-8'});
let utf8decoder = new TextDecoder()
blob.arrayBuffer().then(buffer=>{
  // ArrayBuffer
  console.log(buffer)
  let text = utf8decoder.decode(buffer)
  // String
  console.log(text)
})


3.FileReader => ArrayBuffer
let str = 'hello,你好吗?'
let blob = new Blob([str],{type:'text/plain;charset=utf-8'});
let utf8decoder = new TextDecoder()
let fr = new FileReader()
fr.readAsArrayBuffer(blob)
fr.onload = function(res) {
  // ArrayBuffer
  let buffer = fr.result
  console.log(buffer)
  let text = utf8decoder.decode(buffer)
  // String
  console.log(text)
}

详细:https://www.cnblogs.com/fxw1/p/17562825.html

 


 

posted @ 2021-04-19 15:28  封兴旺  阅读(288)  评论(0编辑  收藏  举报

联系方式: 18274305123(微信同号)