数组的常用方法

265 阅读4分钟

数组的声明

let arr=new Array(num);//num是数组长度
let arr=[];

splice

splice用于删除和添加元素,返回值是删掉的元素组成的数组.

let arr = ["i", "want", "be", "superman"];
let a=arr.splice(2,2,'you');//第一个参数是从第几位开始,参数二是删除几个元素,参数3...是插入的元素
console.log(a);//[ 'be', 'superman' ]
console.log(arr);//[ 'i', 'want', 'you' ]

splice允许负向,就是从后往前

slice

slice比splice的使用要简单(少一个'p') slice直接返回一个新的数组,它截取的新数组,允许负向索引

let arr = ["i", "want", "be", "superman"];
let a=arr.slice(2,3);//截取【第几位到第几位)
let b=arr.slice(-3);//从最后一位到第几个

console.log(a);// [ 'be' ]
console.log(b);//[ 'want', 'be', 'superman' ]
console.log(arr);//[ 'i', 'want', 'be', 'superman' ]
    

concat

创建一个新数组,其中包含来自于其他数组和其他项的值。

let arr1 = ["i", "want", "be", "superman"];
let arr2=['ka','zz'];
let result=arr1.concat(arr2,'参数本身');
console.log(result);//[ 'i', 'want', 'be', 'superman', 'ka', 'zz', '参数本身' ]
console.log(arr1);//[ 'i', 'want', 'be', 'superman' ]

let arr = [1, 2];
alert( arr.concat([3, 4]) ); // 1,2,3,4
alert( arr.concat([3, 4], [5, 6]) ); // 1,2,3,4,5,6
alert( arr.concat([3, 4], 5, 6) ); // 1,2,3,4,5,6

arr1调用concat,在它后面添加arr2和‘参数本身’,返回新的数组,不改变arr1

forEach

遍历数组,对每个元素使用function,不返回任何内容 语法:

arr.forEach(function(item, index, array) {
// ... do something with item
});
let arr1 = ["i", "want", "be", "superman"];
arr1.forEach((i,index,arr)=>
console.log("i:"+i+" index:"+index+' arr:'+arr)
)
控制台:
i:i index:0 arr:i,want,be,superman
i:want index:1 arr:i,want,be,superman
i:be index:2 arr:i,want,be,superman
i:superman index:3 arr:i,want,be,superman

indexOf includes

arr.indexOf(item, from) 从索引 from 开始搜索 item,如果找到则返回索引,否则返回 -1 arr.includes(item, from) —— 从索引 from 开始搜索 item,如果找到则返回 true(译注:如果没找到,则返回 false`)。

let arr = [1, 0, false];
alert( arr.indexOf(0) ); // 1
alert( arr.indexOf(null) ); // -1
alert( arr.includes(1) ); // true

find

寻找特定条件的元素,find 方法搜索的是使函数返回 true 的第一个(单个)元素。

如果它返回 true,则搜索停止,并返回 item。如果没有搜索到,则返回 undefined

语法:

let result = arr.find(function(item, index, array) {
// 如果返回 true,则返回 item 并停止迭代
// 对于假值(falsy)的情况,则返回 undefined
});
let users = [
  { id: 1, name: "John" },
  { id: 2, name: "Pete" },
  { id: 3, name: "Mary" },
];
let user = users.find((item, index) => item.id > 1);
console.log(user);//{ id: 2, name: 'Pete' }

filter

find 方法搜索的是使函数返回 true 的第一个(单个)元素。filter 返回的是所有匹配元素组成的数组:

let users = [
  { id: 1, name: "John" },
  { id: 2, name: "Pete" },
  { id: 3, name: "Mary" },
];
let user = users.filter((item, index) => item.id > 1);
console.log(user);//[ { id: 2, name: 'Pete' }, { id: 3, name: 'Mary' } ]

map

它对数组的每个元素都调用函数,并返回结果数组

let result = arr.map(function(item, index, array) {
// 返回新值而不是当前元素
})

sort(fn)

原位排序,fn是比较函数,需要自己写,如果不写就按字符串进行排序。 实际上,比较函数只需要返回一个正数表示“大于”,一个负数表示“小于”。

let arr = [ 1, 2, 15 ];\
arr.sort(function(a, b) { return a - b; });//或 arr.sort( (a, b) => a - b );
alert(arr); // *1, 2, 15*

字符串比较的时候用str.localeCompare

arr.sort( (a, b) => a.localeCompare(b) )

reverse

颠倒数组元素的顺序

split join

按照要求 split把字符串分割成数组 join把数组合起来

let names = "Bilbo, Gandalf, Nazgul";
let str = "test";
let arr = names.split(",");
let trr = str.split("");
let nrr=arr.join('!')
console.log(arr);//[ 'Bilbo', ' Gandalf', ' Nazgul' ]
console.log(trr);//[ 't', 'e', 's', 't' ]
console.log(nrr)//Bilbo! Gandalf! Nazgul

reduce

当我们需要遍历一个数组时 —— 我们可以使用 forEachfor 或 for..of。 当我们需要遍历并返回每个元素的数据时 —— 我们可以使用 map 累加的时候用reduce

let arr = [1, 2, 3, 4, 5, 6, 7];
let result = arr.reduce((sum, current) => sum + current);
console.log(result);

some

与 map 类似,对数组的每个元素调用函数 fn。如果任何/所有结果为 true,则返回 true,否则返回 false

function isBiggerThan10(i, index, array) {
  return i > 10;
}

console.log([2, 5, 8, 1, 4].some(isBiggerThan10)); // false
console.log([12, 5, 8, 1, 4].some(isBiggerThan10)); // true

flat(深度)

数组扁平化 语法:

var newArray = arr.flat([depth])//深度
const arr1 = [0, 1, 2, [3, 4]];

console.log(arr1.flat());
// expected output: [0, 1, 2, 3, 4]

const arr2 = [0, 1, 2, [[[3, 4]]]];

console.log(arr2.flat(2));
// expected output: [0, 1, 2, [3, 4]]

Array.from

有一个全局方法 Array.from 可以接受一个可迭代或类数组的值,并从中获取一个“真正的”数组。然后我们就可以对其调用数组方法了。 语法:


Array.from(arrayLike[, mapFn[, thisArg]])//
//arrayLike :想转换成数组的东西 第二个参数是 如果新建成一个数组,每个元素执行的方法