JavaScript数组方法总结

时间:2023-02-09 19:01:37

1、 由字符串生成数组

split() 分割字符串,并将分割的部分作为一个元素保存在一个新建的数组中。

    var  str1 = "this is an emample to using the method of array .";
var str2 = str1.split(" "); //以空格作为分割条件
for(var i = 0; i< str2.length; i++ ){
console.log(str2[i]);
}

2、查找元素

indexOf() 用来查找元素在目标数组中是否存在,如果存在,返回该元素在数组中第一次出现的位置索引,如果不存在,就返回-1。

lastIndexof() 和indexOf()作用一样,但是返回的是相同元素中的最后一个元素的位置索引。

    var names = ["one", "two", "three", "four", "five", "one"];
var position = names.indexOf("one");
if(position >= 0){
console.log("Found " + name + " at position " + position);
}else{
console.log(name + "not found in array .");
}
// Found at position 0
var position2 = names.lastIndexOf("one");
console.log("Found at position " + position2);
// Found at position 5

3、字符串表示

将数组转换成字符串:join()toString()

    var str1 = ["one", "two", "three", "four", "five"];

var str2= str1.join();
console.log(str2); // one,two,three,four,five

str2= str1.toString();
console.log(str2); // one,two,three,four,five

console.log(str1); // ["one", "two", "three", "four", "five"]

4、由已有数组创建新数组

concat() 用来合并多个数组创建一个新数组。

splice() 截取一个数组的子集创建一个新数组。

    var str1 = ["one", "two", "three", "four", "five"];
var str2 = ["six", "seven", "eight","nine","ten"];

var str3 = str1.concat(str2);
console.log(str3); // ["one", "two", "three", "four", "five", "six", "seven", "eight"]

var str4 = str2.splice(2,4);
console.log(str4); // ["eight", "nine", "ten"]

5、为数组添加元素

push() 将一个元素添加到数组末尾。

unshift() 可以将元素添加在数组的开头。

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

num1.push(6);
console.log(num1); // [1, 2, 3, 4, 5, 6]

var s1 = num1.push();
console.log(s1); // 6

num1[num1.length] = 10;
console.log(num1); // [1, 2, 3, 4, 5, 6, 10]

num1.unshift("one", "two");
console.log(num1); // ["one", "two", 1, 2, 3, 4, 5, 6, 10]

var s2 = num1.unshift();
console.log(s2); // 9

6、从数组中删除元素

pop() 可以删除数组末尾的元素。

shift() 删除数组中的第一个元素。

    var num1 = [1, 2, 3, 4, 5];

num1.pop();
console.log(num1); // [1, 2, 3, 4]

var s = num1.pop();
console.log(s); // 4

num1.shift();
console.log(num1); // [2, 3]

var s3 = num1.shift();
console.log(s3); // 2
console.log(num1); // [3]

7、从数组中间位置添加和删除元素

splice ( 起始索引,需要删除的元素个数,需要添加进数组的元素 )

    var str = [1, 2, 3, 7, 8 , 9];
var nStr = [4, 5, 6];

str.splice(6,0,10,11,12);
console.log(str); // [1, 2, 3, 7, 8, 9, 10, 11, 12]

str.splice(3, 0, nStr);
console.log(str); // [1, 2, 3, Array[3], 7, 8, 9, 10] Array[3]是一个数组:[4,5,6]

str.splice(3,4);
console.log(str); // [1, 2, 3, 10, 11, 12]

8、给数组排序

reverse() 将数组中的元素的顺序进行翻转。

sort() 按照字典顺序对元素进行排序。

    var num1 = [1, 2, 3, 4, 5];
var num2 = [2, 5,1 ,7, 100, 3, 20];
var str = ["one", "two", "three", "four", "five"];

num1.reverse();
console.log(num1); // [5, 4, 3, 2, 1]

str.sort();
console.log(str); // ["five", "four", "one", "three", "two"]

// sort()只是按照字典顺序进行排序
num2.sort();
console.log(num2); // [1, 100, 2, 20, 3, 5, 7]

// 改进sort()排序
function compare(n1, n2){
return n1-n2;
}
num2.sort(compare);
console.log(num2); // [1, 2, 3, 5, 7, 20, 100]

9、迭代器方法

(1)不生成新数组的迭代器方法

foreach() 方法,接受一个函数作为参数,对数组中的每个元素使用该函数。

every() 方法,接受一个返回值为布尔型的函数,对数组中的每个元素使用该函数,如果对于所有的元素,该函数都返回true,则该方法返回true,否则会返回false。

some() 方法,也接受一个返回值为布尔型的函数,但是该方法只要有一个元素使得该函数返回true,该方法就返回true。

reduce() 方法,接受一个函数,返回一个值。这个方法会从一个累加值开始,不断对累加值和数组中的后续元素调用该函数,直到数组中的最后一个元素,最后返回得到累加值。

reduceRight() 方法,和reduce()方法区别在于,它是从右到左执行的。

    // forEach() 方法
function square(num){
console.log(num, num * num);
}
var num1 = [1, 2, 3, 4, 5];
num1.forEach(square);


// every()方法
function isEven(num){
return num % 2 == 0;
}
var num2 = [6, 7, 8, 9, 10];
var even = num2.every(isEven);
if(even){
console.log("all numbers are even .");
}else{
console.log("not all numbers are even .");
}
// 结果: not all numbers are even


// some()方法
function isEven(num){
return num % 2 == 0;
}
var num3 = [1, 2, 3, 4, 5, 6, 7];
var someEven1 = num3.some(isEven);
if(someEven1){
console.log("some numbers are even .");
}else{
console.log("no numbers are even .");
}
// 结果: some numbers are even .

var num4 = [1,3,5,7,9];
var someEven2 = num4.some(isEven);
if(someEven2){
console.log("some numbers are even .");
}else{
console.log("no numbers are even .");
}
//结果: no numbers are even .


// reduce()方法
function add(runTotal, currentValue){
return runTotal + currentValue;
}
var num6 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
var num7 = num6.reduce(add);
console.log(num7); //结果: 55

function concat(accString, item){
return accString + item;
}
var str1= ["one", "two", "three", "four", "five"];
var str2 = str1.reduce(concat) ;
console.log(str2); // onetwothreefourfive


// reduceRight()方法
function concat(accString, item){
return accString + item;
}
var str3= ["one", "two", "three", "four", "five"];
var str4 = str3.reduceRight(concat) ;
console.log(str4); // fivefourthreetwoone
(2)生成新数组的迭代器方法

map() 方法,对数组中的每个元素使用某个函数,该数组的元素是对原有元素的某个函数得到的结果。

filter() 方法, 传入一个返回值为布尔型的函数,当对数组中的所有元素使用该函数,结果都是true时,区别于every()方法返回true, filter()方法返回的是一个新数组,这个新数组包含使用该函数后结果为true的元素。

    // map()方法
function curve(num){
return num += 5;
}
var num1 = [5, 15, 25, 35, 45];
var num2 = num1.map(curve);
console.log(num2); // [10, 20, 30, 40, 50]

function getFirstWord(str){
return str[0];
}
var str1 = ["one", "two", "three", "four"];
var str2 = str1.map(getFirstWord);
console.log(str2); // ["o", "t", "t", "f"]


// filter()方法

//示例一
function isEven(num){
return num % 2 == 0;
}
function isOdd(num){
return num % 2 != 0;
}
var num3 = [];
for(var i = 0 ; i < 20; i++){
num3[i] = i+1;
}
var even = num3.filter(isEven);
console.log("Even numbers : " + even); // Even numbers : 2,4,6,8,10,12,14,16,18,20

var odd = num3.filter(isOdd);
console.log("Even numbers : " +odd); // Even numbers : 1,3,5,7,9,11,13,15,17,19

//示例二
function passing(num){
return num >= 60;
}
var num4 = [];
for(var i = 0 ; i < 20; i++){
num4[i] = Math.floor(Math.random() * 101);
}
var num5 = num4.filter(passing);
console.log("all numbers : " + num4);
// all numbers : 91,92,12,21,99,98,37,99,64,37,47,49,64,75,45,7,85,94,29,24
console.log("passing numbers : " + num5);
// passing numbers : 91,92,99,98,99,64,64,75,85,94

// 示例三
function delAfterC (str){
if(str.indexOf("cie") > -1){
return true;
}
return false;
}
var str3 = ["recieve", "deceive", "percieve", "deceit", "concieve"];
var str4 = str3.filter(delAfterC);
console.log(str4); // ["recieve", "percieve", "concieve"]

PS:本文仅仅是个人学习总结,若有不足还忘谅解,欢迎联系指导。