首先介绍的常用方法有:Array.join()、Array.reverse() 、Array.sort() 、Array.concat() 、Array.slice() 、Array.splice()、Array.push()和Array.pop();
以及ES5和ES6新增加的方法
1、Array.join()
将数组中的元素以字符串的形式拼接起来,接收一个字符串参数为连接符号,默认为逗号
var a = [1,2,3];
var b = a.join();
console.log(b);//1,2,3
2、Array.reverse()
将数组元素反向排列并返回
var a = [1,2,3];
var b = a.reverse();
console.log(b);//[3,2,1]
3、Array.sort()
将数组排序,默认从小到大;可接受一个函数作为条件实现从大到小。
var a = [2,1,3];
var b = a.sort();
console.log(b);//1,2,3
var c = [2,1,3];
var d = c.sort(function (num1,num2) {
return num2-num1;
});
console.log(d);//3,2,1
4、Array.concat()
连接两个数组,并不对原数组造成影响
var a = [1,2,3];
var b = [4,5];
var c = a.concat(b);
console.log(c);//1,2,3,4,5
5、Array.slice()和Array.splice()
前者:数组截取,一个参数表示从这个位置截取到末尾,两个参数表示截取的开始位置的结束位置,复数表示从倒数第几个开始截取(数字指的是下标,从0开始)。不对原数组造成影响
后者: 数组删除或替换,会对元数组造成影响,接收参数为删除元素的位置,三个参数或以上参数时,第一个为要插入的位置,第二个为从这个位置开始删除几个元素,之后为插入到这个位置之后的元素。对原数组造成影响
// var a = [1, 2 , 3, 4, 5];
// a.slice(0,3); //返回[1, 2, 3]
// a.slice(3); //返回[4, 5]
// a.slice(1, -1); //返回[2, 3, 4]
//var a = [1, 2 , 3, 4, 5, 6, 7, 8];
//a.splice(4);//删除5,6,7,8 a=[1,2,3,4]
//a.splice(1,3);//删除2~4
//a.splice(1,1);
// var a = [1, 2 , 3, 4, 5];
// a.splice(2, 2, 'a', 'b'); //从第二个数开始删两个,再讲a,b插入后边 a=[1, 2, 'a', 'b' , 5]
// console.log(a);
6、Array.push()和Array.pop()
从尾部开始添加或删除元素
var stack = []; //stack:[]
stack.push(1,2); //statck:[1,2];返回2
stack.pop(); //stack:[1];返回2
7、toString()和toLocaleString()
toString()将数组所有元素转化为字符串并且输出用逗号分隔的字符串列表,和不使用任何参数调用join()方法返回的字符串一致
[1, 2, 3].toString() //生成'1,2,3'
[1,[2, 'c']].toString() //生成'1,2,c'
toLocaleString()返回一个字符串表示数组中的元素。数组中的元素将使用各自的 toLocaleString方法转成字符串,这些字符串将使用一个特定语言环境的字符串(例如一个逗号 ",")隔开。
var number = 1337;
var date = new Date();
var myArr = [number, date, "foo"];
var str = myArr.toLocaleString();
console.log(str);
// 输出 "1337,2015/2/27 下午8:29:04,foo"
// 假定运行在中文(zh-CN)环境,北京时区
ES5数组方法
1、forEach()
该方法用来遍历数组,并给每一个数组添加指定的函数。传入参数为三个:分别为数组元素、下标和这个数组本身。
var keys = [1,2,3];
keys.forEach(function(value, index, array){
console.log(value);
})
该方法的缺点是:你能使用break终端遍历,也不能使用return返回到外部函数
2、map()
该方法会将数组中的每一个元素去执行map()里的函数,最终返回一个数组。数组中的元素为每一个元素执行这个函数之后的结果。
返回的为一个数组,我们需要返回一个新的值来添加到这个数组里
a = [1, 2, 3];
b= a.map(function(value){
return value*value;
})
console.log(b); //b是[1, 4, 9]
3、filter()
过滤效果。需要返回一个布尔类型的值进行判断。返回符合这个参数函数里的判断的元素组成的新数组:
a = [1, 2, 3, 4, 5];
b = a.filter(function(value){
return value > 3;
})
//b:[4, 5]
也可以fun(val,index)两个参数,也可以对下标来就行判断
4、every()和some()
判断是否都符合以及存在符合参数函数里的条件。返回的结果为一个布尔类型的值。
every()方法
var a = [1, 2, 3, 4, 5]
a.every(function(x) {return x<10;}) // =>true:所有值小于10
a.every(function(x) {return x%2 === 0;}) // =>false:不是所有值都为偶数
some()方法
var a = [1, 2, 3, 4, 5]
a.some(function(x) {return x%2 === 0;}) // =>true:存在偶数
a.some(isNaN) // =>false:不包含非数值元素
5、reduce()和reduceRight()
reduce()一个参数或两个。第一个为函数,对数组元素进行计算。返回计算之后的值。第二个可选参数相对于数组中添加了这个元素去进行计算。
var a = [1, 2, 3, 4, 5]
var sum = a.reduce(function(x, y) {return x+y}); //数组求和
console.log(sum);
reduceRight() 是从右边开始进行计算
6、indexOf() 和 lastIndexOf()
用来索引数组中是否存在该元素。如果存在返回第一个位置的下标,不存在则返回 -1 。
a = [0, 1, 2, 1, 0]
a.indexOf(1); // => 1:a[1]是1
a.lastIndexOf(1); // =>3:a[3]是1
lastIndexOf()方法为从最后一个开始索引
ES6数组方法
1、Array.from()
用来将类数组以及可遍历的对象(如ES6新增的数据结构Set和Map)转化为真正的数组。
let arrayLike = { '0': 'a', '1': 'b', '2': 'c', length: 3};
// ES5的写法
var arr1 = [].slice.call(arrayLike); // ['a', 'b', 'c']
// ES6的写法
let arr2 = Array.from(arrayLike); // ['a', 'b', 'c']
2、Array.of()
将一组值转为数组
Array.of(3, 11, 8) // [3,11,8]
Array.of(3) // [3]
Array.of(3).length // 1
数组实例的方法
1、find()和findIndex()
前者用来验证是否存在符合条件的元素,存在即返回该元素。不存在返回undefined;
[1, 4, -5, 10].find((n) => n < 0)// -5
后者和前者一样,不过存在时返回的是下标。不存在时返回的为-1。
[1, 5, 10, 15].findIndex(function(value, index, arr) { return value > 9;}) // 2
2、fill()
用参数来替换数组中的元素。
['a', 'b', 'c'].fill(7)// [7, 7, 7]new Array(3).fill(7)// [7, 7, 7]
3、entries()、keys()以及values()
这三个方法WieES6新增的三个用来遍历数组的方法。
for (let index of ['a', 'b'].keys()) {
console.log(index);
}
// 0
// 1
for (let elem of ['a', 'b'].values()) {
console.log(elem);
}
// 'a'
// 'b'
for (let [index, elem] of ['a', 'b'].entries()) {
console.log(index, elem);
}
// 0 "a"
// 1 "b"