扩展运算符 REST

扩展运算符 REST

​ 扩展运算符指的是…标识符 这个东西是一种新的运算模式 主要的作用有三点

1.解开数组 对象等数据结构

​ 使用该运算符 我们可以直接使用…后面跟上自定义的标识符 进行解开数据结构

let obj = {
    name : 'Eric',
    age : 18,
    sex : '男'
}
let arr = [11,33,55,77,'你好',3.14,null,undefined,{name:'Mary'}];

// 使用扩展运算符解开数组
console.log(...arr);

2.浅拷贝

​ 如果是单层数据 可以实现深拷贝 但是如果说是多层

​ 比如说数组里面的对象或者是对象中的数组 那么我们只能实现浅拷贝

// 浅拷贝
let arr1 = [1,2,3,{name:'Mary'}];
let arr2 = [...arr1];
console.log(arr2);
arr1.push(4)
console.log(arr1);
console.log(arr2);

arr1[3].age = 18;
console.log(arr1);
console.log(arr2);
let obj = {
    name : 'Eric',
    age : 18,
    sex : '男'
}

let newObj = {
    ...obj
}
console.log(newObj);

3.传递不定参数

​ 也就是剩余参数 在常规函数中 我们使用arguments传递不定参数 但是在箭头函数中 不允许使用arguments

​ 可以使用剩余参数 参数的名字自定义 参数前面加上…

// rest剩余参数

// let sum = (a,b)=>{
//     return a + b;
// }
// console.log(sum(1,2,3));

// 传递不定参数  使用rest运算符
/*
    在使用的时候  形参前面加上...  形参的名字自定义
    他可以接受多个参数  那么参数会组成一个数组  带入到函数体中
    在函数体中使用的时候  不要在加上...
    使用的时候注意   在一个函数中  只能有一个rest参数
*/
let sum = (...item)=>{
    // console.log(item);
    let total = 0;
    item.forEach(element => {
        total += element
    });
    return total;
}

console.log(sum(1,2,3,4,5,6));


// rest运算符可以和普通参数一起进行传递  但是注意  普通参数只能写在前面
let sum = (a,...item)=>{
    // console.log(item);
    let total = 0;
    item.forEach(element => {
        total += element
    });
    return total;
}

console.log(sum(1,2,3,4,5,6));

​ 总结

​ arguments和rest参数之间的区别

​ 1.rest参数必须在形参列表中定义形参 但是arguments在形参列表中不能写任何内容

​ 2.rest参数可以和普通参数一起传递

​ 3.rest参数可以应用于箭头函数 但是arguments 不能