1.set一行代码实现数组去重
const removeRepeatElement = [...new Set([3, 4, 5, 5, 5, 6, 5, 6, 7, 4, 3, 5, 8])]
console.log(removeRepeatElement) //[3,4,5,6,7,8]
2.随机生成数组下标,并返回在数组中对应的值
const arr=[1,2,3,4,5,6,7,8,9,10,11]
const num = Math.floor(Math.random() * arr.length)//随机生成数组下标
console.log(num);
console.log(arr[num]);
3.array.map():遍历每一个元素,并对每一个元素做对应的处理,返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值.
/**
* @description: 数组map遍历
* @param {Function}:回调函数 (元素,下标)=>{ return 新元素 }
* @return: 返回一个新数组
*/
//需求:数组中每一个元素*2
let arr = [23, 31, 60, 88, 90, 108, 260];
let arr1 = arr.map((value) => {
return value * 2;//让每一个元素的值 * 2
});
console.log(arr1); //[46, 62, 120, 176, 180, 216, 520] map的返回值是一个新数组
console.log(arr); //[23, 31, 60, 88, 90, 108, 260] 可见原数组arr未发生改变
//(3)需求3: 超过100的商品打八折
let arr2 = arr.map((value, index) => {
if(value > 100){
return value*0.8;
}else{
return value;
}
});
console.log(arr2); // [23, 31, 60, 88, 90, 86.4, 208]
注意点:
(1) 回调函数执行次数 == 数组长度
* 数组中有多少个元素,回调函数就会执行几次
(2)map函数返回的新数组长度 == 原数组长度
(3)回调函数中一定要return,返回的是当前遍历的元素值
* 如果不return,新数组中每一个元素都变成了undefined
(4)不会改变原始数组
(5)不会对空数组进行检测
4.array.push(元素): 将 一个或多个元素,添加到数组 末尾,返回值是新数组的长度,同时原始数组会发生改变
const arr = [10, 20, 30, 40, 50]
const res = arr.push(60, 70)
console.log(arr) //[10, 20, 30, 40, 50, 60, 70] 原数组发生了改变
console.log(res) //7,返回新数组的长度
5.array.unshift():向数组的开头添加一个或多个元素,并返回新的长度,同时原数组会发生改变
const arr = [10, 20, 30, 40, 50]
res = arr.unshift(1, 2)
console.log(arr) // [1, 2, 10, 20, 30, 40, 50]
console.log(res) // 7 返回新数组的长度
6.array.pop():删除数组最后一个元素,返回最后一个元素,原数组发生改变
let arr = [10, 20, 30, 40, 50]
let res = arr.pop()
console.log(arr); //[10, 20, 30, 40] 原数组发生改变
console.log(res); //50 返回最后一个元素值
7.array.shift():删除数组第一个元素,返回第一个元素,原数组发生改变
let arr = [10, 20, 30, 40, 50]
let res = arr.shift()
console.log(arr); //[20, 30, 40, 50] 原数组发生改变
console.log(res); //10 返回第一个元素
8.array.splice():从数组中第几个下标开始增加或删除元素,并返回删除的元素,原数组发生改变
场景一:删除元素,返回被删除的元素
const arr = [10, 20, 20, 50, 30, 30, 20]
//array.splice()应用一:指定位置删除数组
const res = arr.splice(3, 2) //从下标3开始删除2个元素
console.log(arr); //[10, 20, 20, 30, 20] 原数组发生改变
console.log(res); //[50, 30] 返回被删除的数组
场景二:增加元素,返回空数组
const arr = [10, 20, 20, 50, 30, 30, 20]
//array.splice()应用一:指定位置删除数组
const res = arr.splice(3, 0, 15, 25, 35) //从下标3开始删除0个元素,并在第3个下标新增三个元素15,25,35
console.log(arr); //[10, 20, 20, 15, 25, 35, 50, 30, 30, 20] 原数组发生改变
console.log(res); //[] 删除0个元素,所以返回空数组
9.array.slice():返回数组中被选中的元素,从给定的 start 参数开始,到给定的 end 参数处结束,[start,end)左闭右开,常用于选中数组中连续的几个元素,原数组不发生变化.
<script>
const arr = [10, 20, 20, 50, 30, 30, 20]
const res1 = arr.slice(1) //选中下标1到末尾的元素
const res2 = arr.slice(3) //选中下标3到末尾的元素
const res3 = arr.slice(2,5) //左闭右开,选择第2个(含)到第5个元素(不含)
console.log(arr); //[10, 20, 20, 50, 30, 30, 20] 原数组不发生改变
console.log(res1); //[20, 20, 50, 30, 30, 20]
console.log(res2); //[50, 30, 30, 20]
console.log(res3); //[20, 50, 30]
</script>
10,array.join():返回由数组元素构成的字符串,元素将由指定的分隔符分隔,默认分隔符是逗号 (,),此方法不会改变原数组
const arr = [10, 20, 20, 50, 30, 30, 20]
const res = arr.join() //元素默认由逗号分隔
const res1 = arr.join("-") //元素间由-分隔
console.log(arr); //[10, 20, 20, 50, 30, 30, 20]
console.log(res); //10,20,20,50,30,30,20
console.log(res1); //10-20-20-50-30-30-20
11.array.filter():返回一个由所有符合特定条件的元素组成的新数组,不会改变原始数组。
const arr = [10, 20, 15, 24, 30, 30, 20]
const res = arr.filter(item=>item%6===0) //筛选能够被6整除的元素,返回一个新数组
console.log(arr); //[10, 20, 15, 24, 30, 30, 20] //未改变原数组
console.log(res); //[24, 30, 30]
12.array.reduce返回一个数值,可实现数组求和,平均值,计数,最大值,最小值,偶数和等统计性问题,功能非常强大,具体用法可以查看笔者之前的博客,链接如下:巧用js数组方法reduce,一个方法实现数组求和,平均值,计数,最大值,最小值,偶数和等常见统计问题
13.find()返回满足条件的数组中第一个元素的值,如果不存在则返回undefined,不改变原数组
<script>
const arr = [10, 20, 20, 50, 30, 30, 20]
const res = arr.find(item => item > 25);
const res1 = arr.find(item => item == 25);
console.log(arr); //[10, 20, 20, 50, 30, 30, 20]
console.log(res); //50
console.log(res1); //undefined
</script>
14.findindex():返回满足条件的数组中第一个元素的索引。否则返回 -1,不改变原数组
<script>
const arr = [10, 20, 20, 50, 30, 30, 20]
const res = arr.findIndex(item => item > 25);
const res1 = arr.findIndex(item => item == 25);
console.log(arr); //[10, 20, 20, 50, 30, 30, 20]
console.log(res); //3
console.log(res1); //-1
</script>
15.indexof():返回数组中找到给定元素的第一个下标,如果不存在,则返回 -1
<script>
const arr = [10, 20, 20, 50, 30, 30, 20]
const res = arr.indexOf(50);
const res1 = arr.indexOf(25);
console.log(arr); //[10, 20, 20, 50, 30, 30, 20]
console.log(res); //3
console.log(res1); //-1
</script>
16.forEach():无返回值,用于遍历数组,相当于for循环的高级写法;
<script>
const arr = [3, 6, 5, 7, 8, 9, 4]
const res = arr.forEach(item => {
if (item % 3 == 0) {
console.log(item); //3 6 9
}
})
console.log(res); //undefined
</script>
17.array.every():检测数组元素的每个元素是否都符合条件,如果数组中检测到有一个元素不满足,则整个表达式返回 false ,且剩余的元素不会再进行检测;如果所有元素都满足条件,则返回 true。不会改变原始数组。
const arr = [1, 2, 3, 4, 5];
arr.every((item) => item === 3); // false
const arr1 = [2, 4, 6, 8, 10];
arr1.every((item) => item%2 === 0); // true
18.array.some():检测数组元素中是否有元素符合指定条件
let arr = [20, 61, 80, 95, 100]
let res = arr.some((item, index) => {
if( item < 0 ){
return true
}
})
console.log(res) //false
19.array.reverse():反转数组的元素顺序,会改变原数组;
const arr = [1, 2, 3, 4, 5];
arr.reverse() // [5, 4, 3, 2, 1]
arr // [5, 4, 3, 2, 1]
20.array.sort():对数组的元素进行排序
const array = [4, 1, 3, 2, 10];
array.sort((a, b) => a - b); // [1, 2, 3, 4, 10]
21.array.concat():连接两个或更多的数组,并返回新的数组
<script>
const arr1 = [3, 6, 5, 4, 5]
const arr2 = [5, 2, 2, 6, 7]
const res = arr1.concat(arr2)
console.log(res); // [3, 6, 5, 4, 5, 5, 2, 2, 6, 7]
</script>
22.array.fill():使用一个固定值来填充数组
const arr = [1, 2, 3, 4, 5];
arr.fill(3); // [3, 3, 3,3,3]
23.array.from():从具有 length 属性或可迭代对象的任何对象返回 Array 对象,可用于字符串转数组,伪数组转数组
<script>
const str = 'abcdefg'
const res = Array.from(str)
console.log(res); //['a', 'b', 'c', 'd', 'e', 'f', 'g']
</script>
24.array.includes():判断一个数组是否包含一个指定的值
const arr = [1, 2, 3, 4, 5];
arr.includes(3); // true
arr.includes(6); // false
25.arr.toString():把数组转换为字符串,并返回结果
const arr = [4, 3, 5, 6, 5, 7]
const res = arr.toString()
console.log(res); //4,3,5,6,5,7 数组成功转字符串
isArray():判断对象是否为数组
entries():返回数组的可迭代对象;
keys():返回数组的可迭代对象,包含原始数组的键(key)
valueof():返回数组对象的原始值
copywithin():从数组的指定位置拷贝元素到数组的另一个指定位置中
lastIndexOf():搜索数组中的元素,并返回它最后出现的位置