`...` 展开运算符(Spread Operator)详解

🎯 一句话解释

...arr 的作用是:把数组"拆开",变成一个个独立的元素


📦 对比:有 ... vs 没 ...

javascript 复制代码
let arr = [1, 2, 3];

// ❌ 没有 ... (传进去的是整个数组)
Math.min(arr);  
// 等同于:Math.min([1, 2, 3]) 
// 结果:NaN ❌(Math.min 不认识数组)

// ✅ 有 ... (把数组拆开成独立元素)
Math.min(...arr);  
// 等同于:Math.min(1, 2, 3) 
// 结果:1 ✅

🔄 展开过程可视化

javascript 复制代码
let arr = ["12.50", "3.25", "9.75"];

// ...arr 展开后:
Math.min(...arr);
// 👇 变成了:
Math.min("12.50", "3.25", "9.75");
// 👇 再配合 map(Number) 变成:
Math.min(12.50, 3.25, 9.75);
// 结果:3.25 ✅

🆚 更多对比例子

代码 等同于 结果
Math.min([1, 2, 3]) Math.min([1, 2, 3]) NaN
Math.min(...[1, 2, 3]) Math.min(1, 2, 3) 1
Math.max(5, 8, 2) 本身就是多个参数 8
Math.max(...[5, 8, 2]) Math.max(5, 8, 2) 8

💡 为什么需要 ...

因为 Math.min() / Math.max() 期望接收的是多个独立的数字参数,而不是一个数组:

javascript 复制代码
// ✅ 这种写法 Math.min 能看懂
Math.min(1, 2, 3, 4, 5);

// ❌ 这种写法 Math.min 看不懂
Math.min([1, 2, 3, 4, 5]);

// ✅ 用 ... 把数组"打散"成独立参数
Math.min(...[1, 2, 3, 4, 5]);

🔧 ... 的其他用法

🔹 1. 合并数组

javascript 复制代码
let a = [1, 2];
let b = [3, 4];
let c = [...a, ...b];  // [1, 2, 3, 4]

🔹 2. 复制数组

javascript 复制代码
let arr = [1, 2, 3];
let copy = [...arr];  // [1, 2, 3](新数组,不影响原数组)

🔹 3. 传参给函数

javascript 复制代码
function sum(a, b, c) {
    return a + b + c;
}

let nums = [1, 2, 3];
sum(...nums);  // 等同于 sum(1, 2, 3) → 6

📊 总结

写法 含义 能用吗?
Math.min(arr) 传一个数组进去 NaN
Math.min(...arr) 把数组拆开成独立元素 ✅ 正确
Math.min(...arr.map(Number)) 先转数字,再拆开 ✅✅ 最推荐

💡 记忆口诀

... = "拆开!"

把数组 [1, 2, 3] 拆成 1, 2, 3

没有 ... 就是把整个数组当一个东西扔进去,函数不认识 😂

相关推荐
神州世通13 小时前
解密企业通信安全防线:Avaya Aura 三层安全架构深度解析
开发语言·php
郝亚军14 小时前
如何安装webstorm、Node.js和vue CLI
前端·javascript·vue.js
AC赳赳老秦14 小时前
企业工商公开信息采集分析:OpenClaw 批量查询企业工商信息,生成企业画像报告
大数据·开发语言·python·自动化·php·deepseek·openclaw
qq_25183645715 小时前
基于java Web 动漫视频网站毕业论文
java·开发语言·前端
野生风长15 小时前
C++入门基础:从命名空间到引用与指针的全面解析
开发语言·c++
FoldWinCard15 小时前
D6 Python 基础语法 --- 保留关键字
开发语言·python
an3174215 小时前
6MB 组织树大文件性能优化全流程
前端·javascript·vue.js
TeamDev16 小时前
JxBrowser 9.3.1 版本发布啦!
java·前端·javascript·c#·混合应用·jxbrowser·浏览器控件
风吹心凉16 小时前
python3基础2026.7.22
开发语言·python
qq_4523962316 小时前
第五篇:《接口与错误处理:Go 的哲学》
开发语言·后端·golang