一:前言
作为一个英语不好的我,记各种API真是让人头疼,所以把数组方法API列举出来,方便闲来瞅瞅,增加点记忆。
注:不包含循环遍历数组的方法,需要晓得都在专门写循环的那篇博客中。js循环方法大全
1. concat();
作用:合并数组,返回一个新的数组,不会改变原数组
let str1 = [{name:'JJ'},'测试',"hello",1];
let str2 = ["world"]
console.log(str1.concat(str2));
console.log(str1);
2. join()
作用:将数组转为字符串并返回转化的字符串数据,不会改变原来的数组;
注意:()中用双引号包括自己想用的分隔符,默认为逗号,也可以用别的符号;
常用场景:该方法常用与跟后台接口联调时前端需要的是数组格式渲染页面,后端存储是需要逗号拼接的数据
var str1 = ['张三','李四',"王麻子"];
console.log(str1.join());
console.log(str1.join('-'));
console.log(str1);
3.pop()
作用:删除数组最后一位数据,并且返回删除的数据,会改变原来的数组;
var str1 = ['张三','李四',"王麻子"];
console.log(str1)
console.log(str1.pop())
console.log(str1)
4.shift()
作用:删除数组的第一位数据,并且返回新数组的长度,会改变原来的数组;
var str1 = ['张三','李四',"王麻子"];
console.log(str1)
console.log(str1.shift())
console.log(str1)
5.unshift()
作用:在数组的首位新增一个或多数据,并且返回新数组的长度,会改变原来的数组
var str1 = ['张三','李四',"王麻子"];
var str2 = ['张三2','李四2',"王麻子2"];
console.log(str1.unshift("暖暖")); // 4
console.log(str2.unshift("嘻嘻","啦啦")); // 5
console.log(str1); //['暖暖','张三','李四',"王麻子"]
console.log(str2); //["嘻嘻","啦啦",'张三2','李四2',"王麻子2"]
6.push()
作用:在数组的最后一位新增一个或多个数据,并且返回新数组的长度,会改变原来的数组
var str1 = ['张三','李四',"王麻子"];
var str2 = ['张三2','李四2',"王麻子2"];
console.log(str1.push("暖暖")); // 4
console.log(str2.push("嘻嘻","啦啦")); // 5
console.log(str1); //['张三','李四',"王麻子",'暖暖']
console.log(str2); //['张三2','李四2',"王麻子2","嘻嘻","啦啦"]
7.sort()
作用:对数组内的数据进行排序(默认为升序),并且返回排过序的新数组,会改变原来的数组
7.1 以字母顺序对数组进行排序
var fruits = ["Banana", "Orange", "Apple", "Mango"]; //通过ASCII码可以转为相应的数值,再根据数值比较
fruits.sort();
console.log(fruits) // ["Apple", "Banana", "Mango", "Orange"]
7.2 数字升序排序
var points = [40, 100, 1, 5, 25, 10];
points.sort(function(a, b){return a - b});
console.log(points) //[1, 5, 10, 25, 40, 100]
7.3 数字降序排序
var points1 = [40, 100, 1, 5, 25, 10];
points1.sort(function(a, b){return b - a});
console.log(points1) // [100, 40, 25, 10, 5, 1]
7.4 排序对象数组
var cars = [
{type:"Volvo", year:2016},
{type:"Saab", year:2001},
{type:"BMW", year:2010}
];
cars.sort(function(a, b){return a.year - b.year});
console.log(cars)
8.reverse()
作用:将数组的数据进行反转,并且返回反转后的数组,会改变原数组
var str1 = ['张三','李四',"王麻子"];
console.log(str1.reverse()); //["王麻子", "李四", "张三"]
console.log(str1);
9.slice()
作用:截取指定位置的数组,并且返回截取的数组,不会改变原数组
参数:slice(startIndex, endIndex) startIndex开始截取下标,endIndex结束截取下标
var arr = ["a1","b1","c1","d1","e1"];
console.log(arr.slice(1,3)); //["b1", "c1"]
console.log(arr.slice(1)); //["b1", "c1", "d1", "e1"]
console.log(arr); // ["a1", "b1", "c1", "d1", "e1"]
10.splice()
作用:向数组中添加,或从数组删除,或替换数组中的元素,然后返回被删除/替换的元素。
参数:splice(start,num,data1,data2,...); 所有参数全部可选。
var arr = ["Tom","Jack","Lucy","Lily","May"];
console.log(arr.splice(2,0,"a","b")); //[]
console.log(arr); //["Tom", "Jack", "a", "b", "Lucy", "Lily", "May"]---原数组改变
11.toString()
作用:将数组转换成字符串,类似于没有参数的join()。
注意:该方法会在数据发生隐式类型转换时被自动调用,如果手动调用,就是直接转为字符串。不会改变原数组。
var str = [1,2,3];
console.log(str.toString()); //1,2,3
console.log(str); //[1,2,3]
12.valueOf()
作用:没鸡儿暖用。就是返回原数组的方法。
var str = [1,2,3];
console.log(str.valueOf()); //[1,2,3]
console.log(str); //[1,2,3]
//看是不是没暖用
console.log(str.valueOf() == str); //true
13.IndexOf()
作用:根据指定的数据,从左向右,查询在数组中出现的位置,如果不存在指定的数据,返回-1,找到了指定的数据返回该数据的索引
参数:indexOf(value, start);value为要查询的数据;start为可选,表示开始查询的位置,当start为负数时,从数组的尾部向前数;如果查询不到value的存在,则方法返回-1
注意:如果找到该数据,立即返回该数据的索引,不再往后继续查找
var str = ["h","e","l","l","o"];
console.log(str.indexOf("l")); //2
console.log(str.indexOf("l",3)); //3
console.log(str.indexOf("l",4)); //-1
14.lastIndexOf()
作用:返回一个指定的字符串值最后出现的位置,在一个字符串中的指定位置从后向前搜索.
注意:indexOf() 方法和 lastIndexOf() 方法都对大小写敏感!
var str = ["h","e","l","l","o"];
console.log(str.lastIndexOf("l")); //3
console.log(str.lastIndexOf("l",3)); //3
console.log(str.lastIndexOf("l",6)); //3
改变原数组的方法有哪些
unshift(); push();shift(); pop();sort();reverse();splice();