JS数组常用操作整理

217 阅读5分钟

数组置空

let arr = [1,2,3]
arr = []
/* 
这种方法虽然可以清空数组 但是只是将arr引用到空数组中 而如果有依赖于这个arr的变量的话 
这个变量不会受影响 还是等于arr=[] 之前的值  这就意味着这个arr先前的值还存放在内存中
当数据量比较大时 就会导致内存泄漏 
*/
let arr=[1,2,3]
arr.length=0
 
/* 
这种方法可以解决  第一种方法带来的内存泄漏问题 它是直接彻底清空arr数据的内容,
先前依赖于arr数据的内容也会一并消失。
*/

数组头部插入数据

// 可以使用JS提供的 unshift() 方法
 
let arr =[1,2,3]
arr.unshift('插入头部')
 
console.log(arr) //  结果为 ['插入头部',1,2,3]
// 可以使用JS提供的 concat() 数据合并方法 此方法如果考虑性能优化的话 就可以使用这种
 
 
let arr=[1,2,3]
 
arr= ['头部'].concat(arr)  
 
console.log(arr) // 结果为 ['头部',1,2,3]

数组去重

/*
可以利用 new Set()  它可以将目标对象里的值给取出 它取出的值是唯一的 
它返回的是一个对象 可以用Array.from()来将这个对象 转化为数组
*/
let arr=[1,1,2,2,3,4,5,5]
 
console.log(Array.from(new Set(arr))) //结果为 [1,2,3,4,5]
 
// 如果不用Array.from()的话
console.log(new Set(arr)) // 结果为 {1,2,3,4,5}
 

复制数组

/*
可以利用扩展运算符 实现数组的复制 值得注意的是 扩展运算符的使用是深拷贝还是浅拷贝
是要看数据源的数据类型,如果只是一层数组或对象,其里面的元素也是简单数据类型的元素时,
就是深拷贝
*/
 
let arr=['1','2','3']
let test=[...arr]
 
console.log(test) //结果为 ['1','2','3']
 
// 也可以将数组转为对象 会把数组的下标当作对象的key(键)值 
 
let obj={...arr}
console.log(obj) // 结果为 {0:'1',1:'2',2:'3'}

合并数组

// 一、可以用concat()来合并
 
let arr1=[1,2,3,4]
let arr2=[4,5,6,7]
 
let arr3= arr1.concat(arr2)
 
console.log(arr3) // 结果为 [1,2,3,4,4,5,6]
 
// 二、可以用扩展运算符(...)来合并
 
console.log([...arr1,...arr2]) // 结果为 [1,2,3,4,4,5,6]
 
// 想去重复值的话就需要用到上面说的 new Set()
 
console.log(Array.from(new Set([...arr1,...arr2]))) 
// 结果为 [1,2,3,4,5,6,7]

数组交集

/* 
数据交集 也就是说两个或多个数组共同有得值 
早期得时候需要用两个for循环来比较值来完成 比较难受
但现在可以利用 filter() 和 includes() 来实现
incudes() 就是 查看某个元素是否在目标对象上存在
*/
 
let arr1 =[1,3,5]
 
let arr2=[1,2,4]
 
let arr3 = arr1.filter((item)=> arr2.includes(item) )
console.log(arr3) // 结果为  [1]

获取数组得随机值

// 使用 Math.floor() 和 Math.random()  
 
let arr1= ['张三', '李四', '王五', '找六', '张三']
console.log(arr1[Math.floor(Math.random() * (arr1.length))]) 
// 第一次随机得结果为: 张三

获取元素在数组中最后出现的下标

 
let arr = ['张三', '李四', '王五', '找六', '张三']
console.log(arr.lastIndexOf('张三'))  // => 4

数组反转

let arr=[1,2,3,4]
console.log(arr.reverse()) // [4,3,2,1]

去除数组中的虚假值

// JS中虚假值有:false、0、''、null、NaN、undefined、-0
 
let arr = ['小明', '小蓝', '', false, ' ', undefined, null, 0, NaN, true]
console.log(arr.filter(Boolean)) // 结果为 ['小明', '小蓝', ' ', true]

数组求和

// 可以使用reduce() 这个数组的方法
let arr = [1, 2, 3, 4]
console.log(arr.reduce((a, b) => a + b),0) // 结果为 10

删除并返回数组的最后一个元素

//Array.pop(),删除并返回数组的最后一个元素,若该数组为空,则返回undefined。原数组改变。
let arr = [1, 2, 3, 4]
let del = arr.pop(); //del = 7;arr = [1,2,3];

用指定字符连接形成一个字符串

let arr = [1, 2, 3, 4, 5];
let str1 = arr.toString()
let str2 = arr.join(',')
let str3 = arr.join('##')
let str4 = arr.join('')
console.log(str1)// 1,2,3,4,5
console.log(str2)// 1,2,3,4,5
console.log(str3)// 1##2##3##4##5
console.log(str4)// 12345

将数组转换为字符串

let arr = [1, 2, 3, 4, 5];
let str = arr.toString()
console.log(str)  // 1,2,3,4,5

所有元素调用返回函数,返回值为最后结果

let arr=[1,2,3,4,5];
const add = (a,b)=>a+b;
let sum = arr.reduce(add);
//sum=15 相当于累加的效果
//与之对应的还有一个Array.reduceRight()方法,区别是这个是从右向左操作的

将所有元素判断并返回一个布尔值

//如果存在元素满足判断条件,则返回true;若所有元素都不满足判读条件,则返回false
let arr = [1,2,3,4,5];
const isLessThan4 => value => value<4;
const isMoreThan6 => value => value>6;
arr.some(isLessThan4);    //true
arr.some(isMoreThan6);    //false

将数组中的每个元素调用一个提供的函数

let arr = [1,2,3,4,5];
let newArr = arr.map(x =>x*2);
//arr= [1, 2, 3, 4, 5]   原数组保持不变
//newArr = [2, 4, 6, 8, 10] 返回新数组

数组中的每个元素执行提供传递的函数

let arr = [1, 2, 3, 4, 5]
num.forEach(x => x*2)
// arr = [2, 4, 6, 8, 10]  数组改变,注意和map区分

检测数组所有元素是否都符合指定条件

 var arr = [1, 2, 3];
 var r = arr.every(function (item, index, self) {
     return item>4;
 });
 //console.log(r)  // false    (数组中所有元素都小于4)

返回数组中满足条件的第一个元素

 var arr = [1, 2, 3];
 var r = arr.find(function (item, index, self) {
     return item>=2;
 });
 //console.log(r)  // 2 

对数组进行排序

//没传递函数时,按升序排
var arr= [40,100,1,5,25,10];
arr.sort(function(a,b){return a-b}); //升序排列[1,5,10,25,40,100]

返回数组的原始值

var arr= ["a", "b", "c", "d"];
arr.valueOf() //返回原数组,不改变原数组

插入、删除或替换数组的元素

array.splice(index,howmany,item1,…..,itemX)
-     index 表示开始位置,
-     howmany 表示删除多少个必须为数字,可以为0表示不删除,如果不填的话会从index位置删到最后
-     item1 表示要添加到数组的新元素
var arr= ["a", "b", "c", "d"];
arr.splice(2,1,"e","f"); //["a", "b", "e", "f", "d"] 从位置为2的地方删除一个元素并添加两个元素