JavaScript——扩展（展开）运算符

 //1，将展开运算符用在参数列表上fn(...args){}，这种语法也叫剩余语法，args是剩余参数 --------

    
 //如下使用：
    
 function fn(...args){
    
     console.log(args);
    
 }
    
 fn(1,5,0); 
    
 //输出：
    
 //[1,5,0]
    
  
    
 //剩余参数之前可以有n个参数，但剩余参数必须是参数列表的最后一个
    
 function fn1(arg1, arg2, ...args){
    
     console.log(arg1, arg2, args);
    
 }
    
 fn1(1,5,3); //此时剩余参数args的值: [3]
    
 //1 5 [3]
    
 fn1(1,5); //此时剩余参数args的值是个空数组: []
    
 //1 5 []
    
 fn1(1); //此时第二个参数值arg2是undefined，剩余参数args是空数组；[]
    
 //1 undefined []
    
 //可以认为当没有剩余的参数时，剩余参数是个没有元素的空数组--
    
  
    
 //当剩余参数不是参数列表的最后一个时，会报错；毕竟剩余参数的意义是将剩下参数收集到一个数组中，--
    
 //像如下这种使用并未支持。
    
 function fn2(arg1, ...args, argn){
    
 }
    
 //SyntaxError: Rest parameter must be last formal parameter
    
  
    
 //2，展开参数，是在调用函数时，传入的值是个可迭代对象如数组，以下会以参数值类型是数组为例-------
    
 //在传入的值前使用展开运算符，可以让数组的元素与函数参数列表按顺序一一对应，
    
 //若数组长度比参数列表长度小，那参数列表后边的参数值都为undefined
    
 //若未用开展运算符...，就是只传一个参数
    
 var args = ['test', 'exam', 'ahead', 'go'];
    
 function fn(arg1, arg2, arg3){
    
     console.log(arg1, arg2, arg3);
    
 }
    
 fn(...args); //调用函数，展开参数
    
 //输出
    
 //test exam ahead
    
 fn(...['test', 'exam']);
    
 //输出
    
 //test exam undefined
    
 //展开参数可以不是第一个传参，也可以不是最后一个!!!
    
 fn('first arg', ...['second one'], 'last one');
    
 //'first arg' 'second one' 'last one'
    
 //剩余参数和展开参数可以一起用；以例1的fn1为例：
    
 fn1(...['test', 'exam', 'ahead', 'go']);
    
 //'test' 'exam' ['ahead', 'go']
    
  
    
 //3，展开数组：展开运算符的操作数必须是可迭代对象 -------------------------
    
 //用在构建一个新的数组，相当于浅拷贝、合并数组，类似于concat方法
    
 [1, 3, ...[7, 9], ...[11, 13], 17];
    
 //[1, 3, 7, 9, 11, 13, 17]
    
 //字符串对象也是可迭代对象，它也可以用在展开数组中
    
 var str = 'strs';
    
 [...str, ...[3, 2, 1]]; //str是字符串字面量变量，在操作str时被包装成字符串对象，就像str.length
    
 //["s", "t", "r", "s", 3, 2, 1]
    
 //在数组中，若是扩展运算符的操作数是不可迭代的比如null、undefined、object，则会报错!!!-----
    
 [...undefined]
    
 //Uncaught TypeError: null is not iterable
    
  
    
 //4，展开对象，若遇到相同属性名，会发生覆盖，后面的属性值覆盖前面的属性值-----------------
    
 //数组或者其他对象(能转化为键值对的对象)也可以用在展开对象的语法中，不能扩展的对象会被会略。
    
 //如下利用展开语法，浅拷贝其他对象的属性并构建一个新的对象
    
 {...{'prop1': 'test'}, ...{'prop1': 'exam', 'prop2': 'go'}, ...['arr1', 'arr2'], ...('S'), ...(true), 'ownProp': 'one of most'}
    
 //结果如下数组的第一个元素被字符串的第一个字符覆盖，第一个对象的prop1被覆盖，bool值true被忽略
    
 //{0: "S", 1: "arr2", prop1: "exam", prop2: "go", ownProp: "one of most"}
    
 //不像数组，在对象中，扩展一个undefined或者null之类的或不是存在键值对形式的数据，不会报错！！---
    
 {...undefined}
    
 //{}