前端开发可能遇到这样的需求场景：需要将页面上的文本内容下载到文件中，内容可能是某个大的文本字段，比如博客文章，也可能是后端接口返回的 JSON 数据。

1、下载文本 ​

那么需要如何实现 JS 下载文本内容呢？可以借助于Blob 对象和 a 标签的 download属性来实现，具体代码如下：

Blob对象表示一个不可变、原始数据的类文件对象。它的数据可以按文本或二进制的格式进行读取，也可以转换成ReadableStream来用于数据操作；

a标签的 download 属性是 HTML5 中新增的，用来直接进行文件下载；

下面来测试一下，可以直接在 Chrome 的 console 中进行测试：

运行后，可以看到浏览器会下载一个名为 test.txt 的文件。

2、下载JSON ​

有时候后端接口返回了一个JSON对象，为了方便查看和核对数据，可能想将其下载到文件中，那么只需要将下载文本的方法稍微改造一下即可，具体代码如下：

下面来测试一下：

运行后，浏览器会自动下载一个名为 test.json 的文件，其内容如下：

3、下载JSON并格式化 ​

有的时候可能希望保存到文件中的 json 数据是格式化的，这样方便查看，那么只需要稍微调整一下 JSON.stringify() 方法即可，先来看看 JSON.stringify() 方法的定义：

value

• 将要序列化成 一个 JSON 字符串的值。

replacer可选

• 如果该参数是一个函数，则在序列化过程中，被序列化的值的每个属性都会经过该函数的转换和处理；如果该参数是一个数组，则只有包含在这个数组中的属性名才会被序列化到最终的 JSON 字符串中；如果该参数为 null 或者未提供，则对象所有的属性都会被序列化。

space可选

• 指定缩进用的空白字符串，用于美化输出（pretty-print）；如果参数是个数字，它代表有多少的空格；上限为 10。该值若小于 1，则意味着没有空格；如果该参数为字符串（当字符串长度超过 10 个字母，取其前 10 个字母），该字符串将被作为空格；如果该参数没有提供（或者为 null），将没有空格。

如果想要格式化 JSON，那么可以传入一个 space 参数，具体如下：

除了使用4个空格外，还可以制表符（\t）来缩进，如下：

下载格式化JSON方法修改如下：

下面来测试一下：

运行后，浏览器会自动下载一个名为 test.json 的文件，其内容如下：