调用filter方法报Uncaught TypeError: work.filter is not a function如何解决

开发者阿泽

2026-10-6

错误原因

你遇到的work.filter is not a function报错核心原因是调用filter的主体不是数组：

你外层代码先对workExpArray执行了map遍历，遍历回调里拿到的work是workExpArray的单个元素，通常是工作经历对象，对象本身没有数组的filter方法，所以触发类型错误。
除此之外你的代码还存在逻辑顺序错误、变量作用域错误的问题：你本来要做的是过滤整个workExpArray里符合行业要求的项，不需要先遍历单条再过滤；另外你后续判断用的workexp是filter回调内的局部变量，外层无法访问，运行会触发未定义报错。

修复后的代码示例

import workExpArray from "../Arrays/workExpArray.js";

const workx = document.querySelector(".workexp");

// 第一步：先过滤整个数组，拿到行业为Computing的所有项
const computingWorkList = workExpArray.filter(workexp => workexp.industry === "Computing")

// 第二步：遍历过滤后的数组生成DOM
const workElementList = computingWorkList.map(workexp => {
  const workExpArticle = document.createElement("article");
  workExpArticle.classList.add("workexp__article");
  workExpArticle.setAttribute("id", workexp.id);
  if (typeof workexp.secondaryRole === "string") {
    workExpArticle.innerHTML = `
      <SOME HTML HERE>
    `;
  } else {
    workExpArticle.innerHTML = `
      <MORE HTML HERE>
    `;
  }
  return workExpArticle
})

// 第三步：批量插入到页面
workElementList.forEach(el => workx.append(el))