Js数组常用方法整理

更新日期: 2019-12-03阅读: 1.7k标签: 数组

想了解数组有哪些原生方法,控制台输出,如图:



length:数组的实例属性,返回或设置一个数组中的元素个数。

toString():可以把数组转换成字符串,并返回结果。

toLocaleString():返回数组中每个元素的本地化表示形式。

let a = [1234,'hello',21];
a.length; //3
a.toString();  //'1234','hello','21'
a.toLocaleString();  //'1,234','hello','21'


join([seperator]):返回一个字符串,由每个元素转换而成的字符串使用指定的seperator拼接而成。

let a = [1234,'hello',21];
a.join('-'); //'1234-hello-21'

 

concat():拼接两个或更多的数组,并返回结果。此方法不会更改现有数组,而是返回一个新数组。每个参数可以是一个值,也可以是一个数组,可以接收任意多个参数。可用作拷贝数组。

let a = [1234,'hello',21];
let b = a.concat(50,60,[1,2,3]); //[1234, "hello", 21, 50, 60, 1, 2, 3]

 

reverse():颠倒数组中元素的顺序,现有数组内容会改变。

let a = [1234,'hello',21];
let b = a.reverse();
a; //[21, "hello", 1234]
b; //[21, "hello", 1234]

 

sort():讲数组元素按Unicode码进行重新排序。

let a = [1234,'hello',21,'bar',6,789];
a.sort();
a; //[1234, 21, 6, 789, "bar", "hello"]

 

slice(start, [end]) : 返回现有数组的一个子数组,从下标为start的位置开始取,到下标为end的为止(获取内容不包括end),若参数为负数,则表示从尾部开始算起,end参数可以省略。可用作拷贝数组。

let a = [1234,'hello',21,'bar',6,789];
let b = a.slice(1,4); //["hello", 21, "bar"]
let c = a.slice(2); //[21, "bar", 6, 789]
let d = a.slice(-4,-2); //[21, "bar"]
a; //[1234, "hello", 21, "bar", 6, 789]

 

splice(start,count,e1,e2,...en):从数组中删除一部分元素,并添加另一部分元素,start为指定添加/删除的起始位置,可取负值,count为要删除的个数,0表示不删除,e1,e2表示在start新添加的项,返回会删除的项目,现有数组会改变。

let a = [10,20,30,40,50];
let b = a.splice(2,2,110);
b; //[30,40]
a; //[10,20,110,50,]
let c = a.splice(2,0,[70,80,90]);
c; //[]
a; //[10,20,[70,80,90],110,50]

 

push():将一个或多个元素添加到数组的末尾,并返回该数组的新长度。

unshift():将一个或多个元素添加到数组的开头,并返回该数组的新长度。

pop():从数组中删除最后一个元素,并返回该元素的值。此方法更改数组的长度。

shift():从数组中删除第一个元素,并返回该元素的值。此方法更改数组的长度。

let a = [10,20,30,40,50];
let a1 = a.push(60);
a1; //6
a; //[10,20,30,40,50,60]

let b = [10,20,30,40,50];
let b1 = b.unshift(60);
b1; //6
b; //[60,10,20,30,40,50]

let c = [10,20,30,40,50];
let c1 = c.pop();
c1; //50
c; //[10,20,30,40]

let d = [10,20,30,40,50];
let d1 = d.shift();
d1; //10
d; //[20,30,40,50]


includes():用来判断一个数组是否包含一个指定的值,根据情况,如果包含则返回 true,否则返回false。

let array1 = [1, 2, 3];
array1.includes(2); //true


indexOf(value, [fromIndex]):返回在数组中可以找到一个给定元素的第一个索引,如果不存在,则返回-1。fromIndex为可选,指定从该下标处开始进行查找。

lastIndexOf(value, [fromIndex]):返回指定元素在数组中的最后一个的索引,如果不存在则返回 -1。从数组的后面向前查找,从 fromIndex 处开始。

let beasts = ['ant', 'bison', 'camel', 'duck', 'bison'];
beasts.indexOf('bison'); //1
beasts.indexOf('bison', 2); //4
beasts.indexOf('giraffe'); //-1

beasts.lastIndexOf('bison'); //4
beasts.lastIndexOf('bison', 2); //1
beasts.lastIndexOf('giraffe'); //-1


find():返回数组中满足提供的测试函数的第一个元素的值。否则返回undefined。

findIndex():返回数组中满足提供的测试函数的第一个元素的索引。否则返回-1。

let array1 = [5, 12, 8, 130, 44];
let val = array1.find(element => element > 10);
let index = array1.findIndex(element => element > 10);
val; //12
index; //1

 

forEach():对数组的每个元素执行一次提供的函数。

filter():创建一个新数组, 其包含通过所提供函数实现的测试的所有元素。

map():创建一个新数组,其结果是该数组中的每个元素都调用一个提供的函数后返回的结果。

reduce(reducer[,initialValue]):对数组中的每个元素执行一个由您提供的reducer函数(升序执行),将其结果汇总为单个返回值。reducer 函数接收4个参数:Accumulator (acc) (累计器)、Current Value (cur) (当前值)、Current Index (idx) (当前索引)、Source Array (src) (源数组)。initialValue作为第一次调用 callback函数时的第一个参数的值。如果没有提供初始值,则将使用数组中的第一个元素。

accumulator为累加器,currentValue为当前值,index为当前索引,array为源数组。

every():测试一个数组内的所有元素是否都能通过某个指定函数的测试。它返回一个布尔值。

some():测试数组中是不是至少有1个元素通过了被提供的函数测试。它返回的是一个Boolean类型的值。

let array1 = ['a', 'b', 'c'];
array1.forEach(element => console.log(element)); //'a'\n 'b'\n 'c' 
array1; //['a', 'b', 'c']

let words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present'];
let result = words.filter(word => word.length > 6);
result; //["exuberant", "destruction", "present"]
words; //["spray", "limit", "elite", "exuberant", "destruction", "present"]

let array2 = [1, 4, 9, 16];
let map1 = array2.map(x => x * 2);
map1; //[2, 8, 18, 32]
array2; //[1, 4, 9, 16]

let array3 = [1, 2, 3, 4];
let reducer = (accumulator, currentValue) => accumulator + currentValue;
array3.reduce(reducer); //10
array3.reduce(reducer, 5); //15
array3; //1, 2, 3, 4]

let isBelowThreshold = (currentValue) => currentValue < 40;
let array4 = [1, 30, 39, 29, 10, 13];
let array5 = [1, 30, 39, 291, 10, 13];
array4.every(isBelowThreshold); // true
array5.every(isBelowThreshold); // false

let array = [1, 2, 3, 4, 5];
let even = (element) => element % 2 === 0;
array.some(even); // true


flat([depth]):会按照一个可指定的深度递归遍历数组,并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。depth指定要提取嵌套数组的结构深度,默认值为 1。可用作扁平化嵌套数组。

let arr1 = [1, 2, [3, 4],[5,[6,[7]]]];
let b = arr1.flat(); 
let c = arr1.flat(2); 
let d = arr1.flat(Infinity); 
arr1; // [1, 2, [3, 4],[5,[6,[7]]]]
b; // [1, 2, [3, 4],[5,[6,[7]]]]
c; //[1,2,3,4,5,[6,[7]]]
d; //[1,2,3,4,5,6,7]


Array.from():从一个类似数组或可迭代对象创建一个新的,浅拷贝的数组实例。

Array.of():用于将一组值,转换为数组。

let arrayLike = {
    '0': 'a',
    '1': 'b',
    '2': 'c',
    length: 3
};
let arr2 = Array.from(arrayLike); // ['a', 'b', 'c']

Array.of(3, 11, 8) // [3,11,8]
Array.of(3) // [3]
Array.of(3).length // 1


Array.isArray():确定传递的值是否是一个array。

Array.isArray([1, 2, 3]);  // true
Array.isArray({foo: 123}); // false
Array.isArray("foobar");   // false
Array.isArray(undefined);  // false

原文:https://www.cnblogs.com/ronaldo9ph/p/12132936.html

链接: https://www.fly63.com/article/detial/7156

探索JavaScript数组奥秘

avaScript数组同后端语言一样,具有它自己的数据结构,归根结底,这种数据结构,本质就是一种集合。在后端语言中(如java,.net等),数组是这样定义的:数组是用来存储相同数据类型的集合

js使用数组+循环+条件实现数字转换为汉字的简单方法。

单个数字转汉字的解决方法:利用数组存储0-9的汉字、 ary.length和str.length不用多说,这是指ary数组和str字符串的长度。这里我们需要注意的是str.charAt(j)和ary[i],分别指在str这个字符串中索引为j的元素,在ary中索引为i的元素。

[译]async-await 数组循环的几个坑

在 Javascript 循环中使用 async/ await 循环遍历数组似乎很简单,但是在将两者结合使用时需要注意一些非直观的行为。让我们看看三个不同的例子,看看你应该注意什么,以及哪个循环最适合特定用例。

数组、字符串去重

今天说的数组和字符串去重呢,主要用到es6新的数据结构 Set,它类似于数组,但是成员的值都是唯一的,没有重复的值,所以活用Set来进行数组和字符串的去重。

JavaScript 数组方法

数组方法:1、Array.join([param]) 方法:将数组中所有的元素都转换为字符串并连接起来,通过字符 param 连接,默认使用逗号,返回最后生成的字符串2、Array.reverse() 方法:将数组中的元素颠倒顺序(在原数组中重新排列它们),返回逆序数组

如何删除JavaScript 数组中的虚值

falsy(虚值)是在 Boolean 上下文中已认定可转换为‘假‘的值.JavaScript 在需要用到布尔类型值的上下文中使用强制类型转换(Type Conversion )将值转换为布尔值,比如:在条件语句或者循环语句中。

JavaScript中十种一步拷贝数组的方法

JavaScript中我们经常会遇到拷贝数组的场景,但是都有哪些方式能够来实现呢,我们不妨来梳理一下。扩展运算符(浅拷贝)自从ES6出现以来,这已经成为最流行的方法。

JS数组的几个经典api

本文主要来讲数组api的一些操作,如简单实现扁平化n维数组、数组去重、求数组最大值、数组求和、排序、对象和数组的转化等。扁平化嵌套数组/展平和阵列孔——flat()

关于Vue不能监听(watch)数组变化

vue无法监听数组变化的情况,但是数组在下面两种情况下无法监听:利用索引直接设置数组项时,例如arr[indexofitem]=newValue;修改数组的长度时,例如arr.length=newLength

JS计算两个数组的交集、差集、并集、补集(多种实现方式)

使用 ES5 语法来实现虽然会麻烦些,但兼容性最好,不用考虑浏览器 JavaScript 版本,使用 ES5 语法来实现虽然会麻烦些,但兼容性最好,不用考虑浏览器 JavaScript 版本。也不用引入其他第三方库。

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!