用于查询字符串的 Javascript 数组 - Javascript

在开发 Web 应用程序时，处理查询字符串是一个经常需要解决的问题。Javascript 中可以使用数组来方便地操作查询字符串。

将查询字符串转换为数组

查询字符串是 URL 中问号后面的部分，以键值对的形式呈现，每个键值对之间用 "&" 分隔。例如：

http://example.com?name=John&age=25&hobby=basketball

要将查询字符串转换为易于操作的数组，可以使用 split() 方法将字符串分割成数组，并以 "&" 作为分隔符。然后遍历数组，再以 "=" 作为分隔符将键和值分离。例如：

const queryString = "name=John&age=25&hobby=basketball";
const queryArray = queryString.split("&");

const queryParams = {};
queryArray.forEach(function(query) {
  const tempArray = query.split("=");
  queryParams[tempArray[0]] = tempArray[1];
});

console.log(queryParams);
// 输出: {name: "John", age: "25", hobby: "basketball"}

获取指定的查询参数

使用上面的方法，我们可以很容易地获取查询字符串中的所有参数。如果要获取特定的查询参数，可以直接使用查询参数的键来访问。例如：

const queryString = "name=John&age=25&hobby=basketball";

const queryArray = queryString.split("&");
const queryParams = {};

queryArray.forEach(function(query) {
  const tempArray = query.split("=");
  queryParams[tempArray[0]] = tempArray[1];
});

const name = queryParams["name"];
const age = queryParams["age"];

console.log(name);
// 输出: "John"
console.log(age);
// 输出: "25"

构造查询字符串

将数据存储为查询字符串的形式，以便在 URL 中传递参数，是很常见的需求。可以将键值对连接起来，并使用"&"符号分隔它们，来构造查询字符串。

const params = {
  name: "John",
  age: 25,
  hobby: "basketball"
};

let queryString = "";
for (let key in params) {
  queryString += `${key}=${params[key]}&`;
}

console.log(queryString.slice(0,-1));
// 输出: "name=John&age=25&hobby=basketball"

但是，如果值包含特殊字符，如空格或"&"，则需要进行 URL 编码。使用 encodeURIComponent() 方法进行编码，就可以将值转换为 URL 安全的格式。

const params = {
  name: "John Smith",
  age: 25,
  hobby: "basketball & football"
};

let queryString = "";
for (let key in params) {
  queryString += `${encodeURIComponent(key)}=${encodeURIComponent(params[key])}&`;
}

console.log(queryString.slice(0,-1));
// 输出: "name=John%20Smith&age=25&hobby=basketball%20%26%20football"

以上就是使用 Javascript 数组处理查询字符串的常见方法。查询字符串虽然看似简单，但实际应用中涉及到的特殊情况还是很多的。因此，单纯使用数组处理不一定完整，需要结合其他方法进行完善。