MDN - API数组笔记

传送门

Array.prototype.push(element1, ..., elementN)

将一个或多个元素添加到数组的末尾，并返回该数组的新长度

const animals = ['pigs', 'goats', 'sheep'];

const count = animals.push('cows');
console.log(count); // 4
console.log(animals); // ["pigs", "goats", "sheep", "cows"]

Array.prototype.pop()

删除数组最后一个元素,返回删除的元素,此方法更改数组的长度

const plants = ['broccoli', 'cauliflower', 'cabbage', 'kale', 'tomato'];

console.log(plants.pop()); // "tomato"

console.log(plants); //  ["broccoli", "cauliflower", "cabbage", "kale"]

plants.pop();

console.log(plants); // ["broccoli", "cauliflower", "cabbage"]

Array.prototype.unshift(element1, ..., elementN)

将一个或多个元素添加到数组的开头，并返回该数组的新长度(该方法修改原有数组)

const array1 = [1, 2, 3];

console.log(array1.unshift(4, 5));// 5

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

Array.prototype.shift()

从数组中删除第一个元素，并返回该元素的值。此方法更改数组的长度

const array1 = [1, 2, 3];

const firstElement = array1.shift();

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

console.log(firstElement);// 1

Array.prototype.sort([compareFunction])

用原地算法对数组的元素进行排序，并返回数组

compareFunction 用来指定按某种顺序进行排列的函数。如果省略，元素按照转换为的字符串的各个字符的Unicode位点进行排序。如果指明了 compareFunction ，那么数组会按照调用该函数的返回值排序。该方法接受两个参数：

1. firstEl 第一个用于比较的元素。

2. secondEl 第二个用于比较的元素。

必须保证compareFunction函数对相同的输入返回相同的比较结果，否则排序将是不确定， 若返回值小于 0 firstEl 会被排列到 secondEl 之前，若返回值大于 0 ， secondEl 会被排列到 firstEl 之前

const months = ['March', 'Jan', 'Feb', 'Dec'];
months.sort();
console.log(months);// ["Dec", "Feb", "Jan", "March"]

const array1 = [1, 30, 4, 21, 100000];
array1.sort();
console.log(array1);//[1, 100000, 21, 30, 4]

const array2 = [1, 30, 4, 21, 100000];
array1.sort(function (a, b) {
  return a - b; 
  // a > b 返回值大于零 a放在后面
  // a < b 返回值小于零 a放在前面
  // 该函数保证数字小的排在前面 实现 数字数组升序排列
});
console.log(array2); // [1,4,21,30, 100000]


const array3 = [1, 30, 4, 21, 100000];
array1.sort(function (a, b) {
  return b - a; 
  // a > b 返回值小于零 a放在前面
  // a < b 返回值大于零 a放在后
  // 该函数保证数字大的排在前面从而实现数字数组降序序排列
});
console.log(array3); // [100000, 30, 21, 4, 1]

Array.prototype.reverse()

将数组中元素的位置颠倒，并返回该数组。该方法会改变原数组

const array1 = ['one', 'two', 'three'];
console.log('array1:', array1);
//output: "array1:" Array ["one", "two", "three"]

Array.prototype.join([separator])

将一个数组（或一个类数组对象）的所有元素连接成一个字符串并返回这个字符串。

const elements = ['Fire', 'Air', 'Water'];

console.log(elements.join());
// output: "Fire,Air,Water"

console.log(elements.join(''));
// output: "FireAirWater"

console.log(elements.join('-'));
// output: "Fire-Air-Water"

Array.prototype.slice(start[,end])

返回数组的片段或子数组,从start开始到end(不包括end所对应的元素) 如果省略end参数,则截取到数组的最后一项

const animals = ['ant', 'bison', 'camel', 'duck', 'elephant'];

console.log(animals.slice(2)); // ["camel", "duck", "elephant"]

console.log(animals.slice(2, 4)); // ["camel", "duck"]

console.log(animals.slice(1, 5)); //  ["bison", "camel", "duck", "elephant"]

Array.prototype.splice(start[, deleteCount[, item1[, item2[, ...]]]])

在数组中插入,删除,替换的通用方法，,并以数组形式返回被修改的内容。此方法会改变原数组。

 var months = ['Jan', 'March', 'April', 'June'];
// 1 假如参数只有一个
months.splice(1);   // 删除从下标1开始，删除之后的全部
console.log("splice删除后的结果==>", months) 

// 2 有2个参数: 参数1 ==> 要删除的数组下标，参数2 ==> 要删除的个数
months.splice(1, 0);   // 删除从下标1开始，删除个数为0
console.log("splice删除后的结果==>", months)
months.splice(1, 2);   // 删除从下标1开始，删除个数为1
console.log("splice删除后的结果==>", months)

//3 有三个参数  ==> 变成替换，而非删除
months.splice(1, 1, "三月")      // 先删除一个下标为1的数组里面的数据，然后把"三月"插入
months.splice(1, 1, "三月","5月")      // 先删除一个下标为1的数组里面的数据，然后把"三月"插入
months.splice(1, 3, "三月", "5月")      // 先删除3个开始下标为1的数组里面的数据，然后把"三月"和"5月"插入
//不删除，直接插入多个数据
months.splice(2, 0, "1月", "2月", "3月")
console.log("使用splice三个参数后的结果==>", months)

Array.prototype.concat(value1[, value2[, ...[, valueN]]])

用于合并两个或多个数组。此方法不会更改现有数组，而是返回一个新数组

const array1 = ['a', 'b', 'c'];
const array2 = ['d', 'e', 'f'];
const array3 = array1.concat(array2);

console.log(array3);
//  output: Array ["a", "b", "c", "d", "e", "f"]

接下来是 ：ECMAScript5数组原型方法！！！！！

Array.prototype.indexOf(searchElement[, fromIndex])

返回在数组中可以找到一个给定元素的第一个索引，如果不存在，则返回-1。

const beasts = ['ant', 'bison', 'camel', 'duck', 'bison'];

console.log(beasts.indexOf('bison'));
// output: 1

// start from index 2
console.log(beasts.indexOf('bison', 2));
// output: 4

console.log(beasts.indexOf('giraffe'));
// output: -1

Array.prototype.lastIndexOf(searchElement[, fromIndex])

返回指定元素，在数组中的最后一个的索引，如果不存在则返回 -1。从数组的后面向前查找,从 fromIndex 处开始(默认数组最后一个元素)

const animals = ['Dodo', 'Tiger', 'Penguin', 'Dodo'];

console.log(animals.lastIndexOf('Dodo')); // 3

console.log(animals.lastIndexOf('Tiger')); // 1

Array.prototype.filter(callback(element[, index[, array]]))

过滤数组方法创建一个新数组, 其包含通过所提供函数实现的测试的所有元素

callback 用来测试数组的每个元素的函数。返回 true 表示该元素通过测试，保留该元素，false 则不保留。它接受以下三个参数：

1. element 自动遍历当前数组中当前正在处理的元素。
2. index 正在处理的元素在数组中的索引。
3. array 调用了 filter 的数组本身。
4. 根据返回 true 或者 false 来确定该值是否通过过滤

var arr3 = [12, 32, 45, 9, 59, 30];
var arr4 = arr3.filter(function (e, i, arr) {
       console.log("当前正在处理的元素==>", e)
       console.log("数组中的索引==>", i)
       console.log("数组本身==>", arr)
       return e > 30
    })
console.log("arr4 ==>", arr4)

Array.prototype.map(function callback(element[, index[, array]])

创建一个新数组，其结果是该数组中的每个元素是调用一次提供的函数后的返回值。

callback 生成新数组元素的函数。新数组中每一项对应函数每次调用后的返回值

1. element 自动遍历当前数组中当前正在处理的元素。
2. index 正在处理的元素在数组中的索引。
3. array 调用了 map 的数组本身。

该方法是没有起到过滤的作用的，如果要起到过滤则使用 filter 方法

var arr7 = [1, 4, 9, 16];
var arr8 = arr7.map(function (element, index, arr) {
      console.log("当前正在处理的元素==>", element)
      console.log("数组中的索引==>", index)
      console.log("数组本身==>", arr)
      return element * 2
})

Array.prototype.forEach(callback(currentValue [, index [, array]]))

遍历数组对数组的每个元素执行一次给定的函数。

为数组中每个元素执行的函数，该函数接收一至三个参数：

1. element 自动遍历当前数组中当前正在处理的元素。
2. index 正在处理的元素在数组中的索引。
3. array forEach() 方法正在操作的数组。

该方法只是遍历数组，并且不能使用 break 来退出循环

var arr9 = [45, 27, 56, 188, 24, , 4]
arr9.forEach(function (element, index, arr) {
     console.log("当前正在处理的元素==>", element)
     console.log("数组中的索引==>", index)
     console.log("方法正在操作的数组==>", arr)
})

接下来是ES6语法

ES6学习笔记四(数组)

以下三者用于遍历数组

Array.prototype.entries()

Array.prototype.keys()

Array.prototype.values()

Array.prototype.every()

测试一个数组内的所有元素是否都能通过某个指定函数的测试。它返回一个布尔值

/*
  数组中只要所有元素满足要求就返回 true
*/
const isBelowThreshold = (currentValue) => currentValue < 40;
const array1 = [1, 30, 39, 29, 10, 13];
console.log(array1.every(isBelowThreshold)); // true

Array.prototype.some()

测试数组中是不是至少有1个元素通过了被提供的函数测试

/*
  数组中只要一个元素满足要求就返回 true
*/
const array = [1, 2, 3, 4, 5];
const even = (element) => element % 2 === 0;
console.log(array.some(even)); // true

Array.prototype.toString()

返回一个字符串，表示指定的数组及其元素

const array1 = [1, 2, 'a', '1a'];
console.log(array1.toString()); // "1,2,a,1a"

Array.prototype.flatMap()

Array.prototype.reduce()

Array.prototype.toLocaleString()

欢迎访问我的个人博客