es6数组合并（es6解构赋值）

本文目录

• es6解构赋值
• JS ES6 数组对象多组多个属性相加求和
• ES6高级函数Array.reduce()和Object.assign()
• ES6中数组的方法

es6解构赋值

解构赋值 ES6 允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构，解构赋值要求等号两边的数据结构保持一致！

例：

  let arr = 

    let  = arr

    console.log(a, b, c, d)
 let arr = 

    let  = arr

    console.log(c, d)
 let arr = 

    // 我们可以通过下面这种方法给变量设置默认值 当解构到的值是undefined的时候 默认值就会生效

    let   = arr

    console.log(c, d)
   let arr = 

    // ... 扩展运算符 他会将剩余的所有数据赋值给同一个变量 他必须放在最后一个使用

    let  = arr

    console.log(a, b)
//数组合并

    var arr1 = 

    var arr2 = 

    var arr4 = 

    var arr3 = 

    console.log(arr3)

 var arr3 = arr1.concat(arr2, arr4)

    console.log(arr3)
 // 对象的解构赋值 对象的解构赋值是按照key的名字一一对应

例：

    var obj = {

      name: ’zhangsan’,

      age: 16,

      tel: 110,

      sex: undefined,

      info: {

        isSingle: true

      }

    }

    var {tel, age, name} = obj

    console.log(age)

    console.log(tel, age, name)
  let {name, ...obj2} = obj

    console.log(name, obj2)

    let { name, age, tel, sex="男" } = obj

    console.log(sex)

    let {info: {isSingle}} = obj

    console.log(isSingle)
  // 字符串解构赋值 因为字符串满足数组类型的一些特定方法 比如索引值 比如length属性 所以字符串可以按照数组的解构赋值方法进行解构

    var str = ’德玛西亚’

    let  = str

    console.log(a, b, c, d)

    let  = str

    console.log(b.join(’’))
 // 数字和布尔值不能直接进行解构赋值 因为他们是一个整体

JS ES6 数组对象多组多个属性相加求和

不知道你的数据格式怎么样，对象数组大致可以这么判断，返回true或false
arr.every(item=》{
let num=0
for(k in item){
num+=item
}
return num《100
})

ES6高级函数Array.reduce()和Object.assign()

很多时候需要累加数组项得到一个值（比如说求和）。如果你碰到一个类似的问题，你想到的方法是什么呢？for或者while循环，对数组进行送代，依次把他们的值加起来。比如

或者

虽然上面使用for和while都能实现需要的效果，但在JavaScript中有没有更好的方案呢？回答是肯定的，在JavaScript中（ESMAScript6）提供了另外两个数组方法reduce()和reduceRight()，这两个数组会送代数组的所有数组项，然后返回一个最终值。接下来的内容，主要来学习两种方法。

reduce()方法接收一个函数callbackfn作为累加器(accumulator)，数组中的每一个值（开始合并），最后成为一个值。

reduce()方法接收callbackfn函数，而这个函数包含四个参数：

preValue：上一次调用回调返回的值，或者是提供的初始值(initialValue)
curValue：数组中当前被处理的数组项
index：当前数组项在数组中的索引值
array：调用reduce()方法的数组

而initialValue作为第一次调用callbackfn函数的第一个参数。

reduce()方法为数组中的每一个元素依次执行回调函数。
callbackfn，不包含数组中被删除或者从未被赋值的元素，接收四个参数：初始值(或者上一次回调函数的返回值)，当前元素值，当前索引，调用reduce()的数组。

回调函数第一次执行时，preValue和curValue可以是一个值，如果initialValue在调用reduce()被提供，那么第一个preValue就等于initialValue，如果initialValue没有被提供，那么preValue等于数组中的第一个值，curValue等于数组中的第二个值。

就像这个：

上面的实例是没有提供initialValue这个参数，如果提供initialValue这个参数，initialValue = 5；

这样一来，不用多说，应该都知道，可以使用reduce()实现数组求和的功能，如

这基本就是这个方法的用发。

和它同样的还有一个reduceRight()方法的功能和reduce()方法的功能是一样的，不同的是reduceRight()方法是从数组的末端向前将数组中的数组项做累加。

语法

在JS中有一个很恶心的问题，就是引用数据类型让赋值的时候，操作一个另一个也会发生变化，很典型的一个堆栈问题。

就像这样，在ES6，出现了解决方式Object.assign();

如果目标对象中的属性具有相同的键，则属性将被源中的属性覆盖。后来的源的属性将类似地覆盖早先的属性。

Object.assign方法只会拷贝源对象自身的并且可枚举的属性到目标对象。

合并属性

合并的时候如果具有相同属性，会按照先后顺序，去覆盖赋值。

原型链上的属性和不可枚举的属性不可复制

ES6中数组的方法

1.forEach没有返回值，本质上等同于 for 循环，对每一项执行 function 函数。

2.可传三个形参 第一个是当前元素 为必填，第二个是当前索引值 可以不填，第三个是当前元素所属的数组对象 可以不填

1.map() 方法返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值。
2.可传三个形参 第一个是当前元素 为必填，第二个是当前索引值 可以不填，第三个是当前元素所属的数组对象 可以不填

3.使用map一定要return

1.filter() 方法创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。

2.可传三个形参 第一个是当前元素 为必填，第二个是当前索引值 可以不填，第三个是当前元素所属的数组对象 可以不填

1.find() 方法返回通过测试（函数内判断）的数组的第一个元素的值。

2.find() 方法为数组中的每个元素都调用一次函数执行,当数组中的元素在测试条件时返回 true 时, find() 返回符合条件的元素，之后的值不会再调用执行函数。如果没有符合条件的元素返回 undefined

3.可传三个形参 第一个是当前元素 为必填，第二个是当前索引值 可以不填，第三个是当前元素所属的数组对象 可以不填

1.every() 方法用于检测数组所有元素是否都符合指定条件（通过函数提供）。

2.every() 方法使用指定函数检测数组中的所有元素,如果数组中检测到有一个元素不满足，则整个表达式返回 false ，且剩余的元素不会再进行检测,如果所有元素都满足条件，则返回 true。

3.可传三个形参 第一个是当前元素 为必填，第二个是当前索引值 可以不填，第三个是当前元素所属的数组对象 可以不填

1.some() 方法用于检测数组中的元素是否满足指定条件（函数提供）。

2.some() 方法会依次执行数组的每个元素,如果有一个元素满足条件，则表达式返回true , 剩余的元素不会再执行检测,如果没有满足条件的元素，则返回false。

3.可传三个形参 第一个是当前元素 为必填，第二个是当前索引值 可以不填，第三个是当前元素所属的数组对象 可以不填

1.reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。

2.语法 array.reduce(function(total, currentValue, currentIndex, arr), initialValue),initialValue为初始值，可选填