在数组内建方法大全(一)中,介绍了7种不太常见(我很多没见过)的数组内建方法。如果说有点华而不实,那在这一篇我将再展示几种实用的方法,当然,也是面试踩雷区
增删改查:splice、shift(unshift)、pop(push)
1.Array.protoType.splice(begin,end):分割数组,提取想要的范围,不改变原数组
- 返回值:新的数组
- 参数:
- begin(可选):起始位置
- end (可选):结束位置,没有指定结束位置,默认返回begin后所有值
- 注意事项:
- 若begin > end ,返回空数组
- 返回的新数组内容从begin开始,到end的前一个值,即包含begin位,不包含end位
- 若参数为负数,则看做加上数组的length,如
[0,1,2].splice(-2,-1)
相当于[0,1,2].splice(1,2)
,结果都为[1]
- 例子
var animals = ['1', '2', '3', '4', '5'];
console.log(animals.slice(2));
// ["3", "4", "5"]
console.log(animals.slice(2, 4));
// ["3", "4"]
console.log(animals.slice(1, 5));
// ["2", "3", "4", "5"]
3.Array.protoType.shift():从数组中移除第一个元素,改变数组长度
无参数
返回值:被移除的元素
对应相反方法: Array.unshift(element1,...),往数组前位添加元素
改变数组长度
返回值:
注意
,unshift返回的是新数组的长度!
- 例子:
var a = [1, 2, 3];
console.log(a.shift()); // 移除第一个元素,返回被移除的元素
//1
console.log(a);
// [2,3]
console.log(a.unshift(4,5)); //向数组中添加元素,返回新数组长度
// 4,
console.log(a);
// [4 , 5 , 2 , 3]
4. Array.protoType.pop():从数组中移除最后一个元素,改变数组长度
无参数
返回值:被移除的元素
对应相反方法:Array.push(element1,...),在数组最后添加元素
改变数组长度
返回值:
注意
,push返回的是新数组的长度!
- 例子:
var plants = ['1', '2', '3', '4', '5'];
console.log(plants.pop()); //移除最后一个元素,返回被移除的元素
// "5"
console.log(plants);
// ["1", "2", "3", "4"]
console.log(plants.push(“0”)); //6
遍历迭代:reduce、map、forEach
5.Array.protoType.reduce(callback(accumulator,currentValue,currentIndex),initialValue):对数组的值按索引顺序进行迭代操作,如累加
返回值:最后一次调用得出的累积结果
参数:
- callback:数组中每个值都会经过的回调操作
a. accumulator:当前的累积操作结果
b. currentValue(可选):当前正在操作的值
c. currentIndex(可选):当前操作值的索引 - initialValue(可选):第一次操作前的初始值,若没有设置该参数,默
6.Array.protoType.map(callback(currentValue,index,array),thisArg):操作数组中的每个值
返回值:一个每个值都已经过回调操作的新的数组
参数:
- callback:
a. currntValue:遍历的当前值
b. index(可选) :索引
c.array(可选):当前数组 - thisArg(可选):callback函数中的 this 关键字可引用的对象。如果省略 thisArg,则 undefined 将用作 this 值。
- 例子:
var array1 = [1, 4, 9, 16];
// pass a function to map
const map1 = array1.map(x => x * 2);
console.log(map1);
// expected output: Array [2, 8, 18, 32]
认为数组中的第一个值,并从第二个值开始迭代
- 例子:
const array1 = [1, 2, 3, 4];
const reducer = (accumulator, currentValue) => accumulator + currentValue;
// 1 + 2 + 3 + 4
console.log(array1.reduce(reducer)); //10
// 5 + 1 + 2 + 3 + 4
console.log(array1.reduce(reducer, 5)); //15
7.Array.protoType.forEach(callback(currentValue,index,array),thisArg):遍历数组
返回值: undefined
参数:
- callback():对数组每一个元素的操作函数
a. currentValue:当前遍历的值
b. index(可选):索引值
c. array(可选):正在操作的数组 - thisArg(可选):callback函数中的 this 关键字可引用的对象。如果省略 thisArg,则 undefined 将用作 this 值。
- 例子:
其他:indexOf(lastIndexOf)、sort、keys、join、some(every)
8.Array.protoType.indexOf(searchElement,fromIndex):匹配指定位置起出现的第一个指定元素
返回值:匹配元素的索引值,若匹配不成功,返回-1
参数:
- searchElement:待匹配的元素
- fromIndex(可选):开始匹配的位置,默认从0开始
对应相反方法:Array.lastIndexOf(searchElement,fromIndex),匹配指定位置起出现的最后一个指定元素
** 返回值: 匹配元素的索引值,若匹配不成功,返回-1例子:
var a = [2, 9, 9];
a.indexOf(2); // 0
a.indexOf(7); // -1
a.lastIndexOf(9); //2
9.Array.protoType.sort(compareFunction()):为数组排序
返回值:排序后的新数组
-
参数:
compareFunction(a,b)(可选):自定义排序方法,默认为字Unicode码- 函数需要传递两个参数a,b
- 若a < b ,即a排在b之前,则返回一个小于0的数
- 若a = b ,则返回0
- 若a < b ,则返回一个大于0的数
例子:
var a = new Array(4, 11, 2, 10, 3, 1);
var b = a.sort(); // b= [1,10,11,2,3,4].按照标准字符排序
function compareNum(first ,second{
if (first == second)
return 0;
if (first < second)
return -1;
else
return 1;
}
var c = a.sort(compareNum) //c = [1,2,3,4,10,11];
10.Array.protoType.keys():
返回值:一个迭代器,它可返回数组的索引
参数:无参数
例子:
var arr = ['a', 'b', 'c'];
var k= arr.keys();
// k.next().value == 0
// k.next().value == 1
// k.next().value == 2
11.Array.protoType.join(separator):在数组值之间插入分隔符,并将整个数组转化为字符串
返回值:转化后的字符串
参数:
separator(可选):分隔符,可以为空。注:如果数组的任一元素为 undefined 或 null,则该元素将被视为空字符串。
例子:
var elements = ['Fire', 'Wind', 'Rain'];
console.log(elements.join()); //Fire,Wind,Rain
console.log(elements.join('"'));// FireWindRain
console.log(elements.join('-')); // Fire-Wind-Rain
12.Array.protoType.some(callback(currentValue,index,array),thisArg):判断数组中是否有满足回调方法中的值
返回值:布尔值
参数:
- callback():对数组每一个元素的操作函数
a. currentValue:当前遍历的值
b. index(可选):索引值
c. array(可选):正在操作的数组 - thisArg(可选):callback函数中的 this 关键字可引用的对象。
*相关方法:array.every(callback())是判断数组中的所有值是否满足回调方法,参数一致
- 例子:
function isBiggerThan10(element, index, array) {
return element > 10;
}
[2, 5, 8, 1, 4].some(isBiggerThan10); // false
[12, 5, 8, 1, 4].some(isBiggerThan10); // true
[11,10,9,1,4].every(isBiggerThan10); // false