zoukankan      html  css  js  c++  java
  • js array对象函数

    主要是用来强化记忆的,详细写array.map()/array.reduce()/array.filter()方法

    1、array.map:返回一个新数组,数组中的元素是为原始数组元素调用函数处理后的值;

    map() 方法按照原始数组元素顺序依次处理元素。

    注意: map() 不会对空数组进行检测。

    注意: map() 不会改变原始数组。

    示例;

    let obj = [
    {name:'aaa',age:11},
    {name:'bbb',age:22},
    {name:'ccc',age:333}
    ]
    let newArr
    newArr = obj.map(function(item,index,arr){
       //匿名函数包含3个参数,item,key,arr--原数组
       console.log(item,index,arr)
       return item.age  
    })
    console.log(newArr)
    //输出
    {name: "aaa", age: 11} 0 (3) [{…}, {…}, {…}]
    {name: "bbb", age: 22} 1 (3) [{…}, {…}, {…}]
    {name: "ccc", age: 33} 2 (3) [{…}, {…}, {…}]
    
    [11, 22, 33]
    
    //使用es6方法去掉console.log()写法
    newArr = obj.map((item,index,arr)=>item.age)
    console.log(arr)
     

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

    reduce() 对于空数组是不会执行回调函数的。

    let obj2 = [{name:'aaa',age:11},{name:'bbb',age:22},{name:'ccc',age:33}]
          var sumAge
          sumAge = obj2.reduce(function(a,item,index,arr,e){
            console.log(a,item,index,arr,e)
            return a + item.age
          },0)
          //查看结果得知,reduce函数有两个参数,第一个参数接收一个匿名函数,函数中有4个参数,第一个参数是reduce函数的第二个参数(基数),其余的如参数含义,e为undefined,说明第五个参数没有作用
          console.log(sumAge)
    //使用es6 新写法
    sumAge = obj2.reduce( ( n, item, index, arr) => n + item.age, 0)
    console.log(sumAge) //66

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

    let obj2 = [{name:'aaa',age:11},{name:'bbb',age:22},{name:'ccc',age:33}]
    let newArr,arr2 = [{ age: 22 }, { age: 33}]
    newArr = obj2.filter(function(item,index,arr){
    console.log(item,index,arr,this)
    return item.age >= 22
    },arr2)
    console.log(newArr)
    let arr3 = obj2.filter(function(item,index,arr){
    for(let item2 of this){
    if(item2.age == item.age){
    return true
    }
    }
    },arr2)
    console.log(arr3)

    查看结果可以知道,filter函数接收两个参数,第一个参数是个函数,函数有三个参数,如函数所示,第二个参数可选,可从已经定义的属性中选择一个,在第一个函数中使用this来使用。

    4、concat() 连接两个或更多的数组,并返回结果。该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本。

    var hege = ["Cecilie", "Lone"];
    var stale = ["Emil", "Tobias", "Linus"];
    var kai = ["Robin"];
    var children = hege.concat(stale,kai);
    
    //Cecilie,Lone,Emil,Tobias,Linus,Robin

    5、copyWithin() 方法用于从数组的指定位置拷贝元素到数组的另一个指定位置中。(未细看,也没怎么见用过)

    var fruits = ["Banana", "Orange", "Apple", "Mango", "Kiwi", "Papaya"];
    var arr = fruits.copyWithin(2, 0, 2);
    console.log(arr)
    ["Banana", "Orange", "Banana", "Orange", "Kiwi", "Papaya"]

    6、entries() 方法返回一个数组的迭代对象,该对象包含数组的键值对 (key/value)。迭代对象中数组的索引值作为 key, 数组元素作为 value。

    var fruits = ["Banana", "Orange", "Apple", "Mango"];
    let arr = Object.entries(fruits)
    console.log(arr)
    arr = [
    ["0","Banana"],
    ["1","Orange"],
    ["2","Apple"],
    ["3","Mango"]
    ]

    7、every() 检测数值元素的每个元素是否都符合条件。

    var ages = [32, 33, 16, 40]
    var flag = ages.every((item,key,arr)=>{item > 15})
    console.log(flag)
    //flag为true。
    //注意,every可以传递一个额外的参数,放在函数后面
    //array.every(function(currentValue,index,arr), thisValue)
    //在函数的匿名函数中使用该参数请使用“this”,原理同filter函数

    8、fill() 使用一个固定值来填充数组。

    //语法:array.fill(value, start, end)
    参数
    value    必需。填充的值。
    start    可选。开始填充位置。
    end    可选。停止填充位置 (默认为 array.length)
    
    var fruits = ["Banana", "Orange", "Apple", "Mango"];
    fruits.fill("Runoob", 2, 4);
    console.log(fruits)
    //['Banana','Orange','Runoob','Runoob']
    没啥好讲的

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

    语法:array.find(function(currentValue, index, arr),thisValue),注意返回的是通过测试的数组的第一个元素的值就可以了

    10、findIndex() 返回符合传入测试(函数)条件的数组元素索引。

    语法:

    array.findIndex(function(currentValue, index, arr), thisValue)
    返回的是满足条件的第一个元素索引位置

    11、forEach() 数组每个元素都执行一次回调函数。

    12、form() 通过给定的对象中创建一个数组。

    13、includes() 判断一个数组是否包含一个指定的值。

    14、indexOf() 搜索数组中的元素,并返回它所在的位置。

    15、isArray() 判断对象是否为数组。

    16、join() 把数组的所有元素放入一个字符串。

    17、keys() 返回数组的可迭代对象,包含原始数组的键(key)。

    18、lastIndexOf() 搜索数组中的元素,并返回它最后出现的位置。

    19、pop() 删除数组的最后一个元素并返回删除的元素。

    20、push() 向数组的末尾添加一个或更多元素,并返回新的长度。

    21、reduceRight() 将数组元素计算为一个值(从右到左)。详从reduce方法

    22、reverse() 反转数组的元素顺序。

    23、shift() 删除并返回数组的第一个元素。

    24、slice() 选取数组的一部分,并返回一个新数组。

    25、some() 检测数组元素中是否有元素符合指定条件。

    26、sort() 对数组的元素进行排序。

    27、splice() 从数组中添加或删除元素。

    28、toString() 把数组转换为字符串,并返回结果。

    29、unshift() 向数组的开头添加一个或更多元素,并返回新的长度。

    30、valueOf() 返回数组对象的原始值。

  • 相关阅读:
    2019.1.8兔子问题和汉诺塔问题的解决代码
    REST
    存储过程和函数练习
    十六、性能优化
    十五、MySQl日志
    Shell入门
    十四、数据备份
    十三、MySQL触发器
    十二、视图
    十一、MySQL锁
  • 原文地址:https://www.cnblogs.com/dayin1/p/13825899.html
Copyright © 2011-2022 走看看