各位往生堂的小弟子、MC 红石建筑师们，欢迎继续实战！上一节我们搞定了零误差找零计算，本节进入变量互换实战：避开直接赋值覆盖、算术运算翻车的坑，写出带参数校验、异常防护的安全变量互换函数。
一、实战目标
破解变量互换直接覆盖、运算失效的经典 bug
掌握通用、安全的变量互换写法
用 throw 做参数校验，用 try/catch 捕获异常
支持数字、字符串等常用类型安全互换
二、双世界观类比
往生堂类比
变量互换就像往生堂交换两份卷宗的内容，直接赋值互换，相当于把第一份卷宗直接覆盖成第二份，原文内容彻底丢失；临时变量 / 解构赋值，就像用临时置物台暂存一份，再平稳交换，内容丝毫不乱。参数校验就像查验卷宗是否存在，未登记、无效的卷宗直接抛出异常，拒绝交换。
我的世界类比
变量互换如同两个储物箱交换物品，直接倒换会导致物品覆盖、丢失，机器彻底失灵；借助临时中转箱交换，才能完整互换、不丢物品。参数校验就像检测箱子是否有效，无效箱子直接切断流程，抛出异常阻止错误交换。
三、经典踩坑回顾（必看）
踩坑 1：直接赋值覆盖（最常见）
javascript
运行
let a = 5;
let b = 10;
// 错误互换，直接覆盖
a = b;
b = a;
console.log(a, b); // 10 10，内容全丢
踩坑 2：算术运算互换（仅限数字、易翻车）
javascript
运行
let a = 2.1;
let b = 1.1;
// 浮点数精度丢失，互换结果错乱
a = a + b;
b = a - b;
a = a - b;
非数字、浮点数用此法，直接出现 NaN、精度错误，完全失效。
四、正确变量互换方案（两种通用）
方案 1：临时变量法（兼容所有环境、最稳妥）
借助临时变量暂存值，逻辑清晰，支持所有数据类型。
javascript
运行
let a = 5;
let b = 10;
let temp = a; // 临时暂存
a = b;
b = temp;
方案 2：ES6 解构赋值（简洁优雅、现代首选）
一行代码完成互换，无需临时变量，可读性极高。
javascript
运行
let a = 5;
let b = 10;
[a, b] = [b, a];
五、实战升级：加校验 + 主动抛异常
结合第 48 节 throw，对互换变量做严格校验：变量未定义 → 抛异常变量为 null / 非法空值 → 抛异常合法变量 → 安全互换
javascript
运行
"use strict";
/**
* 安全变量互换函数
* @param {*} a - 待互换变量1
* @param {*} b - 待互换变量2
* @returns {Array} 互换后的 [a, b]
* @throws 变量未定义、非法值时抛异常
*/
function swapSafe(a, b) {
// 校验1：变量必须已定义，不能是 undefined
if (a === undefined || b === undefined) {
throw new Error("互换变量不能未定义");
}
// 校验2：排除 null 非法值
if (a === null || b === null) {
throw new Error("互换变量不能为null");
}
// 核心：解构赋值安全互换
[a, b] = [b, a];
return [a, b];
}
六、完整调用：捕获异常 + 真实互换
javascript
运行
"use strict";
// 测试正常互换
try {
// 数字互换
console.log(swapSafe(5, 10));
// 字符串互换
console.log(swapSafe("胡桃", "往生堂"));
// 测试未定义变量，触发异常
let x;
console.log(swapSafe(x, 10));
} catch (err) {
console.log("互换失败：", err.message);
}
七、多场景测试结果
数字 5 和 10 互换，得到 [10,5]，正常完成字符串 "胡桃" 和 "往生堂" 互换，得到 ["往生堂","胡桃"]，正常完成传入未定义变量，函数抛出异常并提示变量不能未定义传入 null 值，函数抛出异常并提示变量不能为 null
八、实战避坑要点
绝对不要直接连续赋值互换，会导致值完全覆盖丢失
禁止用算术运算做通用互换，仅数字可用且存在精度风险
日常开发优先用解构赋值，兼容老环境用临时变量法
互换函数必须加参数校验，用 throw 拦截未定义、null 等非法值
调用带抛错的互换函数，必须套 try/catch，避免程序中断
九、本节实战总结
掌握变量互换的两种通用正确写法，彻底告别覆盖丢失 bug
理解临时变量与解构赋值的适用场景
把异常校验用到变量操作场景，提升代码健壮性
写出简洁、安全、可上线的变量互换工具函数
课后练习题
基础题
直接连续赋值互换变量会出现什么问题？
现代 JS 推荐的一行代码互换方式是什么？
互换前检测到未定义变量，用哪个关键字抛异常？
进阶题
基于本节代码，封装一个对象属性互换函数，同样加参数校验与异常抛出。
津ICP备2022002164号-2 © 2016-2023 iHuaBen.com 版权保护声明 不良信息举报:tousu@liangzishidai.cn 举报电话:0772-2994948
京公网安备11010502036362号