let/const 与解构赋值
├── let
│   ├── 块级作用域（{} 内有效）
│   ├── TDZ（声明前访问报错）
│   └── 不允许重复声明
│
├── const
│   ├── 声明必须赋值、不可重新赋值
│   ├── 对象/数组内容可以修改（锁地址不锁内容）
│   └── 命名约定：常量用全大写（MAX_TEMP）
│
├── 对比 var
│   ├── var：函数作用域、提升、可重复声明、进 window
│   ├── let/const：块级、TDZ、不可重复、不进 window
│   └── 使用原则：默认 const，要赋值用 let，不用 var
│
├── 数组解构
│   ├── 按位置：let [a, b] = arr
│   ├── 交换：[a, b] = [b, a]
│   ├── 跳过：逗号占位
│   ├── 默认值：右边 undefined 时使用
│   └── rest：...rest 收集剩余
│
├── 对象解构
│   ├── 按属性名（顺序无所谓）
│   ├── 重命名：{ a: x }
│   ├── 默认值、嵌套
│   └── 参数解构：fn({name, temp})
│
└── 综合应用
    ├── for...of + 解构遍历对象数组
    ├── rest 参数替代 arguments（真数组）
    └── 从 API 对象一次性提取字段（重命名+嵌套+默认值）

// 交换变量
[a, b] = [b, a];

// 函数参数解构 + 默认值
function fn({ id, name = "未知" } = {}) {}

// rest 参数求和
const sum = (...nums) => nums.reduce((a, b) => a + b, 0);

// for...of 解构遍历
for (const { id, temp } of deviceList) {}

// ❌ 以为 const 就不能改，导致数据操作卡住
const device = { temp: 65 };
device = { temp: 85 };  // ❌ 报错（换地址）

// ✅ const 允许改内容
const device = { temp: 65 };
device.temp = 85;  // ✅ 可以

// ❌ 开头 { 被当作代码块，语法错误
let x;
{ x } = { x: 1 };  // ❌ SyntaxError

// ✅ 整体加括号
let x;
({ x } = { x: 1 });

// ❌ 解构 null 直接报错，页面崩溃
const data = getData();  // 可能返回 null
const { id } = data;     // ❌ TypeError

// ✅ 先判空或用默认值
const { id } = data || {};
// 或者调用处保证 data 不是 null

// ❌ 以为对象解构按位置
const obj = { id: "A", name: "B" };
const { id, name } = obj;  // ✅ 但这是按属性名，不是位置

// ❌ 顺序写反也不行吗？——不，顺序无所谓，名字对就行
const { name, id } = obj;  // ✅ 一样能取到

// ❌ 用 var，批量绑定事件全是最后一个
for (var i = 0; i < btns.length; i++) {
  btns[i].onclick = function () { console.log(i); };  // 全是 length
}

// ✅ 用 let，每个按钮独立
for (let i = 0; i < btns.length; i++) {
  btns[i].onclick = function () { console.log(i); };  // 0,1,2...
}