一、qs概述

qs 是一个增加了一些安全性的查询字符串解析和序列化字符串的库。主要用于将url后面的值转换为对象，或者将对象拼接未url后面的值

1.qs的下载

qs是一个npm仓库所管理的包,可通过npm install qs命令进行安装.

2.qs的引入

如果是在vue框架下，直接按照常规方式引入即可

import Qs from "qs";

如果是在普通开发环境下则需要使用require引入

require(["./node_modules/qs/dist/qs.js"], function (qs) {
    // 引入qs的js包
    console.log(qs);
  });

requireJs请去官网下载即可

二、具体使用

1.qs.stringify()

将对象数据转换为url后面拼接的参数，可搭配JSON.stringfy使用

（1）对象情况

let obj = {
      name: 'lis',
      password: '85111',
      date: '2020-11-14 15:22'
    }
console.log(qs.stringify(obj));

输出：

qs将对象数据转换为url参数

（2）数组情况

	let arr = [1, 2, 3, 4];
    console.log(qs.stringify(arr));

输出：

其实qs也是按照对象的形式进行转换，因为我们知道，数组也是特殊形式的对象数据

（3）建议

对象或数组数据多重嵌套一般建议搭配JSON.stringfy()使用，避免url参数过多的问题
不然在解析时就会将数组转换为对象
例如：

	let arr = [1, 2, 3, 4];
    let data = {
      arr: arr
    }
    console.log(data);
    console.log(qs.stringify(data));
    console.log(qs.parse(qs.stringify(data)));

结果：
数组中每个值都被解析为一个等式，当数据过多时，url参数会非常长

所以要搭配JSON.stringfy()

	let arr = [1, 2, 3, 4];
    arr = JSON.stringify(arr);
    let data = {
      arr: arr
    }
    console.log(data);
    console.log(qs.stringify(data));
    console.log(qs.parse(qs.stringify(data)));

2.qs.parse()

（1）对象形式

let obj = {
      name: 'lis',
      password: '85111',
      date: '2020-11-14 15:22',
      son: {
        name: 'hhh',
        age: '11'
      }
    }
console.log(qs.stringify(obj));
console.log(qs.parse(qs.stringify(obj)));

结果：

（2）数组形式

	let arr = [1, 2, 3, 4];
    console.log(arr);
    console.log(qs.stringify(arr));
    console.log(qs.parse(qs.stringify(arr)));

结果：

我们发现它将数组转换为对象了，所以这里建议用JSON.stringfy()（上面已经提过）或者使用数据嵌套，即将数组嵌套在对象数据中：

	let arr = [1, 2, 3, 4];
    let data = {
      arr: arr
    }
    console.log(data);
    console.log(qs.stringify(data));
    console.log(qs.parse(qs.stringify(data)));

结果：

三、优点

1.参数转换

其实讲了这么多参数转换这个优点已经是显而易见的了，可以让我们在接口数据交互时特别时使用url传值的时候很方便的对参数进行操作
例如在vue中配合axios使用：

2.url转码

其实我们在进行url传参时最头疼的就是url转码问题，一些转码问题经常导致参数无法接收，很幸运的是，qs帮我们解决了这个问题，我其实引入这个包就是为了解决传参时，JSON.stringfy()数组后，数组两边的中括号无法被url转码，后端总是接收不到数据。
例如：

	let data = {
      a :'[1,2,3,4,5]'
    }
    console.log(qs.stringify(data));

结果：转码完成