如何查看json文件数据编码_【阿里】如何把 json 数据转化为 demo.json 并下载文件...

巨人堤道，英国北爱尔兰布什米尔斯
(© Chiara Salvadori/Getty Images)

❝

本题摘自于我 github 上的面试每日一题：https://github.com/shfshanyue/Daily-Question，并有大厂面经及内推信息，可「在左下角打开本题原文链接」

❞

json 视为字符串，可以利用 DataURL 进行下载

Text -> DataURL

除了使用 DataURL，还可以转化为 Object URL 进行下载

Text -> Blob -> Object URL

可以把以下代码直接粘贴到控制台下载文件

function download (url, name) {
  const a = document.createElement('a')
  a.download = name
  a.rel = 'noopener'
  a.href = url
  // 触发模拟点击
  a.dispatchEvent(new MouseEvent('click'))
  // 或者 a.click()
}

const json = {
  a: 3,
  b: 4,
  c: 5
}
const str = JSON.stringify(json, null, 2)

// 方案一：Text -> DataURL
const dataUrl = `data:,${str}`
download(dataUrl, 'demo.json')

// 方案二：Text -> Blob -> ObjectURL
const url = URL.createObjectURL(new Blob(str.split('')))
download(url, 'demo1.json')

总结

1. 模拟下载，可以通过新建一个 标签并设置 url 及 download 属性来下载
2. 可以通过把 json 转化为 dataurl 来构造 URL
3. 可以通过把 json 转换为 Blob 再转化为 ObjectURL 来构造 URL

更多面试

【字节-视频架构组-前端】头条架构组招人了内含自测题

【美团】什么是防抖和节流，他们的应用场景有哪些

【美团】如何获取一个进程的内存并监控

关注我

我是山月，正致力于「每天用五分钟能够看完的简短答案回答一个大厂高频面试题」。扫码添加我的微信，备注进群，加入高级前端进阶群.

加我微信拉你进入面试交流群

欢迎关注公众号【互联网大厂招聘】，定时推送大厂内推信息及面试题简答，每天学习五分钟，半年进入大厂中

每天五分钟，半年大厂中