常用数组方法

出来和你看月亮
208 阅读8分钟

常用数组方法

数组长度

arr.length 获取数组的长度

arr.length-1 获取数组的最后一位值

arr.length = 0 / arr = [] 置空数组

多维数组

var arr=["a",["b","c"]];
console.log(arr[1][1]);//得到了c
// 一维数组是有一个[],多维数组有n个[]
//数组访问数组元素是根据索引访问的,索引从0开始
//arr[1]==["b","c"]  arr[1][1]=="c"

数组创建和Array.of()方法

// 使用new创建
var arr=new Array(1,2,3,4);

var arr1=new Array(2);
//[empty,empty] 表示数组的长度为2,里面是两个空的数组元素

// 使用字面量创建
var arr1=[5,6,7,8]

// 修改数组元素的值
var arr=[1,2,3];
var b =arr;
b[1]=4;//[1,4,3]

数组是引用类型, 使用了同一个内存地址,这是引用类型的特性,即是浅拷贝,值类型是把内存复制了一份,即是深拷贝

        var arr=[1,2,3,4];
        arr[6]=7;
        console.log(arr);//[1,2,3,4, , ,7]
        // 超出数组的长度,会在该位置添加值,但之前的值会为空

Array.of()

       Array.of(参数1,参数2...)   可以放多个不同类型的值,创建可变数量的新数组
       
       var arr1=new Array(6);//[6]
       var arr2=new Array(1,2,3);//[1,2,3]
       conlose.log(arr1.length,arr);//1 6
  // Array.of()的作用就是创建一个长度为1 数值为6的数组

Array.of() 和 Array()的区别

Array.of() 和 Array 之间的区别在于处理整数参数：

Array.of(7) 创建一个具有单个元素 7 的数组，而 Array(7) 创建一个长度为7的空数组

注意：这是指一个有7个空位(empty)的数组，而不是由7个undefined组成的数组

数组类型检测

Array.isArray(参数)

//返回值为 true 或 false
console.log(Array.isArray([]));// true

instanceof 运算符,检测是否为数组

// 返回值为true或false
var arr=[1,2];
arr instanceof Array // true

Array.isArray优先于instanceof

数组类型转换

数组转为字符串

var arr=[1,2,3];

toString()方法
console.log(arr.toString());//string类型 1,2,3

String()方法
console.log(String(arr));//1,2,3

join(分隔符)  
//把数组的所有元素放入字符串,元素可以指定分隔符分隔,省略参数,默认以逗号分隔
console.log(arr.join());//1,2,3
console.log(arr.join("|"));//1|2|3

以上方法的返回值都是一个字符串

伪数组转为真数组

Array.from() 将一个伪数组转换为真数组,有length属性的可以转
var str=123;
Array.from(str);//[1,2,3]

数组的增删改查

增加

push()和unshift()

var a=[1,2];

push()
a.push(3);//[1,2,3]
a.push(4,5,"q");//[1,2,3,4,5,"aa"]
/*
在数组最后追加元素
()里直接写参数,可以写多个参数
添加完毕后,返回的是新数组的长度
原数组也会发生变化

*/

unshift()
a.unshift("bb");//["bb",1,2,3,4,5,"aa"]
/*
在数组最前面追加元素
()里直接写参数,可以写多个参数
添加完毕后,返回的是新数组的长度
原数组也会发生变化

*/

删除

pop()和shift()

pop() 删除数组的最后一个元素
a.pop();//["bb",1,2,3,4,5]

/*
一次只删除一个
返回值为删除的元素
原数组也发生变化
()里没有参数
*/


shift()  删除数组的第一个元素
a.shift();//[1,2,3,4,5]

/*
一次只删除一个
返回值为删除的元素
原数组也发生变化
()里没有参数
*/

pop和push是一对栈操作
unshift 和 shift 是队列操作

slice() 数组截取

//    下标
slice[start,end)  
返回截取的新数组
无法交换start和end位置
参数不写截取全部的数组
负值 是从后往前数[-2,-1)
可以将类数组转化为一个新数组
都是左闭右开的区间

  var a=[1,2,3,4,5]
  console.log(a.slice());//1,2,3,4,5
  console.log(a.slice(1,3));//2,3
  console.log(a.slice(-3,-1));//3,4

splice() 数组删除

splice([start(增加或删除的位置)],截取的个数,插入的元素[可以有多个])
返回 删除元素组成的数组
改变了原数组
没有参数的时候,返回空数组
只有一个参数,从当前位置到结束
第二个参数为0时,不删除

        var a = [1, 2, 3, 4, 5]
        var arr = [1, 2, 5, 3, 15, 20];
        console.log(a.splice());//[]
        console.log(a.splice(0, 5));//[1,2,3,4,5]
        console.log(arr.splice(1, 1, "11"));[2]
        console.log(arr);//[1,"11",5,3,15,20]

数组的迭代方法

在迭代里,如果有不需要的参数,可以省略不写

  1. array.forEach()

在forEach里,return不会终止迭代

//            回调函数
array.forEach(function(currentValue,inedx , arr){})
/*currentValue:数组当前项的值
index:数组当前项的索引
arr:数组对象本身
*/
 arr.forEach(function(value,index,arr){
            console.log(value);
            console.log(arr[index]);
        })
  1. array.map()

不会改变原数组,数组中的元素为原始数组元素调用函数处理后的值

返回一个新数组,为空时不会检测

array.map(function(currentValue,inedx , arr){})
/*
返回一个新数组,每个元素都是回调函数的结果
*/
     var arr = [1, 2, 5, 3, 15, 20];
       // map 遍历每一个数组,返回一个新数组
        var map=arr.map(function(num){
            return num+1;
        })
        console.log(map);//[2,3,6,4,16,21]
  1. array.filter()主要用于筛选数组,找到符合条件的元素

在filter里,return不会终止迭代

返回一个满足条件的新数组

array.filter(function(currentValue,inedx , arr){})
/*
创建一个新数组,主要用于筛选数组,找到符合条件的元素
直接返回一个新数组,把所有满足条件的元素返回回来
*/
 var arr = [1, 2, 5, 3, 15, 20];
 var newArr = arr.filter(function (value, index, arr) {
 // 返回的是一个新数组,用个变量接收数组
            return value >= 10;
        })
        console.log(newArr);//15,20
  1. array.some()查找数组中满足条件的元素是否存在
array.some(function(currentValue,inedx , arr){})
/*
用于查找数组中满足条件的元素是否存在,返回值是true或false
如果第一个就找到满足条件的元素,就会终止循环,不继续查找
遇到return true 就会终止遍历,效率较高
不会对空数组进行检测
不会改变原数组
*/
 // 返回的是一个值,用个变量接收
  var arr = [1, 2, 5, 3, 15, 20];
  var flag=arr.some(function(value,index){
            return value>=10;
        })
        console.log(flag);// true
  1. array.every()判断每一个元素是否都通过测试
        
array.every(function(currentValue,inedx , arr){})
// 判断每一个元素是否都通过测试,有一个不通过为false
// 返回值是true或false

 var arr = [1, 2, 5, 3, 15, 20];
 // 返回的是一个值,用个变量flag接收
 var flag=arr.every(function(value,index,arr){
            return value>=20;
        })
        console.log(flag);//false
  1. Array.find()用于找到第一个符合条件的元素
 
Array.find(function(currentValue,inedx , arr){})
/*
用于找到第一个符合条件的元素 
没有找到就返回undefined
没有需要的参数,可以不写或只写一个
*/
        var arr = [1, 2, 5, 3, 15, 20];
        var flag=arr.find(function(value,index,arr){
            return value>=15;
        })
        console.log(flag); //15
  1. Array.findindex()找到第一个符合条件的元素的索引
array.findindex(function(currentValue,inedx , arr){})
/*
用于找到第一个符合条件的元素的索引 , 没有找到就返回-1
没有需要的参数,可以不写或只写一个
*/
     var arr = [1, 2, 5, 3, 15, 20];
     var flag=arr.findIndex(function(item){
            return item>15;
        })
        console.log(flag);// 5

判断是否包含指定的值

Array.includes("查询的文本","从下标开始")

返回true/false

如果index超过数组的长度,查不到数组

index小于0的时候,可以查到

// 判断某个数组是否包含给定的值,返回boolean
[1,2,3].includes(2);//true
[1,2,3].includes(4);// false
[1,2,3].includes(1,100);// false
[1,2,3].includes(1.-1);// true

通过includes()简化if判断

if(a==0 || a==null || a==undefined || a==false || a==1){}

// 简化 后续想添加在数组里添加就行
if([0,null,undefined,false,1].includes(a)){}

展开语法

...arr 将数组或对象拆分成以逗号分隔的参数序列

var arr=[1,2,3];
...arr;//1,2,3
console.log(...arr);//1 2 3 当成了console.log的参数分隔符,所以输出1 2 3

合并数组

arr.concat(数组)(普通方法)

  var arr = [1, 2, 5, 3, 15, 20];
  var b=["11"];
  console.log(arr.concat(b));//[1, 2, 5, 3, 15, 20, "11"]
  
  // 返回了一个新的数组

展开语法

方法一
var a=[1,2,3];
var b=[4,5,6];
var c=[...a,...b];//[1,2,3,4,5,6]

方法二
a.push(...b);
var a=[1,2,3];
var b=[4,5,6];
a.push(...b);//1,2,3,4,5,6

数组索引

arr.indexOf()

var a=["aa","bb",3,"bb"];
a.indexOf("bb");//返回索引号1

//从前面开始查找
//只返回第一个满足条件的索引
//如果在数组中找不到元素,就返回-1

arr.lastindexOf()

var a=["aa","bb",3,"bb"];
a.lastindexOf("bb");//返回索引号3

//从后面开始查找
//如果在数组中找不到元素,就返回-1

数组排序

  1. 翻转数组 reverse()
var a=[1,2,3];
a.reverse();//[3,2,1]
  1. 数组排序(冒泡排序) sort()
var a=[4,2,1,6];
a.sort();//1,2,4,6
// 注意:sort只能实现单位数字排序,遇到多位数字排序,根据第一位数字的大小进行排序

// sort()方法的完美解决
var a=[42,21,11,6];
a.sort(function(a,b){
    return a-b;// 升序
    return b-a;// 降序
})

数组转为字符串

  1. Array.toString()

对象类型的数组不能转变

var fruits = ["Banana", "Orange", "Apple", "Mango"];\
fruits.toString(); // Banana,Orange,Apple,Mango

// 对象类型数组不能改变
var fruits = [{id:1},{id:2}];
var str = fruits.toString();
console.log(str) // [object Object],[object Object]
  1. Array.join(指定分隔符)

用于把数组中的所有元素转换一个字符串

元素是通过指定的分隔符进行分隔的

不传参数,默认,分隔

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.join(); //Banana,Orange,Apple,Mango
fruits.join("-"); //Banana-Orange-Apple-Mango
avatar
文章
阅读
粉丝