JS-展开运算符、合并运算符

5,合并,展开运算符 ...
    定义在形参中 function fun (...arr){}
        将所有的实参,都以数组单元的形式,存储在形参中
        可以通过操作数组的方法来获取实参

    定义在实参中 function fun (形参1,形参2,形参3,形参4){}   fun(...数组);
        将数组中的数据,展开,一一对应的赋值给形参

    普通函数 function 中 有 JavaScript 专门定义好的变量 arguments
        如果没有定义形参,arguments会以数组的形式来存储所有的实参
    箭头函数中,没有 arguments 变量
        要想以数组的形式,存储实参,必须使用 合并运算符

一.展开运算符

展开运算符
...数组
将数组中的数据,展开来使用
在函数的实参中使用

// 有多个形参
function fun(num1,num2,num3,num4,num5){
    console.log(num1,num2,num3,num4,num5)
}
// 执行时就要输入多个实参
fun(100,200,300,400,500);

// 现在有一个数组,存储多个数据
const arr = [1,2,3,4,5];
fun(arr[0],arr[1],arr[2],arr[3],arr[4]);
// 展开运算符,将数组中的数据展开使用
// 将arr中的数据,展开,对形参进行一一对应的赋值
// 通过数组,给多个形参赋值更简单
fun(...arr);

二.合并运算符

合并运算符
...
在函数的形参中使用
作用:将赋值的所有的实参,都是以数组的形式,存储在形参中

// 只有一个形参,形参只能存储一个实参 
function fun(arr){
    console.log(arr);
}
// 即时输入多个参数,只有一个形参,也只能存储第一个实参
fun('a','b','c','d');    →    a


合并运算符
// 不管实参有几个,都以数组的形式,存储在形参中
function fun1(...arr){
    console.log(arr);
    // 调用存储在形参arr中的实参,必须用过[]语法,索引下标
    // 或者 循环遍历 获取
}
// 输入的所有的实参,都会以数组的数据的形式,存储在形参arr中
fun1('a','b','c','d','e',1,2,3,4,5);Array(10)...

在 普通函数中,JavaScript定义了一个专门的变量,arguments(参数)
如果你没有定义形参,所有的实参都会以数组的形式存储在这个变量中
作用于合并运算符相同
但是 箭头函数中 没有 arguments 这个变量
必须使用 ...形参 合并运算符的形式 来存储实参

// 没有形参,JavaScript自动在arguments中,以数组的形式存储实参
function fun3(){
    console.log(arguments);
}

fun3(1,2,3,4,5,6,7);Arguments(7)....
// 箭头函数没有arguments,使用的话会报错
// 只能使用 合并运算符 ...形参
// const fun4 = ()=>{
//     console.log(arguments);
// }

// fun4(1,2,3,4,5);

const fun5 = (...arr)=>{
    console.log(arr);
}

fun5(1,2,3,4,5);Array(5)...
发布了125 篇原创文章 · 获赞 4 · 访问量 2844

猜你喜欢

转载自blog.csdn.net/DcTbnk/article/details/105422311
今日推荐