Js日常笔记之数组

小程序：扫一扫查出行
【扫一扫了解最新限行尾号】
复制小程序

1、Array构造函数有一个很大的问题，就是不同的参数，会导致它的行为不一致，es6好像专门为此对数组有升级

因此，不建议使用new Array生成新数组，直接使用数组字面量[...]是更好的做法。

2、Array.isArray方法用来判断一个值是否为数组。它可以弥补typeof运算符的不足

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

3、push()和pop() 结合使用，就构成了“后进先出”的栈结构（stack）

push方法用于在数组的末端添加一个或多个元素，并返回添加新元素后的数组长度,

pop方法用于删除数组的最后一个元素，并返回该元素。

4、join()方法以参数作为分隔符，将所有数组成员组成一个字符串返回。如果不提供参数，默认用逗号分隔。

如果数组成员是undefined或null或空位，会被转成空字符串

[undefined, null].join('#')
// '#'['a',, 'b'].join('-')
// 'a--b'

通过call方法，这个方法也可以用于字符串

Array.prototype.join.call('hello', '-')
// "h-e-l-l-o"

5、concat()方法用于多个数组的合并。返回一个新数组，原数组不变。

concat也可以接受其他类型的值作为参数。它们会作为新的元素，添加数组尾部。

[1, 2, 3].concat(4, 5, 6)
// [1, 2, 3, 4, 5, 6]// 等同于
[1, 2, 3].concat(4, [5, 6])
[1, 2, 3].concat([4], [5, 6])

注意：concat方法返回当前数组的一个浅拷贝，如果数组中存在复合类型数据（比如对象），原数据改变，数组元素也会随之改变；

let d={a:1}
a=a.concat(d)
//(8) [{…}, 2, "a", "b", true, 4, 5, {…}]a[7]//{a: 1}
d.a=3//3
a[7]//{a: 3}

6、shift()和unshift()

shift方法用于删除数组的第一个元素，并返回该元素。push和shift结合使用，就构成了“先进先出”的队列结构（queue）

unshift方法用于在数组的第一个位置添加一个或多个元素，并返回添加新元素后的数组长度

var arr = [ 'c', 'd' ];
arr.unshift('a', 'b') // 4
arr // [ 'a', 'b', 'c', 'd' ]

7、slice()和splice()

slice方法用于提取原数组的一部分，返回一个新数组，原数组不变。

// 格式
arr.slice(start_index, upto_index);// 用法
var a = ['a', 'b', 'c'];a.slice(0) // ["a", "b", "c"]
a.slice(1) // ["b", "c"]
a.slice(1, 2) // ["b"]
a.slice() // ["a", "b", "c"]///如果slice方法的参数是负数，则表示倒数计算的位置。
var a = ['a', 'b', 'c'];
a.slice(-2) // ["b", "c"]
a.slice(-2, -1) // ["b"]

splice方法用于删除原数组的一部分成员，并可以在被删除的位置添加入新的数组成员，返回值是被删除的元素。

splice的第一个参数是删除的起始位置，第二个参数是被删除的元素个数。如果后面还有更多的参数，则表示这些就是要被插入数组的新元素。

var a = ['a', 'b', 'c', 'd', 'e', 'f'];
a.splice(4, 2, 1, 2) // ["e", "f"]//从e开始删除2个元素，再插入后面的参数
a // ["a", "b", "c", "d", 1, 2]///起始位置如果是负数，就表示从倒数位置开始删除。
var a = ['a', 'b', 'c', 'd', 'e', 'f'];
a.splice(-4, 2) // ["c", "d"]///常见用法，第二个参数给0，在指定位置插入新元素
var a = [1, 1, 1];
a.splice(1, 0, 2) // []
a // [1, 2, 1, 1]

8、reverse()和sort()，之所以两个一起说，是因为二者都是封装了一个常用的遍历算法

reverse方法用于颠倒数组中元素的顺序，返回改变后的数组。

sort方法对数组成员进行排序，默认是按照字典顺序排序。数值会被先转成字符串，再按照字典顺序进行比较

sort方法可以传入一个函数作为参数，表示按照自定义方法进行排序

[
{ name: "张三", age: 30 },
{ name: "李四", age: 24 },
{ name: "王五", age: 28 }
].sort(function (o1, o2) {
return o1.age - o2.age;//a>b则调换位置，实现从小到大的排序
})
// [
// { name: "李四", age: 24 },
// { name: "王五", age: 28 },
// { name: "张三", age: 30 }
// ]

9、forEach()和map()

相同点：都是遍历数组的所有成员，依次调用一个函数，执行某种操作

区别：map方法会根据函数结果返回一个新数组，而forEach没有返回值

注意：forEach方法无法中断执行，总是会将所有成员遍历完

///map用法
[1, 2, 3].map(function(elem, index, arr) {
return elem * index;
});
// [0, 2, 6]///forEach用法
function log(element, index, array) {
console.log('[' + index + '] = ' + element);
}
[2, 5, 9].forEach(log);
// [0] = 2
// [1] = 5
// [2] = 9

map方法还可以接受第二个参数，表示回调函数执行时this所指向的对象。

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

对应的，forEach方法也可以接受第二个参数，用来绑定回调函数的this关键字。这个参数对于多层this非常有用，因为多层this通常指向是不一致的

10、filter()，过滤出满足某种条件的元素

参数是一个函数，所有数组成员依次执行该函数，返回结果为true的成员组成一个新数组返回

[1, 2, 3, 4, 5].filter(function (elem) {
return (elem > 3);
})
// [4, 5]

11、some()和every()这两个方法类似“断言”（assert），用来判断数组成员是否部分或者全部符合某种条件。

它们接受一个函数作为参数，所有数组成员依次执行该函数，返回一个布尔值

some方法是只要有一个数组成员的返回值是true，则整个some方法的返回值就是true，否则false。

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

var arr = [1, 2, 3, 4, 5];arr.some(function (elem, index, arr) {
return elem >= 3;
});
// true
arr.every(function (elem, index, arr) {
return elem >= 3;
});
// false

some和every方法还可以接受第二个参数，用来绑定函数中的this关键字。

12、reduce()和reduceRight()

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

它们的差别是，reduce是从左到右处理（从第一个成员到最后一个成员），reduceRight则是从右到左（从最后一个成员到第一个成员），其他完全一样。

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

13、indexOf()和lastIndexOf()

分别返回给定元素在数组中第一次和最后一次出现的位置，如果没有出现则返回-1

['a', 'b', 'c'].indexOf('a', 1) // -1
//indexOf方法还可以接受第二个参数，表示搜索的开始位置

注意，如果数组中包含NaN，这两个方法不适用，即无法确定数组成员是否包含NaN

这是因为这两个方法内部，使用严格相等运算符（===）进行比较，而NaN是唯一一个不等于自身的值