求助：将PHP数组转为可生成指定查询参数的TypeScript结构

嘿，刚接触TypeScript遇到这个问题太正常了，我来帮你理清思路并解决它～

为什么你的代码会得到sort=%5Bobject%20Object%5D？ #

首先，你一开始用了let array = []然后给它添加sort属性——其实在JS/TS里，数组是专门用来存储有序列表的，这里你需要的是普通对象而不是数组。不过更关键的问题是：原生的URLSearchParams只能处理扁平的键值对，当它遇到嵌套对象时，会直接把对象转换成字符串[object Object]，这就是你看到奇怪结果的原因。

正确的解决方案 #

要生成PHP风格的嵌套查询参数（比如sort%5Bcolumn1%5D=asc&sort%5Bcolumn2%5D=desc），我们需要自己实现序列化函数，或者借助第三方库来处理嵌套结构。

方案1：手动实现序列化函数

这个方法不需要额外依赖，完全自己控制逻辑：

首先，定义你的参数对象（用普通对象，不是数组）：

const queryParams = {
  sort: {
    column1: 'asc',
    column2: 'desc'
  }
};

然后写一个递归的序列化函数，处理嵌套对象：

function serializeToPHPQuery(obj: Record<string, any>, prefix?: string): string {
  const parts: string[] = [];

  for (const key in obj) {
    // 确保只处理对象自身的属性
    if (Object.prototype.hasOwnProperty.call(obj, key)) {
      // 拼接完整的键名，比如sort[column1]
      const fullKey = prefix ? `${prefix}[${key}]` : key;
      const value = obj[key];

      if (typeof value === 'object' && value !== null && !Array.isArray(value)) {
        // 递归处理嵌套的子对象
        parts.push(serializeToPHPQuery(value, fullKey));
      } else {
        // 对键和值进行URI编码，避免特殊字符问题
        const encodedKey = encodeURIComponent(fullKey);
        const encodedValue = encodeURIComponent(String(value));
        parts.push(`${encodedKey}=${encodedValue}`);
      }
    }
  }

  // 用&拼接所有部分
  return parts.join('&');
}

调用这个函数就能得到你想要的结果：

const finalQuery = serializeToPHPQuery(queryParams);
console.log(finalQuery);
// 输出：sort%5Bcolumn1%5D=asc&sort%5Bcolumn2%5D=desc

方案2：使用第三方库（更简便）

如果你的项目允许引入第三方库，qs是一个非常流行的处理查询参数的工具，它原生支持PHP风格的嵌套序列化：

首先安装依赖：

npm install qs
# 或者用yarn
yarn add qs

然后在TypeScript中使用：

import qs from 'qs';

const queryParams = {
  sort: {
    column1: 'asc',
    column2: 'desc'
  }
};

const finalQuery = qs.stringify(queryParams, { encode: true });
console.log(finalQuery);
// 同样输出：sort%5Bcolumn1%5D=asc&sort%5Bcolumn2%5D=desc

总结一下 #

1. 不要用数组来存储这种键值对结构，改用普通的JavaScript/TypeScript对象
2. 原生URLSearchParams不支持嵌套对象的PHP风格序列化，要么自己实现递归序列化函数，要么用qs这类第三方库简化开发

内容的提问来源于stack exchange，提问作者suh_dude-