目录
1.删除添加数组元素
push
1.push可以给数组追加新的元素
2.push(参数直接写数组元素就可以了)
3.push完毕后,返回的结果是新数组的长度
4.原数组也会发生变化
var arr = [1,2,3]
console.log(arr.push(4,'pink'));
pop
1.pop是可以删除数组的最后一个元素 记住一次只能删除一个元素
2.pop()没有参数
3.pop完毕之后,返回的结果是删除的那个元素
4.原数组也会发生变化
console.log(arr.pop());
console.log(arr);
unshift
1.unshift是可以给数组前面追加新的元素
2.unshift()参数直接写 数组元素就可以了
3.unshift完毕之后,返回的结果是新数组的长度
4.原数组也会发生变化
console.log(arr.unshift(0));
console.log(arr);
shift
1.shift是可以删除数组的第一个元素 记住一次只能删除一个元素
2.shift()没有参数
3.shift完毕之后,返回的结果是删除的那个元素
4.原数组也会发生变化
console.log(arr.shift());
console.log(arr);
2.获取数组元素索引
- 返回数组元素索引号方法 indexOf(数组元素)作用就是返回该数组元素的索引号 从前面开始查找它只返回满足一个条件的索引号,它如果在该数组里面找不到元素,则返回的是-1
var arr = ['red','green','blue'];
console.log(arr.indexOf('pink'));//-1
- 返回数组元素索引号方法 lastIndexOf(数组元素)作用是返回该数组元素的索引号 从后面开始查找
var arr = ['red','green','blue','pink','blue'];
console.log(arr.lastIndexOf('blue'));//4
3.数组排序
1.翻转数组
var arr = [1,2,3,4,5,6,7];
arr.reverse();
console.log(arr);
2.数组排序
sort()是针对数组的一种数组排序的简介方法,默认为升序,但是可以传入参数使其变为降序
let arr = [1,3,5,2,4]
arr.sort()
console.log(arr) //[1,2,3,4,5]
<1>升序的顺序排列
var arr1 = [2,3,1,44,23,55];
arr1.sort(function(a,b) {
return a - b;
})
<2>降序的排列顺序
var arr2 = [2,3,1,44,23,55];
arr2.sort(function(a,b) {
return b - a;
})
console.log(arr2);
把旧数组里面不重复的元素选取出来放到新数组里面,重复的元素只保留一个,放到新数组中去重。
遍历旧数组,然后拿着旧数组元素去查询新数组,如果该元素在新数组里面没有出现过,我们就添加,否则不添加
需要利用新数组.indexOf(数组元素)如果返回时-1就说明新数组里面没有改元素
function unique(arr) {
var newArr = [];
for(var i = 0; i < arr.length;i++) {
if(newArr.indexOf(arr[i])===-1) {
newArr.push(arr[i]);
}
}
return newArr;
}
var demo = unique(['blue','pink','pink','black','blue']);
console.log(demo);
4.数组转换为字符串
toString()
console.log(str);
var arr = [1,2,3];
console.log(arr.toString());//输出结果1,2,3
join(分隔符)
var arr1 = ['green','blue','pink']
console.log(arr1);//['green', 'blue', 'pink']
console.log(arr1.join());//green,blue,pink
console.log(arr1.join('-'));//green-blue-pink
console.log(arr1.join('&'));//green&blue&pink
concat
const str1 = 'aa'
const str2 = str1.concat('bb')
console.log(str2) // aabb
slice
let arr = [1, 2, 3, 4, 5];
arr.slice(1, 3);//[2, 3]
splice
删除数组元素
let arr = [1, 2, 3, 4, 5]
arr.splice(1, 2)
// [2,3]
// 原数组改变为:[1, 4, 5]
删除并插入元素
let arr = [1, 2, 3, 4, 5]
arr.splice(1, 2, 3, 4, 5)
// 从下标为 1 的下标开始,依次向后删除 2 个元素,并将3,4,5 添加到倍删除的元素位置。
// 返回倍删除的数组:[2, 3], 原数组改变为:[1, 3, 4, 5, 4, 5]
只插入数组,不删除元素
let arr = [1, 2, 3, 4, 5]
arr.splice(1, 0, 3, 4, 5)
// 从下标为 1 的下标开始,不删除元素,并将3,4,5 添加到倍删除的元素位置。
// 返回倍删除的数组:[], 原数组改变为:[1, 3, 4, 5, 2, 3, 4, 5]
5.valueOf()返回数组的原始值
var arr = [1, 2, 3, 4];
var rel = arr.valueOf();
console.log(arr); // [1, 2, 3, 4]
console.log(rel); // [1, 2, 3, 4]
使用:获取日期的总毫秒数
var date = new Date();
console.log(date.valueOf());//就是我们现在的时间 距离1970.1.1总的毫秒数
6.数组遍历
forEach()
遍历数组,每次循环中执行传入的回调函数 。(注意: forEach() 对于空数组是不会执行回调函数的。) 没有返回值,或理解为返回值为undefined,不改变原数组。
参数: item:每次循环的当前元素, index:当前项的索引, array:原始数组;
数组中有几项,那么传递进去的匿名回调函数就需要执行几次;
var arr = [1,22,3,44,5,66];
var res = arr.forEach(function (item, index, array) {
console.log(item, index, array);
});
console.log(res);
使用:求和
var arr = [1,2,3,4,5,6];
var sum = 0;
arr.forEach(function (item) {
sum += item;
});
console.log(sum);
map
map:返回一个由原数组中的每个元素调用一个指定方法后的返回值组成的新数组,会分配内存空间存储新数组并返回
注:
(1)map()方法不会对空数组进行检测
(2)map()方法不会改变原始数组
使用:全场八折
const arr = [10, 20, 30, 120, 50]
const res = arr.map(item => item * 0.5)
console.log(res);
filter
filter()方法是对原数组进行过滤筛选,产生一个新的数组对象
注:
(1)filter()不会对空数组进行检测(如果对空数组进行筛选,返回值位undefined)
(2)filter()不会改变原始数组
(3)返回数组,包含了符合条件的所有元素。如果没有符合条件的元素则返回空数组
let arr = [1, 2, 3, 4, 5];
let res = arr.filter((item, index, arr) => {
return item % 2 === 0;
});
console.log(res);// 2,4
// 第一个参数为:当前正在遍历的元素
// 第二个参数为:当前元素索引
// 第三个参数为:原数组本身
7.确认数组元素是否满足某种条件
some
遍历数组,查找数组当中是否有元素满足条件,如果有至少一个元素满足条件,则返回true,否则返回false。
let arr = [1, 2, 3, 4, 5];
let res = arr.some(function (item, index, arr) {
return item > 6; // false
});
console.log(res);
res = arr.some(function (item) {
return item > 1; // true
});
console.log(res);
// 第一个参数为:当前正在遍历的元素(一般只用这个参数就可以了。)
// 第二个参数为:当前元素索引
// 第三个参数为:原数组本身
every
遍历数组,如果数组的每个元素都满足条件,则返回true,否则返回false。
let arr = [1, 2, 3, 4, 5];
let res = arr.every(function (item, index, arr) {
return item > 0; // true
});
res = arr.every(function (item) {
return item > 4; // flase
});
// 第一个参数为:当前正在遍历的元素(一般只用这个参数就可以了。)
// 第二个参数为:当前元素索引
// 第三个参数为:原数组本身
8..reduce
遍历数组, 每次循环时执行传入的回调函数,回调函数会返回一个值,将该值作为初始值prev,传入到下一次函数中, 返回最终操作的结果;
var arr = [2, 3, 4, 5];
var sum = arr.reduce(function (prev, item, index, array) {
console.log(prev, item, index, array);
return prev + item;
});
console.log(arr, sum);
// prev 初始值(类似求和是 sum = 0) 可以设置初始值(参数),
//如果不设置初始值默认是数组中的第一个元素, 遍历时从第二个元素开始遍历
// item 每次循环的当前元素
// index 每次循环的当前下标
// array 原数组
可以看出当没有设置初始值的时候,prev取值是arr[0](即数组下标为0的数值默认成初始值)
var arr = [2, 3, 4, 5];
var sum = arr.reduce(function (prev, item, index, array) {
console.log(prev, item, index, array);
return prev + item;
},10);
console.log(arr, sum);
可以看出当设置初始值的时候,从数组下标为0的开始遍历。
使用:
1、累加和累乘
let arr = [1,3,5,7,9];
let sum = arr.reduce((a,b)=> a+b)
let num = arr.reduce((a,b) => a*b)
console.log(sum) // 21
console.log(num) // 504
2.数组去重
let arr = [1,1,22,34,55,34];
let newArr = arr.reduce((a,b) => {
if (!a.includes(b)) {
return a.concat(b)
} else {
return a
}
}, []);
console.log(newArr, '数组去重') // [1, 3, 2, 5, 7, 8]
9.ES7新特性includes
const mingzhu = ['西游记','水浒传','三国演义','红楼梦'];
// 判断
console.log(mingzhu.includes('西游记'));//true
console.log(mingzhu.includes('呐喊'));//false
10.find
遍历数组 每次循环 执行回调函数,回调函数接受一个条件 返回满足条件的第一个元素,不存在则返回undefined
var list = [55, 66, 77, 88, 99, 100];
var res = list.find(function (item, index, array) {
return item > 60;
});
console.log(res); //66
// item: 必须, 循环当前元素
// index: 可选, 循环当前下标
// array: 可选, 当前元素所属的数组对象
11.fill();
用给定值填充一个数组
var arr = [1, 2, 3];
var arr1 = arr.fill('4',2);
console.log(arr1);
// value 必需。填充的值。
// start 可选。开始填充位置。
// end 可选。停止填充位置(默认为 array.length)
12.数组方法扩展flat和flatMap
flat(参数)
将多维数组转化为低位数组,参数为深度 是一个数字
// 将多维数组转化为低位数组
const arr = [1,2,3,4,[5,6,[7,8,9]]];
// 参数为深度 是一个数字
console.log(arr.flat(1));
console.log(arr.flat(2));
flatMap
flat()和map()的组合版 , 先通过map()返回一个新数组,再将数组拉平( 只能拉平一次 )
const arr = [1,2,3,4]
const result = arr.flatMap(item => [item * 10]);
// 可以使用flatMap将结果变为一维
console.log(result);