js 数组常用方法

栏目: JavaScript · 发布时间: 5年前

内容简介:日常开发中,如果熟悉一般的数组处理方法,效率常能事半功倍,有更多时间学习其他技术,形成正向循环。这里总结常用的js数组处理方法。当数组中的元素在测试条件时返回 true 时, find() 返回符合条件的元素,之后的值不会再调用执行函数。如果没有符合条件的元素返回 undefined

日常开发中,如果熟悉一般的数组处理方法,效率常能事半功倍,有更多时间学习其他技术,形成正向循环。

这里总结常用的js数组处理方法。

遍历查找

Array.filter() 过滤

  • 返回新数组,不改变原数组
  • 不检查空数组
let holidays = [1, 3, 5, 7];
getSmaller = (item) => {
    return item < 3
} 
ages.filter(getSmaller)
// [32, 12]

Array.every()

  • 返回 boolean
  • every() 方法用于检测数组所有元素是否都符合指定条件
  • every() 方法使用指定函数检测数组中的所有元素
  • every() 不会改变原始数组。
let holidays = [1, 3, 5, 7];
biggerThan3 = (item) => {
    return item > 3
} 
holidays.every(biggerThan3)
// false

Array.find()

const peoples = [
    {
        name: 'jane',
        age: 23
    },
    {
        name: 'dannel',
        age: 43
    },
    {
        name: 'bruce',
        age: 56
    }
];

findJane = (item) => {
    return item.name === 'jane'
}

const Jane = peoples.find(findJane)
// {name: "jane", age: 23}
  • find() 方法返回通过测试(函数内判断)的数组的第一个元素的值。
  • find() 方法为数组中的每个元素都调用一次函数执行:

当数组中的元素在测试条件时返回 true 时, find() 返回符合条件的元素,之后的值不会再调用执行函数。如果没有符合条件的元素返回 undefined

  • 注意: find() 对于空数组,函数是不会执行的。
  • 注意: find() 并没有改变数组的原始值。

求和排序

Array.reduce() 求和

  • reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。
const numbers = [1, 2, 3, 4, 5, 6];
getSum = (total, curValue) => total + curValue
const sum = numbers.reduce(getSum)
// 21

Array.reduceRight()

与reduce() 类似

const sum = [0, 1, 2, 3].reduceRight((a, b) => a + b);
// sum is 6

var flattened = [[0, 1], [2, 3], [4, 5]].reduceRight(function(a, b) {
    return a.concat(b);
});
// flattened is [4, 5, 2, 3, 0, 1]

reduce与reduceRight区别

var a = ['1', '2', '3', '4', '5']; 
var left  = a.reduce(function(prev, cur)      { return prev + cur; }); 
var right = a.reduceRight(function(prev, cur) { return prev + cur; }); 

console.log(left);  // "12345"
console.log(right); // "54321"

Array.sort()

Array.sort()会将数组的数值转化成字符串,然后根据UTF-16 code 比较大小

var months = ['March', 'Jan', 'Feb', 'Dec'];
months.sort();
console.log(months);
// ["Dec", "Feb", "Jan", "March"]

var array1 = [1, 30, 4, 21, 100000];
array1.sort();
console.log(array1);
// [1, 100000, 21, 30, 4]

判断

includes() 判断存在

  • includes() 方法用来判断一个数组是否包含一个指定的值,如果是返回 true,否则false
[1, 2, 3].includes(2);     // true
[1, 2, 3].includes(4);     // false
[1, 2, 3].includes(3, 3);  // false
[1, 2, 3].includes(3, -1); // true

参考:

1、 mdn

2、 菜鸟教程


以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

大数据之路

大数据之路

阿里巴巴数据技术及产品部 / 电子工业出版社 / 2017-7-1 / CNY 79.00

在阿里巴巴集团内,数据人员面临的现实情况是:集团数据存储已经达到EB级别,部分单张表每天的数据记录数高达几千亿条;在2016年“双11购物狂欢节”的24小时中,支付金额达到了1207亿元人民币,支付峰值高达12万笔/秒,下单峰值达17.5万笔/秒,媒体直播大屏处理的总数据量高达百亿级别且所有数据都需要做到实时、准确地对外披露……巨大的信息量给数据采集、存储和计算都带来了极大的挑战。 《大数据......一起来看看 《大数据之路》 这本书的介绍吧!

正则表达式在线测试
正则表达式在线测试

正则表达式在线测试

RGB CMYK 转换工具
RGB CMYK 转换工具

RGB CMYK 互转工具

HEX HSV 转换工具
HEX HSV 转换工具

HEX HSV 互换工具