数据常用方法总结
forEach遍历数组
let arr = [15, 26, 23, 10, 9, 6, 78, 21, 24, 10, 9];
arr.forEach((item, index) => {
console.log("值是" + item, "下标是" + index);
});
值是15 下标是0
值是26 下标是1
值是23 下标是2
值是10 下标是3
值是9 下标是4
值是6 下标是5
值是78 下标是6
值是21 下标是7
值是24 下标是8
值是10 下标是9
值是9 下标是10
filter过滤数组
// filter 过滤数组单元值 生成新数组 遍历筛选元素 把满足条件的元素筛选出来后放入新的数组
let arr = [15, 26, 23, 10, 9, 6, 78, 21, 24, 10, 9];
let newArr = arr.filter((item) => item > 30);
console.log(arr); // 15, 26, 23, 10, 9,6, 78, 21, 24, 10,9
console.log(newArr); //78
map迭代原数组
// map 迭代原数组 生成新数组遍历元素 把每项执行一遍回调函数 把结果放到一个新数组中返回例如求一个数的平方
let arr = [15, 26, 23, 10, 9, 6, 78, 21, 24, 10, 9];
let newArr = arr.map((item) => item - 10);
console.log(arr); //15, 26, 23, 10, 9, 6, 78, 21, 24, 10,9
console.log(newArr); //5, 16, 13, 0, -1,-4, 68, 11, 14, 0,-1
join数组单元素拼接成字符串
// join数组单元素拼接成字符串
let arr = [15, 26, 23, 10, 9, 6, 78, 21, 24, 10, 9];
let newArr = arr.join("");
let newArr2 = arr.join(",");
console.log(newArr); //1526231096782124109
console.log(newArr2); //15,26,23,10,9,6,78,21,24,10,9
concat 合并两个数组 生成一个新数组
// concat合并两个数组 生成一个新数组
let arr = [15, 26, 23, 10, 9, 6, 78, 21, 24, 10, 9];
let arr2 = ["zs", "ls", "wr", "ly"];
let newArr = arr.concat(arr2);
console.log(newArr);//15, 26, 23, 10, 9,6, 78, 21, 24, 10,9, 'zs', 'ls', 'wr', 'ly'
sort 数组排序
// sort 对原数组单元值排序 传入一个函数 计算a-b从小到大 b-a从大到小
let arr = [15, 26, 23, 10, 9, 6, 78, 21, 24, 10, 9];
let newArr = arr.sort(function (a, b) {
return a - b;
});
let newArr2 = arr.sort(function (a, b) {
return b - a;
});
console.log(newArr); //6, 9, 9, 10, 10,15, 21, 23, 24, 26, 78
console.log(newArr);// 78, 26, 24, 23, 21,15, 10, 10, 9, 9, 6
splice 删除或替换原数组单元
//万能方法,可以实现增删改:
//Array.splice(开始位置, 删除的个数,元素)
let arr = [1, 2, 3, 4, 5];
let arr1 = arr.splice(2, 0 'haha')
let arr2 = arr.splice(2, 3)
let arr1 = arr.splice(2, 1 'haha')
console.log(arr1) //[1, 2, 'haha', 3, 4, 5]新增一个元素
console.log(arr2) //[1, 2] 删除三个元素
console.log(arr3) //[1, 2, 'haha', 4, 5] 替换一个元素
indexOf 查找在数组中首次出现的位置
// indexOf在数组中查找首次出现的位置 找到返回索引值 找不到返回-1
let arr = [15, 26, 23, 10, 9, 6, 78, 21, 24, 10, 9];
let newArr = arr.indexOf(9);
console.log(newArr); //4
lastIndexOf 在数组中最后出现的位置
// lastIndexOf在数组中查找某个元素最后一次出现的位置 找到返回索引值 找不到返回-1
let arr = [15, 26, 23, 10, 9, 6, 78, 21, 24, 10, 9];
let newArr = arr.lastIndexOf(9);
let newArr1 = arr.lastIndexOf(100);
console.log(newArr); //10
console.log(newArr1); //-1
reverse反转数组
// reverse反转数组
let arr = [15, 26, 23, 10, 9, 6, 78, 21, 24, 10, 9];
let newArr = arr.reverse();
console.log(newArr); // 9, 10, 24, 21, 78, 6, 9, 10, 23, 26,15
from伪数组转为真数组
let array = {
0: 'name',
1: 'age',
2: 'sex',
3: ['user1','user2','user3'],
'length': 4
}
let arr = Array.from(array )
console.log(arr) // ['name','age','sex',['user1','user2','user3']]
let array = {
'name': 'name',
'age': 'age',
'sex': 'sex',
'user': ['user1','user2','user3'],
'length': 4
}
let arr = Array.from(array )
console.log(arr) // [ undefined, undefined, undefined, undefined ]
let str = 'hello world!';
console.log(Array.from(str)) // ["h", "e", "l", "l", "o", " ", "w", "o", "r", "l", "d", "!"]
find返回首次满足条件的元素
//find() 方法返回通过测试(函数内判断)的数组的第一个元素的值。
//如果没有符合条件的元素返回 undefined
//find() 对于空数组,函数是不会执行的。
//find() 并没有改变数组的原始值。
//array.find(function(currentValue, index, arr),thisValue),其中currentValue为当前项,index为当前索引,arr为当前数组
let test = [1, 2, 3, 4, 5];
let a = test.find(item => item > 3);
console.log(a); //4
let b = test.find(item => item == 0);
console.log(b); //undefined
findIndex返回首次满足条件的元素索引
//返回数组中首次满足条件的元素的索引值
//findIndex()与find()的使用方法相同,只是当条件为true时findIndex()返回的是索引值,而find()返回的是元素。如果没有符合条件元素时findIndex()返回的是-1,而find()返回的是undefined。findIndex()当中的回调函数也是接收三个参数,与find()相同。
const bookArr=[
{
id:1,
bookName:"三国演义"
},
{
id:2,
bookName:"水浒传"
},
{
id:3,
bookName:"红楼梦"
},
{
id:4,
bookName:"西游记"
}
];
var i=bookArr.findIndex((value)=>value.id==4);
console.log(i);// 3
var i2=bookArr.findIndex((value)=>value.id==100);
console.log(i2);// -1
some有一个满足条件返回true
//some方法会依次检测数组中每一个元素是否符合给定函数的条件,返回布尔值,不会对空数组处理,不改变原数组。在执行中,有一个满足就返回true,不再继续执行
var aa = [1,32,4,26];
var bb = aa.some(function(item){
return item > 30;
})
console.log(bb); // 输出为true
//some回调函数有三个参数,一个是当前元素(必须),一个是当前元素的索引index(可选),一个是当前元素属于的数组对象。
every满足所有返回true
//every方法会依次检测数组中每一个元素是否符合给定函数的条件,返回布尔值,不会对空数组处理,不改变原数组。所有元素都满足才返回true
var aa = [3,32,4,26];
var bb = aa.every(function(item){
return item > 2;
})
console.log(bb); // 输出为true
//every回调函数有三个参数,一个是当前元素(必须),一个是当前元素的索引index(可选),一个是当前元素属于的数组对象。
reduce方法每一个元素依次执行返回最终的值。
参数 |
描述 |
function(total,currentValue, index,arr) |
必需。用于执行每个数组元素的函数。 函数参数:参数描述total必需。初始值, 或者计算结束后的返回值。currentValue必需。当前元素currentIndex可选。当前元素的索引arr可选。当前元素所属的数组对象。 |
initialValue |
可选。传递给函数的初始值 |
//计算数组元素相加后的总和
//reduce方法会对数组中的每一个元素依次进行回调函数的方法,返回最终的值。
var aa = [3,2,4,1];
var bb = aa.reduce(function(total,item){
return total+item;
})
console.log(bb); // 输出为10
//reduce回调函数有四个参数,第一个是总和(必须),也是返回的值,第二个是当前元素(必须),第三个是当前元素的索引index(可选),一个是当前元素属于的数组对象。
push尾部追加
let arr = [15, 26, 23, 10, 9, 6, 78, 21, 24, 10, 9];
let newArr = arr.push("zs");
console.log(newArr); //12 返回新数组的长度 改变原数组
console.log(arr);//15, 26, 23, 10,9, 6, 78, 21,24, 10, 9, 'zs'
unshift头部追加
let arr = [15, 26, 23, 10, 9, 6, 78, 21, 24, 10, 9];
let newArr = arr.unshift("zs");
console.log(newArr); //12 返回新数组的长度 改变原数组
console.log(arr); //'zs',15, 26, 23, 10,9, 6, 78, 21,24, 10, 9
pop尾部删除
let arr = [15, 26, 23, 10, 9, 6, 78, 21, 24, 10, 9];
let newArr = arr.pop();
console.log(newArr); //9 返回删除的元素 改变原数组
console.log(arr); //15, 26, 23, 10,9, 6, 78, 21,24, 10
shift头部删除
let arr = [15, 26, 23, 10, 9, 6, 78, 21, 24, 10, 9];
let newArr = arr.shift();
console.log(newArr); //15 返回删除的元素 改变原数组
console.log(arr); // 26, 23, 10,9, 6, 78, 21,24, 10, 9
Array 对象方法