JavaScript基础复习6-Array

Front-End

发布日期: 2018-11-05

阅读次数:

Array

Array作为构造函数，行为很不一致。因此，不建议使用它生成新数组，直接使用数组字面量是更好的做法。

var a = new Array(3);
var b = [undefined, undefined, undefined];

a.length // 3
b.length // 3

a[0] // undefined
b[0] // undefined

0 in a // false
0 in b // true

上面代码中，a是一个长度为3的空数组，b是一个三个成员都是undefined的数组。读取键值的时候，a和b都返回undefined，但是a的键位都是空的，b的键位是有值的。

静态方法

Array.isArray()

返回一个布尔值, 表示是否为数组. 可以弥补typeof的不足

var arr = [1, 2, 3];
typeof arr // object
Array.isArray(arr) // true

实例方法

push pop
shift unshift
join
concat
reverse
slice
splice
sort
map
forEach
filter
some every
reduce reduceRight
indexOf lastIndexOf

其中会改变原数组的有

push / pop / shift / unshift / reverse / splice / sort

slice()

提取目标数组的一部分, 返回一个新数组, 原数组不变.

arr.slice(start, end) : 包前不包后原则; 如果没有参数,则返回一个原数组的拷贝;

es5的伪数组转数组: 为什么要转伪数组呢: 伪数组是类似数组形式的对象,但是没有数组实例的方法.

Array.prototype.slice.call(likeArray)

splice()

用于删除原数组的一部分成员,并在删除的位置添加新的数组成员. 返回值是被删除的元素, 改变原数组.

第一个参数: 删除的起始位置(0开始), 第二个是被删除的个数, 后面依次是被添加的元素.

单纯的想插入元素可以把第二个参数设为0;

sort()

排序默认是按照字典排序的, 原数组改变, 小到大;

如果想按照自定义的排序方式, 可以传入一个函数作为参数;

var a = [10111, 1101, 111];

a.sort() // [10111, 1101, 111];

a.sort((a, b)=> a - b);  // [111, 1101, 10111]

上面代码中，sort的参数函数本身接受两个参数，表示进行比较的两个数组成员。如果该函数的返回值大于0，表示第一个成员排在第二个成员后面；其他情况下，都是第一个元素排在第二个元素前面。

map()

map方法将数组的所有成员依次传入参数函数，然后把每一次的执行结果组成一个新数组返回, 原数组不变

map方法接受一个函数作为参数。该函数调用时，map方法向它传入三个参数：当前成员、当前位置和数组本身。

map还可以接受第二个参数, 用来绑定回调函数的this

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

[1, 2].map(function (e) {
  return this[e];
}, arr)
// ['b', 'c']

map方法不会跳过undefined和null，但是会跳过空位。

forEach() - 可以被map替代,

简单说和map类似, forEach方法不返回值，只用来操作数据。这就是说，如果数组遍历的目的是为了得到返回值，那么使用map方法，否则使用forEach方法。

forEach方法无法中断执行
forEach方法不会跳过undefined和null，但会跳过空位。

filter()

filter方法用于过滤数组成员, 满足条件的成员组成新数组返回. 不改变原数组;

var arr = [0, 1, 'a', false];

arr.filter(Boolean)
// [1, "a"]

上面代码中，filter方法返回数组arr里面所有布尔值为true的成员。

也可以接受第二个参数, 绑定this

some() every()

返回一个布尔值, 表示判断数组成员是否符合某种条件;

它们接受一个函数作为参数，所有数组成员依次执行该函数。该函数接受三个参数：当前成员、当前位置和整个数组，然后返回一个布尔值。

some方法只要有一个成员返回true, 则some方法的返回值就是 true, 否则返回false;

every方法是所有成员的返回值都是true，整个every方法才返回true，否则返回false。

注意，对于空数组，some方法返回false，every方法返回true，回调函数都不会执行。
some和every方法还可以接受第二个参数，用来绑定参数函数内部的this变量。

reduce() reduceRight()

reduce方法和reduceRight方法依次处理数组的每个成员，最终累计为一个值。

一个从左到右, 一个相反.

[1, 2, 3, 4, 5].reduce(function (a, b) {
  console.log(a, b);
  return a + b;
})
// 1 2
// 3 3
// 6 4
// 10 5
//最后结果：15

reduce方法和reduceRight方法的第一个参数都是一个函数。该函数接受以下四个参数。

累积变量，默认为数组的第一个成员
当前变量，默认为数组的第二个成员
当前位置（从0开始）
原数组

这四个参数之中，只有前两个是必须的，后两个则是可选的。

第二参数可选, 代表累计变量的初值 : 处理空数组时尤其有用

function add(prev, cur) {
  return prev + cur;
}

[].reduce(add)
// TypeError: Reduce of empty array with no initial value
[].reduce(add, 1)
// 1

上面代码中，由于空数组取不到初始值，reduce方法会报错。这时，加上第二个参数，就能保证总是会返回一个值。

由于这两个方法会遍历数组，所以实际上还可以用来做一些遍历相关的操作。比如，找出字符长度最长的数组成员。

function findLongest(entries) {
  return entries.reduce(function (longest, entry) {
    return entry.length > longest.length ? entry : longest;
  }, '');
}

findLongest(['aaa', 'bb', 'c']) // "aaa"