「这是我参与2022首次更文挑战的第34天,活动详情查看:2022首次更文挑战」
写在前头
大多数小伙伴看技术书籍都会用“啃”来描述读书的直观感受,当然我也是一个前端小白,白的透明那种,但是我在读技术书籍感觉到“啃”的时候,我希望把我啃红宝书第四版的过程的想法,总结带给大家,以供后来者能够更快上手。
注: 本文由于作者水平原因,如有错误之处,恳请大家指正,另外随着学习的深入,体会的加深,我会不断回来更新,修改这类文章。
思维导图
简述
函数这一章其实在有一定的编程基础,比如学过一点c语言就很好读下去。整体还是易读板块。
10.6参数扩展与收集
10.6.1扩展参数
-
累加
迭代arguments对象
let values = [1, 2, 3, 4]; function getSum() { return Array.from(arguments).reduce((pre, cur) => pre + cur, 0); }
②apply()
console.log(getSum.apply(null, values)); // 10
③扩展操作符
使用扩展操作符可以把数组逐个元素传入函数。将可迭代对象拆分。将迭代拆分的返回值单独输入。
扩展操作符是“…”
let values = [1, 2, 3, 4]; console.log(getSum(...values)); // 10
使用扩展操作符时候,依然可以和其他参数混合使用。前后都可以添加参数。
let values = [1, 2, 3, 4]; console.log(getSum(-1,...values, 2)); // 11
还可以使用多个扩展符
let values = [1, 2, 3, 4]; console.log(getSum(...values, ...[5,6,7])); // 28
-
arguments对象与扩展操作符
arguments对象不知道是否使用了扩展操作符,但是他只会老老实实地把使用扩展符传入的参数依次保存到“数组”。
- 命名参数
在普通函数,箭头函数中可以使用扩展操作符用于命名参数,和默认参数结合使用。
let values = [1, 2, 3, 4];
function countArguments() {
console.log(arguments.length);
}
countArguments(-1, ...values); // 5
countArguments(...values, 5); // 5
countArguments(-1, ...values, 5); // 6
countArguments(...values, ...[5, 6, 7]); // 7
10.6.2收集参数
- 使用扩展操作符传参
在构思函数定义时,可以使用扩展操作符把不同长度的独立参数组合为一个数组。类似arguments 对象的构造机制,只收集参数会得到一个 Array 实例。
-
收集参数前面有命名参数
必须把扩展操作符放在末尾。
-
箭头函数
①不支持 arguments 对象
②支持收集参数的定义方式
-
arguments对象与收集参数
2者并没有什么直接关系,不会感染arguments对象存入传入的参数。
使用收集参数并不影响 arguments 对象,它仍然反映调用时传给函数的参数