JavaScript将CSV文件转为JSON

news2024/9/21 20:30:05

说在前面

相信平时大家或多或少都会有遇到过类似的情况:

🙎(需求小姐姐) 🙎‍♂(我)

🙎:这里我们需要做一个省市联动下拉框,你看看可以做吗?

🙎‍♂:可以的,下拉框数据是通过接口获取吗?

🙎:不是,等下我给你发一份数据,你直接用那份数据就可以了。

🙎‍♂:好的。

…………两分钟后

🙎:地市区县.csv

csv 文件数据格式如下:

image.png

这个时候就需要我们先将csv文件转成我们想要的json格式数据了

TextDecoder

TextDecoder 接口表示一个文本解码器,一个解码器只支持一种特定文本编码,例如 UTF-8、ISO-8859-2、KOI8-R、GBK,等等。解码器将字节流作为输入,并提供码位流作为输出。

csv 文件的解析我们可以借助TextDecoder来完成,主要用到下面的构造函数及实例方法:

TextDecoder()

TextDecoder() 构造函数使用参数中指定的编码返回一个新创建的 TextDecoder 对象。

  • 语法
new TextDecoder();
new TextDecoder(utfLabel);
new TextDecoder(utfLabel, options);
  • 参数
utfLabel 可选
一个字符串,默认是 "utf-8"。可以是任意有效的编码。

options 可选
一个具有属性的对象:

fatal
一个布尔值,表示在解码无效数据时,TextDecoder.decode() 方法是否必须抛出 TypeError。默认是 false,这意味着解码器将用替换字符替换错误的数据。

TextDecoder.decode()

TextDecoder.decode() 方法返回一个字符串,其包含作为参数传递的缓冲区解码后的文本。

  • 语法
decode();
decode(buffer);
decode(buffer, options);
  • 参数
buffer 可选
一个 ArrayBuffer、TypedArray 或包含要解码的编码文本的 DataView 对象。

options 可选
具有以下属性的对象:

stream
一个布尔标志,表示在后续调用 decode() 将跟随附加数据。如果以分块的形式处理数据,则设置为 true;如果是最终的分块或者数据没有分块,则设置为 false。默认是 false。
  • 浏览器兼容

image.png

转换代码

简单了解了TextDecoder之后,我们便可以开始进行转换代码编写了,想了解更多的可以直接到 mdn 查看具体文档:https://developer.mozilla.org/zh-CN/docs/Web/API/TextDecoder/TextDecoder。

1、首先我们可以通过readFileSync获取到我们需要操作的文件:

const fs = require("fs");
const dir = "地市区县.csv";
const file = fs.readFileSync(`./static/${dir}`);

2、使用 TextDecoder 获取文件文本

const getTxt = new TextDecoder("UTF-8").decode(file);
console.log(getTxt);

image.png

3、将文本按行分割

const getTxt = new TextDecoder("UTF-8").decode(file).split("\r\n");
console.log(getTxt);

image.png

4、重组数据

获取到数据文本之后,我们还需要将其转换成我们想要的json格式,这里我们已经将文本按行分割成一个数组,数组中的一项就是代表 csv 文件中的一行,其中第一行即为表头。

const json = {};
const textLen = getTxt.length;
// 遍历文件, 注意是从 i = 1 开始, 因为不需要表头
for (let i = 1; i < textLen; i++) {
  const textItem = getTxt[i].split(",");
  if (!json[textItem[0]]) {
    json[textItem[0]] = [];
  }
  json[textItem[0]].push(textItem[1]);
}
console.log(json);

image.png

5、将拼接的 json 数据 写入新的 json 文件

// 得到不需要文件后缀的名称
const getFile = dir.split(".")[0];
// 写入文件数据
fs.writeFileSync(`./file/${getFile}.json`, JSON.stringify(json));

image.png

说在后面

🎉 这里是 JYeontu,现在是一名前端工程师,有空会刷刷算法题,平时喜欢打羽毛球 🏸 ,平时也喜欢写些东西,既为自己记录 📋,也希望可以对大家有那么一丢丢的帮助,写的不好望多多谅解 🙇,写错的地方望指出,定会认真改进 😊,偶尔也会在自己的公众号(前端也能这么有趣)发一些比较有趣的文章,有兴趣的也可以关注下。在此谢谢大家的支持,我们下文再见 🙌。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/824458.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

基于SSM 应急指挥平台-计算机毕设 附源码 13263

SSM应急指挥平台 摘 要 科技进步的飞速发展引起人们日常生活的巨大变化&#xff0c;电子信息技术的飞速发展使得电子信息技术的各个领域的应用水平得到普及和应用。信息时代的到来已成为不可阻挡的时尚潮流&#xff0c;人类发展的历史正进入一个新时代。在现实运用中&#xff0…

DFS之连通性--迷宫

思路&#xff1a;就是通过dfs进行搜索&#xff0c;看是否能从给定的起点到给定的终点&#xff0c;当然也可以用bfs写&#xff0c;这里用到dfs写的 #include<bits/stdc.h> using namespace std; int n; char g[1010][1010]; int ax,ay,bx,by; int dx[4]{1,0,-1,0}; int dy…

pgSql 报错:timestamp without time zone >= character varying

在这里补充一点&#xff0c;数据库映射实体类不要使用LocalDateTime,驱动版本大概率不支持&#xff0c;出现奇奇怪怪的错&#xff1b; 在mysql 使用时&#xff0c;String 类型会隐式转成Date类型&#xff0c;使用mybatis-plus拼接就不会报错&#xff0c;换成pgSql就出现这个错…

模板方法模式:优化代码复用与扩展性的设计模式

模板方法模式&#xff1a;优化代码复用与扩展性的设计模式 什么是模板方法模式&#xff1f; 模板方法模式是一种行为型设计模式&#xff0c;它定义了一个算法的骨架&#xff0c;将一些步骤的具体实现延迟到子类中。模板方法模式通过将算法的通用部分抽象出来&#xff0c;以模板…

华为OD机试真题 Java 实现【最小传输时延Ⅱ】【2023 B卷 200分】,附详细解题思路

目录 专栏导读一、题目描述二、输入描述三、输出描述四、解题思路五、Java算法源码六、效果展示1、输入2、输出3、说明 华为OD机试 2023B卷题库疯狂收录中&#xff0c;刷题点这里 专栏导读 本专栏收录于《华为OD机试&#xff08;JAVA&#xff09;真题&#xff08;A卷B卷&#…

计算一组数据的方差statistics.pvariance()

【小白从小学Python、C、Java】 【计算机等考500强证书考研】 【Python-数据分析】 计算一组数据的方差 statistics.pvariance() 选择题 下列说法错误的是? import statistics data [1, 2] print("【显示】data ", data) print(【执行】statistics.pvariance(data…

个人中心 - 实现修改用户头像、用户名或密码

目录 1. 修改用户头像 1.1 获取原来的用户头像和用户名 1.2 实现保存头像 2. 修改用户名或密码 1. 修改用户头像 本文是针对之前的一篇项目博客 - 博客系统 做的一个扩展功能. 1.1 获取原来的用户头像和用户名 想要修改头像, 那么就得先获取数据库中原来的头像, 此处顺便…

从零开始 Spring Cloud 8:Docker

从零开始 Spring Cloud 8&#xff1a;Docker 图源&#xff1a;laiketui.com Docker 可以帮助我们更方便地部署 Spring Cloud 应用。 环境准备 准备 Docker 环境可以参考 这篇文章。 操作镜像 docker 的镜像相关操作主要涉及以下命令&#xff1a; docker pull&#xff0c;…

什么是服务网格?

背景&#xff1a; 服务网格这个概念出来很久了&#xff0c;从 2017 年被提出来&#xff0c;到 2018 年正式爆发&#xff0c;很多云厂商和互联网企业都在纷纷向服务网格靠拢。像蚂蚁集团、美团、百度、网易等一线互联 网公司&#xff0c;都有服务网格的落地应用。服务网格是微服…

开源-基于ch9374b的KVM设计

文章目录 简介功能特性设计图实现功能开源链接 简介 平时总有一种需求&#xff0c;就是我在调试树莓派的时候&#xff0c;经常要在pc电脑和开发板之间来回操作&#xff0c;因此就需要两套键盘和鼠标&#xff0c;但是我的桌子实在是太小了&#xff0c;两套键鼠不能并排放置&…

浅谈Struts2请求解析过程

0x00前言 在使用Struts2的时候需要在web.xml中配置一个过滤器&#xff0c;来拦截用户发起的请求&#xff0c;并进行一些预处理&#xff0c;根据配置文件把请求分配给对应的action并将请求中的参数与action中的字段进行对应赋值。例如下面的例子&#xff0c;通过配置StrutsPrepa…

二叉树的前,中,后序的非递归实现(c++)

前言 对于二叉树来说&#xff0c;遍历它有多种方式&#xff0c;其中递归遍历是比较简单的&#xff0c;但是非递归的实现就有一定的难度&#xff0c;在这里介绍一种非递归实现二叉树遍历的方式。 1.前序遍历 1.1思路 其实对于二叉树的非递归实现&#xff0c;实际上就是用代码来…

Spring中Bean的实例化详细流程

还是举个例子&#xff0c;我有一个朋友小汪他远赴南方某城市打工。然后安定下来后他的朋友很想来家里玩&#xff0c;但是呢我这个朋友家里搞的很乱&#xff0c;所以他不好意思请朋友来家里玩。这时我的另一个朋友说那请一个保姆把家里好好整理一下就可以了&#xff0c;然后给他…

【LeetCode】一、链表反转

题目 题目&#xff1a;给定单链表头节点&#xff0c;将单链表的链接顺序反转过来 例&#xff1a; 输入&#xff1a;1->2->3->4->5 输出&#xff1a;5->4->3->2->1 要求&#xff1a;按照两种方式实现 解决办法 方式一&#xff1a;&#xff08;直接迭…

腾讯云服务器CVM镜像操作系统大全_win_linux

腾讯云CVM服务器的公共镜像是由腾讯云官方提供的镜像&#xff0c;公共镜像包含基础操作系统和腾讯云提供的初始化组件&#xff0c;公共镜像分为Windows和Linux两大类操作系统&#xff0c;如TencentOS Server、Windows Server、OpenCloudOS、CentOS Stream、CentOS、Ubuntu、Deb…

大一python编程题库和答案,大一python基础编程题库

大家好&#xff0c;小编来为大家解答以下问题&#xff0c;大一python编程题库和答案山东理工大学&#xff0c;大一python编程题库和答案解析&#xff0c;今天让我们一起来看看吧&#xff01; 单项选择题 第一章python语法基础 1. Python 3.x 版本的保留字总数是C A 27 …

Python(五十七)列表生成式

❤️ 专栏简介&#xff1a;本专栏记录了我个人从零开始学习Python编程的过程。在这个专栏中&#xff0c;我将分享我在学习Python的过程中的学习笔记、学习路线以及各个知识点。 ☀️ 专栏适用人群 &#xff1a;本专栏适用于希望学习Python编程的初学者和有一定编程基础的人。无…

Delphi 开发不一样的窗体标题栏:TTitleBarPanel

目录 TTitleBarPanel 的使用 TTitleBarPanel 的使用进阶 一、设置标题栏高度、颜色 二、个性化标题栏的关闭等按键 我们在用Delphi开发程序的时候&#xff0c;窗体的标题栏一般都是标准的windows标题栏&#xff0c;上面包括&#xff1a;程序图标、标题、最小化、最大化、关闭…

TypeC拓展设计方案|TypeC转HDMI设计方案|CS5261/CS5265芯片设计参数对比

集睿智远CS5261/CS5265都可以用于设计TypeC转HDMI方案&#xff0c;低成本TypeC扩展坞设计方案&#xff0c;而两者也有些差异&#xff1a;1.CS5261支持DP1.4输入&#xff0c;一个HDMI1.4输出&#xff0c;即HDMI输出为4K30HZ ;CS5265DP1.4到HDMI2.0转换芯片&#xff0c;即HDMI输出…

Linux之 环境变量

什么是环境变量 windows中也有个 Linux 环境变量 env linux和windows环境变量&#xff0c;功能类似的&#xff0c; windows系统的环境变量&#xff0c;在cmd中可以之间调用程序运行。这些程序的执行程序的路径&#xff0c;一般编辑在path变量中 环境变量都分全局的&#xff…