2026 JavaScript 废弃 API 速查：字符串、日期、DOM 替代方案

随着 ECMAScript 标准持续演进，越来越多的老旧 JavaScript API 已被官方标记为废弃或直接从规范中移除。如果你还在项目中依赖 substr、getYear 或 attachEvent，是时候更新你的知识库了。云栈社区为你梳理了 2026 年必须淘汰的系列方法，并给出安全现代化的替代方案，避免入坑。

一、字符串操作类：这些过时方法不应再用了

1. String.prototype.substr()

废弃原因：非标准遗留特性，其参数规则与 substring、slice 完全不一致，极易造成混淆。该方法已被纳入 ECMAScript 附录 B，仅为兼容旧代码而保留，任何新代码都不应继续使用。

❌ 错误写法（废弃）

const str = 'frontend';
// 第一个参数是起始索引，第二个是截取长度，极易和 substring 搞混
const res = str.substr(2, 3); // 输出 'ont'

✅ 替代方案：String.prototype.substring() 或 String.prototype.slice()

// substring(起始索引, 结束索引)
const res1 = str.substring(2, 5); // 输出 'ont'
// slice 支持负数索引，更灵活，日常优先推荐
const res2 = str.slice(2, 5); // 输出 'ont'

2. String.prototype.trimLeft() / trimRight()

废弃原因：语义不够统一，新标准已明确给出语义更清晰的命名。部分新版浏览器已逐步移除支持。

❌ 错误写法（废弃）

const str = '  hello world  ';
str.trimLeft();  // 去除左侧空格
str.trimRight(); // 去除右侧空格

✅ 替代方案：trimStart() / trimEnd()（全现代浏览器支持，语义一目了然）

str.trimStart(); // 替代 trimLeft，语义更清晰
str.trimEnd();   // 替代 trimRight

3. escape() / unescape()

废弃原因：编码规则不规范，无法正确处理 Unicode 字符，存在安全风险。该函数已完全废弃，随时可能从浏览器中移除。

❌ 错误写法（废弃）

escape('前端开发');             // 编码结果不标准，特殊字符处理异常
unescape('%u524D%u7AEF');      // 解码异常

✅ 替代方案：encodeURI() / encodeURIComponent() 及其对应解码函数

// 处理完整 URL
encodeURI('https://xxx.com/前端');
// 处理 URL 参数，更常用
encodeURIComponent('前端开发');
// 对应解码
decodeURIComponent('%E5%89%8D%E7%AB%AF%E5%BC%80%E5%8F%91');

---

二、日期时间类：千年虫加兼容陷阱，麻烦不断

1. Date.prototype.getYear() / setYear()

废弃原因：经典的“千年虫”问题——返回的是年份减去 1900 的数值，比如 2024 年返回 124，极其容易引发逻辑错误。该方法已从标准中废弃。

❌ 错误写法（废弃）

const date = new Date();
date.getYear(); // 2024 年返回 124，完全不符合预期

✅ 替代方案：getFullYear() / setFullYear()，直接返回完整四位年份，零歧义

date.getFullYear();   // 2024，正确返回
date.setFullYear(2025); // 正确设置年份

2. Date.prototype.toLocaleFormat()

废弃原因：非标准方法，仅 Firefox 旧版本曾支持，Chrome、Safari 完全不兼容，现已被移除。

✅ 替代方案：Intl.DateTimeFormat()，标准国际化 API，全浏览器兼容，格式化能力更强大

// 格式化日期：2024-05-20
const formatter = new Intl.DateTimeFormat('zh-CN', {
  year: 'numeric',
  month: '2-digit',
  day: '2-digit'
});
formatter.format(new Date());

---

三、DOM 与 Web API 类：安全、性能双双踩雷

1. document.execCommand()

废弃原因：曾用于富文本编辑、复制粘贴等操作，但不同浏览器行为差异巨大，兼容性极差，且存在 XSS 安全风险。现代浏览器已全面标记废弃，不再维护。

❌ 错误写法（废弃）

// 复制文本，老掉牙写法
document.execCommand('copy');

✅ 替代方案：Clipboard API（navigator.clipboard），异步、安全、标准化，适用于所有现代浏览器

// 异步复制文本，推荐写法
const copyText = async (text) => {
  try {
    await navigator.clipboard.writeText(text);
    console.log('复制成功');
  } catch (err) {
    console.error('复制失败', err);
  }
};

2. 同步 XMLHttpRequest

废弃原因：同步请求会阻塞 JS 主线程，导致页面卡死、交互无响应，严重损害用户体验。官方已强烈禁止使用，新版浏览器均会抛出废弃警告。

❌ 错误写法（废弃）

// 第三个参数设为 false，开启同步，卡死主线程
const xhr = new XMLHttpRequest();
xhr.open('GET', '/api/data', false);
xhr.send();

✅ 替代方案：fetch API（基于 Promise，完全异步，语法更简洁）

fetch('/api/data')
  .then(res => res.json())
  .then(data => console.log(data))
  .catch(err => console.error(err));

// 更优雅的 async/await 写法
const getData = async () => {
  try {
    const res = await fetch('/api/data');
    const data = await res.json();
    return data;
  } catch (err) {}
};

3. event.srcElement / window.event

废弃原因：IE 旧版本专属 API，现代浏览器仅为兼容保留，非标准写法会导致代码健壮性极差。

❌ 错误写法（废弃）

// IE 旧版获取事件目标
dom.onclick = function(e) {
  const target = e.srcElement || window.event.srcElement;
};

✅ 替代方案：event.target，W3C 标准，所有浏览器一致兼容

dom.onclick = function(e) {
  const target = e.target; // 标准写法，无兼容问题
};

4. element.attachEvent()

废弃原因：IE 专属事件绑定方法（仅 IE5‑IE10 支持），IE11 及现代浏览器已完全废弃。该方法无法正常解绑事件，容易导致内存泄漏。

✅ 替代方案：addEventListener()，标准事件监听，支持多事件绑定与事件捕获/冒泡

// 标准绑定
dom.addEventListener('click', handleClick, false);
// 解绑
dom.removeEventListener('click', handleClick);

---

四、对象与函数类：严格模式下直接报错

1. arguments.callee / function.caller

废弃原因：严格模式下完全禁用，会泄漏函数调用上下文，破坏模块化，性能差，递归场景极易出现内存问题。

❌ 错误写法（废弃）

// 递归调用自身，严格模式报错
function factorial(num) {
  if(num <= 1) return 1;
  return num * arguments.callee(num - 1);
}

✅ 替代方案：使用具名函数进行递归，或采用箭头函数，彻底避免依赖 arguments.callee

// 具名函数递归，标准写法
function factorial(num) {
  if(num <= 1) return 1;
  return num * factorial(num - 1);
}

2. Object.prototype.proto / defineGetter / defineSetter

废弃原因：非标准原型访问方式，破坏原型链规范，存在安全隐患，已被标准 API 完全替代。

✅ 替代方案：

• __proto__ 替换为 Object.getPrototypeOf() / Object.setPrototypeOf()
• defineGetter 替换为 Object.defineProperty() / Object.getOwnPropertyDescriptor()

3. Object.observe() / Array.observe()

废弃原因：性能开销极大，API 设计混乱，从未进入正式标准，现已彻底移除。

✅ 替代方案：Proxy（同时也是 Vue 3 响应式系统的核心），灵活度极高，性能更优

---

至此，我们梳理了从字符串、日期、DOM 到对象函数的典型废弃 API。及时迁移至现代替代方案，不仅是保证代码兼容性的要求，更是提升安全性、可维护性的必要措施。更多前端领域的避坑指南、技术手册，可以查阅 技术文档 专区。