Learning Notes

# Methods Of Array

# 改变原数组的方法

  • push() 在数组尾部添加元素

  • pop() 在数组尾部删除元素

  • shift() 在数组头部删除元素

  • unshift() 在数组头部添加元素

  • splice()

    var arr = [1, 2, 3, 4, 5, 6, 7, 8];

//删除从0开始的第一个元素
arr.splice(0, 1); // [1]
arr; // [2, 3, 4, 5, 6, 7, 8]

//从1开始删除两个元素并用另外两个元素代替
arr.splice(1, 2, "3", "4"); // [3,4]
arr; //[2, "3", "4", 5, 6, 7, 8]

//单纯地插入元素
var a = [1, 1, 1];
a.splice(1, 0, 2); // []
a; // [1, 2, 1, 1]

//将数组分为两个部分
var a = [1, 2, 3, 4];
a.splice(2); // [3, 4]
a; // [1, 2]
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19

  • sort()

    var arr = [1, 3, 54, 2, 6, 3, 9, 4, 6];

arr.sort(); // [1, 2, 3, 3, 4, 54, 6, 6, 9]
arr; //[1, 2, 3, 3, 4, 54, 6, 6, 9]
// sort不是按照大小顺序排列, 而是先转换为字符串,
// 按照字典顺序排列, "54"中的"5"大于"4"且小于"6", 于是在4和6的中间
    1
    2
    3
    4
    5
    6

# 不改变原数组的方法

  • slice()

    var arr = [1, 2, 3, 4, 5, 6, 7, 8];

arr.slice(1, 4); // [2, 3, 4]
arr; // [1, 2, 3, 4, 5, 6, 7, 8]

// slice方法的一个重要应用，是将类似数组的对象转为真正的数组,
// 但ES6有其他更简单的办法, 那就是Array.from(arr)

Array.prototype.slice.call({ 0: "a", 1: "b", length: 2 });
// ['a', 'b']

Array.prototype.slice.call(document.querySelectorAll("div"));
Array.prototype.slice.call(arguments);
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13

  • concat() 将两个数组拼接在一起

  • map()

    var arr = [1, 2, 3];

arr.map(n => n + 1); // [2, 3, 4]
arr; // [1, 2, 3]

//map()的回调函数的第一个参数是数组元素, 第二个是元素位置, 第三个是原数组

arr.map((elem, index, arr) => elem * index); // [0, 2, 6]
arr; // [1, 2, 3]

//map()第一个元素接受一个回调函数, 第二个参数是给回调函数内部的this指向

var arr = ["a", "b", "c"];

[1, 2].map(function(e) {
  return this[e];
}, arr);
// ['b', 'c']
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18

  • forEach()

    var arr = [1, 2, 3, 4, 5];
arr.forEach((elem, index, arr) => {
  console.log(`arr[${index}] = ${elem}`);
});

/*
 *arr[0] = 1
 *arr[1] = 2
 *arr[2] = 3
 *arr[3] = 4
 *arr[4] = 5
 */

//和map()一样, foreach()第二个参数是回调函数内部的this指向

var out = [];

[1, 2, 3].forEach(function(elem) {
  this.push(elem * elem);
}, out);

out; // [1, 4, 9]

//forEach()循环不能中断
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24

  • filter()

    根据条件过滤数组, 回调函数的三个参数的意义和filter() 的第二个参数的意义和map()和forEach()是一样的

  • some() & every()

    这两个方法类似“断言”（assert），返回一个布尔值，表示判断数组成员是否符合某种条件

  • reduce() & reduceRight()

    [1, 2, 3, 4, 5].reduce(function(a, b) {
  console.log(a, b);
  return a + b;
}, 10);

// 1 2
// 3 3
// 6 4
// 10 5
//最后结果：15

//reduceRight()无非就是从右边开始罢了

//reduce()指定第二个参数为初始值

var arr = [1, 2, 3, 4, 5];
arr.reduce((a, b) => {
  console.log(a, b);
  return a + b;
}, 10);

// 10 1
// 11 2
// 13 3
// 16 4
// 20 5
// 25
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27

  • indexOf() & lastindexOf()

    // indexOf方法返回给定元素在数组中第一次出现的位置，如果没有出现则返回-1

var a = ["a", "b", "c"];

a.indexOf("b"); // 1
a.indexOf("y") // -1

  [
    //indexOf方法还可以接受第二个参数，表示搜索的开始位置。

    ("a", "b", "c")
  ].indexOf("a", 1); // -1

// lastIndexOf方法返回给定元素在数组中最后一次出现的位置，如果没有出现则返回-1

var a = [2, 5, 9, 2];
a.lastIndexOf(2); // 3
a.lastIndexOf(7); // -1
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18

← Iterator →