一、对象键值对数组转换

在JavaScript中，将对象转换为键值对数组是常见需求。传统方法需手动遍历对象属性，而现代方案可利用Object.keys()和Array.map()实现声明式编程。

const user = { name: 'Alice', age: 25, role: 'Developer' };
const keyValuePairs = Object.keys(user).map(key => [key, user[key]]);
// 输出: [['name', 'Alice'], ['age', 25], ['role', 'Developer']]

这种方案的优势在于：

避免显式循环，提升代码可读性
链式调用支持更复杂的转换逻辑
与TypeScript类型系统天然兼容

对于嵌套对象，可结合Object.entries()和递归实现深度转换：

function deepEntries(obj) {
  return Object.entries(obj).flatMap(([key, value]) => 
    typeof value === 'object' && value !== null 
      ? [[key, ...deepEntries(value)]] 
      : [[key, value]]
  );
}

二、数组虚假值过滤

处理用户输入或API响应时，常需过滤false、0、''等虚假值。使用Array.filter()配合Boolean转换器可实现高效过滤：

const mixedArray = [0, 1, false, true, '', 'text', null, undefined];
const truthyValues = mixedArray.filter(Boolean);
// 输出: [1, true, 'text']

性能优化建议：

对于大型数组，可考虑使用Set去重后再过滤

特定场景下自定义过滤函数更高效：

const customFilter = arr => arr.filter(x => x != null && x !== '');

三、日期差值计算

计算两个日期的天数差需考虑时区问题，推荐使用UTC时间戳：

function getDaysBetween(startDate, endDate) {
  const msPerDay = 24 * 60 * 60 * 1000;
  return Math.round((endDate - startDate) / msPerDay);
}
const start = new Date('2023-01-01');
const end = new Date('2023-01-10');
console.log(getDaysBetween(start, end)); // 输出: 9

进阶处理：

使用Intl.DateTimeFormat实现本地化显示
结合moment.js或date-fns库处理复杂场景
考虑闰秒等特殊情况（需引入专业库）

四、数组差异比较

找出两个数组的差异是集合操作的基础需求。使用Set数据结构可提升性能：

function arrayDifference(arr1, arr2) {
  const set2 = new Set(arr2);
  return arr1.filter(x => !set2.has(x));
}
const arrA = [1, 2, 3, 4];
const arrB = [3, 4, 5, 6];
console.log(arrayDifference(arrA, arrB)); // 输出: [1, 2]

复杂场景处理：

多维数组比较需先序列化
对象数组比较需自定义比较函数
大数据量建议使用Web Worker处理

五、数组转CSV格式

将数组转换为CSV格式时需处理特殊字符和分隔符：

function arrayToCSV(data, delimiter = ',') {
  return data.map(row => 
    row.map(cell => 
      `"${String(cell).replace(/"/g, '""')}"`
    ).join(delimiter)
  ).join('\n');
}
const data = [
  ['Name', 'Age', 'City'],
  ['John "Doe"', 30, 'New York'],
  ['Jane, Smith', 25, 'London']
];
console.log(arrayToCSV(data));

性能优化：

使用Blob对象处理大数据量
考虑使用TextEncoder提升编码效率
服务器端生成建议使用专业CSV库

六、数组元素计数

统计元素出现次数是数据分析的基础操作：

function countOccurrences(arr) {
  return arr.reduce((acc, val) => {
    acc[val] = (acc[val] || 0) + 1;
    return acc;
  }, {});
}
const fruits = ['apple', 'banana', 'apple', 'orange', 'banana', 'apple'];
console.log(countOccurrences(fruits));
// 输出: { apple: 3, banana: 2, orange: 1 }

进阶应用：

结合Map实现有序统计
使用lodash.countBy简化代码
大数据量考虑使用流式处理

七、字符串首字母大写

实现标题格式转换时需考虑多单词情况：

function capitalizeWords(str) {
  return str.split(/\s+/)
    .map(word => word.charAt(0).toUpperCase() + word.slice(1))
    .join(' ');
}
console.log(capitalizeWords('hello world')); // 输出: 'Hello World'

国际化处理：

非拉丁字母需特殊处理
考虑使用Intl.Segmenter进行单词分割
特定语言需自定义大小写规则

八、数组最大值查找

查找数组最大值时需注意数据类型：

// 数值数组
const numbers = [3, 1, 4, 1, 5, 9, 2];
const maxNumber = Math.max(...numbers);
// 对象数组
const users = [
  { name: 'Alice', score: 92 },
  { name: 'Bob', score: 85 },
  { name: 'Charlie', score: 95 }
];
const maxScoreUser = users.reduce((max, user) => 
  user.score > max.score ? user : max, users[0]);

性能优化：

大数组建议使用分治算法
考虑使用TypedArray处理数值数据
Web Worker并行处理超大数据集

九、数组平均值计算

计算平均值时需处理空数组等边界情况：

function calculateAverage(arr) {
  if (arr.length === 0) return NaN;
  return arr.reduce((sum, val) => sum + val, 0) / arr.length;
}
console.log(calculateAverage([1, 2, 3, 4])); // 输出: 2.5
console.log(calculateAverage([])); // 输出: NaN

进阶处理：

加权平均值计算
滑动窗口平均值
使用Statistics库进行复杂计算

十、JSON字符串验证

验证JSON字符串有效性时需处理各种异常情况：

function isValidJSON(str) {
  try {
    JSON.parse(str);
    return true;
  } catch (e) {
    return false;
  }
}
console.log(isValidJSON('{"name": "Alice"}')); // true
console.log(isValidJSON('{name: "Alice"}')); // false

安全建议：

限制解析深度防止堆栈溢出
验证数据类型防止XSS攻击
考虑使用JSON5等扩展格式时需额外验证

总结

本文介绍的10个解决方案覆盖了JavaScript开发中的常见痛点。开发者应根据具体场景选择最优方案，同时注意：

性能优化：大数据量时考虑算法复杂度
错误处理：完善边界条件检查
可维护性：保持代码简洁可读
兼容性：考虑不同浏览器环境差异

掌握这些基础操作后，建议深入学习函数式编程和设计模式，进一步提升代码质量。对于企业级应用，可考虑将常用操作封装为工具库，提高团队开发效率。

JavaScript高效编程：10个常见问题的解决方案