数组API

今天来总结一下数组的API

目录

1.数组序列化；

2.构造函数的方法；

3.栈与队列的方法

4.排序方法；

5.操作方法；

6.位置方法；

7.迭代方法

---

1.数组序列化；

1）toString() 在默认情况下都会以逗号分隔字符串的形式返回数组项

2）join() 使用指定的字符串来分隔数组字符串

var arr = [1, 5, 2, 8, 10, { a: 1 }];
console.log(arr);            // [ 1, 5, 2, 8, 10, { a: 1 } ]
console.log(arr.toString()); // 1,5,2,8,10,[object Object]
console.log(arr.join(" "));  //1 5 2 8 10 [object Object]
console.log(arr.join("-"));  //1-5-2-8-10-[object Object]

2.构造函数的方法；

1） Array.isArray():用来判断某个变量是否是一个数组对象

//1.Array.isArray()
var a= Array.isArray(1,2)
console.log(a)//false
var a1= Array.isArray([1,2])
console.log(a1)//true

2）Array.from():从类数组对象或者可迭代对象中创建一个新的数组实例。

//2.Array.from():从类数组对象或者可迭代对象中创建一个新的数组实例。
var arr1 = Array.from('hello')
console.log(arr1); //[ 'h', 'e', 'l', 'l', 'o' ]

3）Array.of():根据一组参数来创建新的数组实例，支持任意的参数数量和类型

// 3.Array.of():根据一组参数来创建新的数组实例，支持任意的参数数量和类型
var b = Array.of('jello','hello',1,2,3,[],{},function(){})
console.log(b);//[ 'jello', 'hello', 1, 2, 3, [], {}, [Function (anonymous)] ]

3.栈与队列的方法

1）Array.prototype.push();

// 1.Array.prototype.push()：
//push()方法可向数组的末尾添加一个或多个元素，并返回新的长度；且新的元素添加在数组的末尾，
//该方法会改变数组的长度。
// 该方法需要参数，返回值类型是number，返回的是数组的新长度
var color = ['red','blue','green']
console.log(color.length);//3
color.push('yellow');
console.log(color);//[ 'red', 'blue', 'green', 'yellow' ]
console.log(color.length);//4

2）Array.prototype.pop();

/ 2.Array.prototype.pop():
// pop() 方法用于删除数组的最后一个元素并返回删除的元素。该方法会改变数组的长度。
//  该方法不需要传参数，可以返回所有类型，返回的是删除的数组元素
var color1 = ['red','blue','green']
console.log(color1.pop());//green
console.log(color1);//[ 'red', 'blue' ]

3）Array.prototype.shift();

// 3.Array.prototype.shift():
//shift() 方法用于把数组的第一个元素从其中删除，并返回删除元素的值。该方法会改变数组长度。
// 该方法不需要参数，返回值可以是任何类型，返回的是删除的元素的值
var color2 = ['red','blue','green']
console.log(color2.shift());//red
console.log(color2);//[ 'blue', 'green' ]

4）Array.prototype.unshift();

// 4.Array.prototype.unshift()：
//unshift() 方法可向数组的开头添加一个或更多元素，并返回新的长度。
// 该方法需要参数，会改变数组的数目
var color3 = ['red','blue','green']
console.log(color3.unshift('pink',{},function(){},1));//7
console.log(color3);//[ 'pink', {}, [Function (anonymous)], 1, 'red', 'blue', 'green' ]

4.排序方法；

1)Array.prototype.reverse()；

// 1.Array.prototype.reverse():reverse() 方法用于颠倒数组中元素的顺序。
// 该方法不需要传参数，返回值类型是数组，返回的是颠倒顺序后的数组
var color4 = ['red','blue','green']
console.log(color4.reverse());//[ 'green', 'blue', 'red' ]
console.log(color4);//[ 'green', 'blue', 'red' ]

2)Array.prototype.sort()；

// 2.Array.prototype.sort()：sort() 方法用于对数组的元素进行排序。
/* 如果调用该方法时没有使用参数，按照字符编码的顺序进行排序。
要实现这一点，首先应把数组的元素都转换成字符串（如有必要），以便进行比较。如果要想进行升序或是降序排序的话，要提供比较函数。
排序顺序可以是字母或数字，并按升序或降序。
默认排序顺序为按字母升序。
 */
var color5 = ['red','blue','green']
console.log(color5.sort());//[ 'blue', 'green', 'red' ]

var num1 =[1,5,40,96,7]
console.log(num1.sort());//[ 1, 40, 5, 7, 96 ]  注意：当数字是按字母顺序排列时"40"将排在"5"前面。
// 使用数字排序，你必须通过一个函数作为参数来调用。函数指定数字是按照升序还是降序排列。无论a>b还是b>a，return a-b 总能得到升序的结果，而 return b-a 总能得到降序的结果。 
num1.sort(function(a,b){
    // return a-b//1:a-b
    return b-a//2:b-a
})
// console.log(num)//1:[ 1, 5, 7, 40, 96 ]
console.log(num1)//2:[ 96, 40, 7, 5, 1 ]

5.操作方法；

1)Array.prototype.concat()；

// 1.Array.prototype.concat():concat() 方法用于连接两个或多个数组。
// 该方法不会改变现有的数组，而仅仅会返回被连接数组的一个副本
// 该方法需要参数，参数可以是具体的值，也可以是数组对象，也可以是任意多个
// 返回值是一个新的数组，该数组是通过把所有 arrayX 参数添加到 arrayObject 中生成的。如果要进行 concat() 操作的参数是数组，那么添加的是数组中的元素，而不是数组。
var hege = ["Cecilie", "Lone"]; 
var stale = ["Emil", "Tobias", "Linus"]; 
var kai = ["Robin"]; 
var children = hege.concat(stale,kai);
console.log(children);//[ 'Cecilie', 'Lone', 'Emil', 'Tobias', 'Linus', 'Robin' ]

2)Array.prototype.slice()；

//2. Array.prototype.slice()：slice() 方法可从已有的数组中返回选定的元素；可提取字符串的某个部分，并以新的字符串返回被提取的部分。
//该方法返回一个新的数组，包含从start到end（不包括该元素）的arryObject中的元素
// start：可选。规定从何处开始选取。如果是负数，那么它规定从数组尾部开始算起的位置。如果该参数为负数，则表示从原数组中的倒数第几个元素开始提取，slice(-2) 表示提取原数组中的倒数第二个元素到最后一个元素（包含最后一个元素）。
// end：可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数，那么切分的数组包含从 start 到数组结束的所有元素。如果该参数为负数， 则它表示在原数组中的倒数第几个元素结束抽取。 slice(-2,-1) 表示抽取了原数组中的倒数第二个元素到最后一个元素（不包含最后一个元素，也就是只有倒数第二个元素）。
var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"]; 
// var citrus = fruits.slice(1,3);//1
// var citrus = fruits.slice(-1);//2
// var citrus = fruits.slice(2,-1);//3
var citrus = fruits.slice(-4,-1);//4

// console.log(citrus);//1:[ 'Orange', 'Lemon' ]
// console.log(citrus)//2.[ 'Mango' ]
// console.log(citrus)//3.[ 'Lemon', 'Apple' ]
console.log(citrus);//4.[ 'Orange', 'Lemon', 'Apple' ]

3)Array.prototype.splice()；

//3.Array.prototype.splice():splice() 方法用于添加或删除数组中的元素。
// 该方法需要参数，会改变原始数组，如果从 arrayObject 中删除了元素，则返回的是含有被删除的元素的数组。
/* 有三种参数：
1.index：规定从何处添加/删除元素。 该参数是开始插入和（或）删除的数组元素的下标，必须是数字。
2.howmany:规定应该删除多少元素。必须是数字，但可以是 "0"。 如果未规定此参数，则删除从 index 开始到原数组结尾的所有元素。
3.item1, ..., itemX:要添加到数组的新元素
*/
var fruit1 = ["Banana", "Orange", "Apple", "Mango"];
// fruit1.splice(2,0,"Lemon","Kiwi");//1.从数组索引位置 2 开始，不删除元素，添加两个新的元素"Lemon","Kiwi"
// fruit1.splice(2,1,"Lemon","Kiwi");//2.移除数组的第三个元素，并在数组第三个位置添加新元素:
fruit1.splice(2,2);//3.从第三个位置开始删除数组后的两个元素：
// console.log(fruit1);//1.[ 'Banana', 'Orange', 'Lemon', 'Kiwi', 'Apple', 'Mango' ]
// console.log(fruit1);//2.[ 'Banana', 'Orange', 'Lemon', 'Kiwi', 'Mango' ]
console.log(fruit1);//3.[ 'Banana', 'Orange' ]

6.位置方法；

1)Array.prototype.indexOf()；

// 1.indexOf() 方法可返回数组中某个指定的元素位置。该方法需要参数，返回值类型是number
/* 该方法将从头到尾地检索数组，看它是否含有对应的元素。开始检索的位置在数组 start 处或数组的开头（没有指定 start 参数时）。
如果找到一个 item，则返回 item 的第一次出现的位置。开始位置的索引为 0。
如果在数组中没找到指定元素则返回 -1。
 */
var fruit2 = ["Banana", "Orange", "Apple", "Mango"]; 
var a = fruit2.indexOf("Apple");
console.log(a);//2 意味着 "Apple" 元素位于数组中的第 3 个位置

2)Array.prototype.lastIndexOf()；

//2.Array.prototype.lastIndexOf():lastIndexOf() 方法可返回一个指定的元素在数组中最后出现的位置，从该字符串的后面向前查找。该方法需要参数，返回值类型是number
/* 该方法将从尾到头地检索数组中指定元素 item。开始检索的位置在数组的 start 处或数组的结尾（没有指定start参数时）。
  如果找到一个 item，则返回 item 从尾向前检索第一个次出现在数组的位置。数组的索引开始位置是从 0 开始的。
  如果在数组中没找到指定元素则返回 -1。
 */
var fruit3 = ["Banana", "Apple", "Orange", "Mango" ,"Apple"]; 
var a = fruit3.lastIndexOf("Apple");
console.log(a);//4 意味着"Apple"位于数组中的第4个位置

7.迭代方法

1)Array.prototype.every()；

/* 1.Array.prototype.every():
every() 方法用于检测数组所有元素是否都符合指定条件（通过函数提供）。
every() 方法使用指定函数检测数组中的所有元素:如果数组中检测到有一个元素不满足，则整个表达式返回 false ，且剩余的元素不会再进行检测。如果所有元素都满足条件，则返回 true。
该方法不会对空数组进行检测，不会改变原始数组，需要参数，返回值是布尔值 
 */
var ages = [32, 33, 16, 40];
var result = ages.every(function (age) {
  return age >= 18//检测数组 ages 的所有元素是否都大于等于 18 :
})
console.log(result);//false

2)Array.prototype.some()；

/* 2.Array.prototype.some()；
some() 方法用于检测数组中的元素是否满足指定条件（函数提供）;
some() 方法会依次执行数组的每个元素：如果有一个元素满足条件，则表达式返回*true* , 剩余的元素不会再执行检测。如果没有满足条件的元素，则返回false。
该方法不会对空数组进行检测，不会改变原始数组，需要参数，返回值是布尔值
*/
var age1 = [32, 33, 16, 40];
var result = age1.some(function (age1) {
  return age1 >= 18//检测数组中是否有元素大于18
})
console.log(result);//true

3)Array.prototype.filter()；

/* 3.Array.prototype.filter():filter() 方法创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。
该方法不会对空数组进行检测，不会改变原始数组，需要参数，返回的是数组，包含了符合条件的所有元素。如果没有符合条件的元素则返回空数组。
 */
var age2 = [32, 33, 16, 40];
var result = age2.filter(function (age2) {
  return age2 >= 18//返回数组 ages*中所有元素都大于 18 的元素: 
})
console.log(result);//输出结果为:[ 32, 33, 40 ]

4)Array.prototype.map()；

/* 4.Array.prototype.map();
map() 方法返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值。
map() 方法按照原始数组元素顺序依次处理元素;
该方法不会对空数组进行检测，也不会改变原始数组，需要参数，返回的是一个新的数组，数组中的元素为原始数组元素调用函数处理后的值。
 */
var numbers = [4, 9, 16, 25];
var result = numbers.map(function (number) {
  return Math.sqrt(number)//返回一个数组，数组中元素为原始数组的平方根
})
console.log(result);//输出结果为:[ 2, 3, 4, 5 ]

5)Array.prototype.forEach()；

/* 5.Array.prototype.forEach():forEach() 方法用于调用数组的每个元素，并将元素传递给回调函数。
forEach() 对于空数组是不会执行回调函数的,该方法需要参数，返回值是undefined
 */
var number1 = [4, 9, 16, 25];
number1.forEach(function (number1, index) {//index指的是当前元素的索引值
  console.log(index + ' -- ' + number1);//0 -- 4  1 -- 9  2 -- 16 3 -- 25
})