Array数组的方法

1.Array.from()

将类数组结构转化为数组实例，

一参数是类数组对象即任何可迭代的结构，或者有一个length属性和可索引元素的结构

二参数是映射函数参数（可选）此函数可增强新函数的值，

三参数是指定映射函数中的this值（可选），但这个重写函数在箭头函数中不适用，

let rom ="echarts";

Array.from(row) //['e', 'c', 'h', 'a', 'r', 's']

let arr=[1,2,3,4];

let a1=Array.from(arr,x=>x*2) //[2,4,6,8]

let a2=Array.from(arr,function(x){return x*this.exponent},{exponent:2})//[2,4,6,8]

2.Array.of()

可以把一组参数转换为数组。替代es6之前的Array.prototype.slice.call(arguments)一种将arguments对象转换为数组的方法

Array.of(1,2,3) //[1,2,3]

Array.of(undefined) //[undefined]

3.检测数组的方法

instanceof

        if(value instanceof Array){

                操作数组

        }

isArray

        if(Array.isArray(value)){

                操作数组

        }

instanceof的缺陷：使用instansof的问题假设只有一个全局执行上下文。如果网页里面有多个框架，则可能涉及两个不同的全局执行上下文，会有两个不同的版本的Array构造函数。如果要把数组从一个框架传给另一个框架，则这个数组的构造函数将有别于在第二个框架内本地创建的数组。

为了解决这个问题，提供了Array.isArray()方法。

4.检索数组内容的方法

keys(),values(),entries()

   let arr1=['foo','far','bar','quez'],

    console.log(arr1.keys()) //Array Iterator
    console.log(arr1.values())  //Array Iterator
    console.log(arr1.entries())  //Array Iterator   返回的都是迭代，需要转换


console.log(Array.from(this.arr1.keys())) // [0, 1, 2, 3]
console.log(Array.from(this.arr1.values())) //['foo', 'far', 'bar', 'quez']
console.log(Array.from(this.arr1.entries())) //[[0,'foo'],[1,'far'],[2,'bar'],[3,'quez']]
    
    
//虽然都是es6定义的，但是仍有浏览器没有实现他们

5.复制和填充方法

es6新增：copyWithin(),fill()

fill():向已有的数组插入全部或者部分相同的值

copyWithin():按照指定范围浅复制数组中的部分内容，将他们插入到指定索引开始的位置

//fill()
let arr =[1,2,3,4,5]

//用5充填数组

arr.fill(5) //[5,5,5,5,5]

//用6充填，

arr.fill(6,3) // [1,2,3,6,6]

//用7充填

arr.fill(7,1,3) //[1,7,7,4,5]

//用8充填索引大于等于1且小于4的元素

arr.fill(8,-4,-1) //[1,8,8,8,5]



//copyWithin()

let ints,

reset=()=>ints=[0,1,2,3,4,5,6,7,8,9]

reset()

//从ints中复制索引0开始的内容，插入到索引5开始的位置
//在源索引或目标索引到达数组边界时为止

ints.copyWithin(5)
console.log(ints) //[0,1,2,3,4,0,1,2,3,4] 会改变原数组
reset()


//复制索引5开始的内容，插入到索引0开始的位置
ints.copyWithin(0,5)
console.log(ints) //[5,6,7,8,9,5,6,7,8,9]
reset()


//复制索引0开始的内容，插入到索引3结束的位置 插入到索引4开始的位置

ints.copyWithin(4,0,3)
console.log(ints) //[0,1,2,3,0,1,2,7,8,9]

6.栈方法

ecmascript为数组提供了几个方法，让他看起来像另外一种数据结构，数组可以像栈一样，显示插入和删除项的数据结构。

栈是一种后进先出(LIFO)的结构，最近添加的项先被删除，数据项的插入和删除只在栈一个地方发生，即栈顶。ecmascript数组提供了push()和pop()方法,以实现类似栈的行为。

push()接受任意参数，并添加到尾部，返回数组的length，

pop()则用于删除数组的最后一项，减少数组的length值，返回被删除的项，

let arr =[1,2,3]


let count =arr.push('4','5')

console.log(count) //[1,2,3,4,5]

consolie.log(count.pop()) //5

7.队列方法

就像栈是以LIFO形式限制访问的数据结构一样，队列以先进先出(FIFO)形式限制访问，队列在列表尾部添加数据，在列表头部获取数据。push在数据末尾添加数据，

shift()和push()可以把数组当成队列来使用：

let colors = new Array();

let count =colors.push('1','2')

console.log(count)  // 1,2

let item =colors.shift();

console.log(item) // 1

//push和shift组成正方向队列，unshift()和pop()组成反方向上队列

shift()方法模拟数组开头获取数据，它会删除数组的第一项并返回他，然后长度减1。

unshift()在数组开头添加任意多个值，然后返回新数组的长度

8.排序方法

reverse():将数组元素反向排列，不够灵活

sort()：默认升序排列数组，sort在每一项调用String()转型函数，比较字符串来决定顺序，排序。

let value =[0,1,5,10,15]

value.sort();

console.log(value) //0,1,10,15,5

sort排序会出现这种意外，为此sort方法可以接收一个比较函数，用于判断哪个值应该在前面。

比较函数接受两个参数，如果第一个参数应该排第二个参数的前面，就返回负值，如果相等返回0，如果排在后面返回正值。

function compare(value1,alue2){

    if(value1<value2){

        return -1
    }else if(value1>value2){

            return 1
        }else{

            return 0
        }

}

let value =[0,1,5,10,15]

value.sort(compare);

console.log(value) //0,1,5,10,15

9.操作方法

concat()

可以在现有数组元素的基础上创建一个新数组。首先会创建一个副本，将它的参数添加到副本末尾，最后返回找个新构建的数组。

let colors =['red','green','blue'];

let newColors=['black','brown'];

let arr=newColors.concat(colors ) //['black','brown',['red','green','blue']]


//数组打平

//数组打平可以重写，方法是在参数数组上指定一个特殊符号：Symbol.isConcat-Spreadable.
//这个符号能阻止concat()打平参数数组，如果值为true，可以强制打平类数组对象。

let colors =['red','green','blue'];

let newColors=['black','brown'];

let moreColors ={
[Symbol.isConcatSpreadable]:true,
length:2,
0:'pink',
1:'cyan'
};

newColors[Symbol.isConcatSpreadable]=false,

let arr2=colors.concat(newColors) //['red','green','blue',['black','brown']] //强制不打平

let arr3=colors.concat(moreColors )//['red','green','blue','pink','cyan'] //强制打平

slice()

用于创建一个包含原有数组中的一个或多个元素的新数组。

可以接收一到两个参数：返回元素的开始索引和结束索引。

如果有一个参数，则slice()会返回该索引到数组末尾的所有元素。

如果有两个参数，则slice()会返回从开始索引到结束索引对应的所有元素，但是不包括结束索引对应的元素。这操作不影响原始数组。

let colors =['red','green','blue'];


ler arr =colors.slice(1)//['green','blue'];


let arr1=colors.slice(1,1) //['blue']

splice()

主要目的是在数组中插入元素，但有三种不同的方式使用这个方法：

删除：需要给splice()传入2个参数，要删除的第一个元素的位置和要删除的元素数量。可以从数组中删除任意多个元素，

插入：需要给splice()传3个参数，开始位置，0（要删除的数量）和要插入的元素，可以在数组指定位置插入元素。第三个参数之后还可以传第四个，第五个参数，乃至任意多个要插入的元素。

比如splice(2,0,'red','green')会在数组位置2开始插入字符串‘red’和‘green’

替换：splice()在删除元素的同时可以在指定位置插入新元素，同时传3个参数:开始位置，要删除元素的数量和要插入的任意多个元素。要插入的元素数量不一定跟删除的元素一致。

10，搜索和位置方法

严格相等

indexOf(),lastIndexOf()和includes()这些方法都接收两个参数，要查找的元素和一个可选的起始搜索位置，要使用===比较，也就是说两项必须严格相等。

indexOf()从数组开头搜索，返回数组的元素的位置，

lastIndexOf()从数组末尾搜索，返回数组元素的位置，

includes()从数组开头搜索，返回布尔值，

断言函数

断言函数的返回值决定了相应索引的元素是否被认为匹配。断言函数接收三个参数：元素，索引，数组本身。其中元素是当前搜索的元素，索引是当前元素的索引，数组是正在搜索的数组。断言函数返回真值，表示是否匹配。

find()和findIndex()方法使用了断言函数。

这两个方法都是从数组的最小索引开始的，find返回第一个匹配的元素，findIndex返回第一个匹配的元素的索引，这两个方法都接收第二个可选的参数，用于指定断言函数的内部的this的值。

11迭代方法

ECMAscript为数组定义了5个迭代方法。每个方法都接收两个参数：以每一项为参数运行的函数，以及可选的作为函数运行上下文的作用域对象（影响函数种this值）/传给每个方法的函数都接收3个参数：数组元素，元素索引和数组本身。

every():对数组每一项都运行传入的函数，如果对每项函数都返回true，则这个方法返回true。

filter()：对数组每一项都运行传入的函数，函数返回true的项会组成数组后返回。

forEach()：对数组每一项都运行传入的函数，没有返回值（undefined）

map()：对数组每一项都运行传入的函数，返回由每次函数调用的结果构成的数组(返回新数组)。

some()：对数组每一项都运行传入的函数，如果有意向函数返回true，则这个方法返回true。

这些方法都不改变调用他们的数组。

let arr=[1,2,3,4,5,6,7,8,9]


let result=arr.every((item,index,array)=>item>2)  //false

let result=arr.some((item,index,array)=>item>2) //true

ler result=arr.filter((item,index,array)=>item>2) //[3,4,5,6,7,8,9]

12,归并方法

ECMAscript为数组提供了两个并归方法：reduce和reduceRight().

这两个方法都会迭代数组的所有项，并在此基础上构架一个最终返回值。reduce方法从数组的第一项开始遍历到数组的最后一项，而reduceRight相反。

这两个方法都接收两个参数：对每项都会运行的并归函数，以及可选的以之为并归起点的初始值。传给并归函数（reduce和reduceRight()）接收4个参数：上一个并归值，当前项，当前项的索引和数组本身，这个函数的返回的任何值都会做为下一次调用同一个函数的第一个参数。如果没有给方法传入第二个参数，第一次迭代从数组的第二项开始，此时传入并归函数的第一个参数是数组的第一项，第二个参数是数组的第二项。

语法：数组.reduce(function(total, currentValue, currentIndex, arr), initialValue)

  {
            //reduce:累加
            let arr = [1, 2, 3, 4, 5]
 
            let sum = arr.reduce(function (val, item, index, arr) {
                return val + item
            }, 0)
            console.log(sum);
 
            let goods = [
                {
                    name: "手机",
                    num: 10,
                    price: 500,
                    ischecked: true
                },
                {
                    name: "电脑",
                    num: 20,
                    price: 600,
                    ischecked: false
                },
                {
                    name: "ipad",
                    num: 30,
                    price: 700,
                    ischecked: true
                },
            ]
 
 
            /*
            let num=goods.reduce(function(val,item){
                if(item.ischecked){
                    
                    return val+item.num
                }else{
                    return val
                }
            },0)
            console.log(num);*/
            let num = goods.reduce((val, item) => item.ischecked ? val + item.num : val, 0)
            let price = goods.reduce((val, item) => item.ischecked ? val + item.price * item.num : val, 0)
 
            /*
            let sum=0;
            arr.forEach(item=>{
                sum+=item
            })
            console.log(sum);*/
 
        }