MDN
学习JS的时候一定要善用MDN查API
假如我们想要查全局函数Array, 我们可以在google中输入'array mdn'
数组
什么是数组
看下图, 数组本质上还是一个对象, 只不过数组有两个显著的特征
- 数组的
__proto__指向Array构造函数, 继承了很多数组特有的方法 - 数组的
length动态变化, 数组会随着元素的增加实时改变length
除了这两个显著的特点, 数组跟对象差别不大
使用Array()直接生成数组
给Array()一个数字作为参数时, 返回的是一个长度为该数字的空数组
let arr = Array(3)
a.length //3
a // [undefined, undefined, undefined]
给Array()一个以上数字作为参数时, 返回的是以这些数组组成的数组
let arr = Array(2,3,5,4)
a.length //4
a //[2,3,5,4]
对于对象,声明时时加不加new没有影响, 所以声明数组时加不加new不影响
let a = Array(2,3)
let b = new Array(2,3)
声明的数组a和b没有任何区别
但是基本类型加不加new是有区别的, 加new返回的是对象
let a = Number('123') // number
let b = new Number('123') //object
数组常用API
forEach
forEach(callback) 方法对数组的每个元素执行一次提供的函数。
参数
callback
为数组中每个元素执行的函数，该函数接收三个参数：
-
currentValue(当前值)
数组中正在处理的当前元素。 -
index(索引)
数组中正在处理的当前元素的索引。 -
array
forEach()方法正在操作的数组。
thisArg(可选)
可选参数。当执行回调 函数时用作this的值(参考对象)。
返回值
undefined
示例
function logArrayElements(element, index, array) {
console.log("a[" + index + "] = " + element);
}
// 注意索引2被跳过了，因为在数组的这个位置没有项
[2, 5, ,9].forEach(logArrayElements);
// a[0] = 2
// a[1] = 5
// a[3] = 9
[2, 5,"" ,9].forEach(logArrayElements);
// a[0] = 2
// a[1] = 5
// a[2] =
// a[3] = 9
[2, 5, undefined ,9].forEach(logArrayElements);
// a[0] = 2
// a[1] = 5
// a[2] = undefined
// a[3] = 9
let xxx;
// undefined
[2, 5, xxx ,9].forEach(logArrayElements);
// a[0] = 2
// a[1] = 5
// a[2] = undefined
// a[3] = 9
我们来实现一个forEach
let arr = [1,2,3,4]
arr.forEach = function(fn) {
for(let i=0; imap
map 方法跟forEach类似, 最大的区别就是map会返回一个调用过函数的数组
map()方法创建一个新数组，其结果是该数组中的每个元素都调用一个提供的函数后返回的结果。
语法
let new_array = arr.map(function callback(currentValue, index, array) {
// Return element for new_array
}[, thisArg])
参数
callback
为数组中每个元素执行的函数，该函数接收三个参数：
-
currentValue(当前值)
数组中正在处理的当前元素。 -
index(索引)
数组中正在处理的当前元素的索引。 -
array
forEach()方法正在操作的数组。
thisArg(可选)
可选参数。当执行回调 函数时用作this的值(参考对象)。
返回值
一个新数组，每个元素都是回调函数的结果
示例
var numbers = [1, 4, 9];
var roots = numbers.map(Math.sqrt);
// roots的值为[1, 2, 3], numbers的值仍为[1, 4, 9]
filter
filter()方法创建一个新数组, 其包含通过所提供函数实现的测试的所有元素。
语法
let new_array = arr.filter(callback[, thisArg])
参数
callback
用来测试数组的每个元素的函数。调用时使用参数 (element, index, array)。
返回true表示保留该元素（通过测试），false则不保留。
thisArg
可选。执行 callback 时的用于 this 的值。
返回值
一个新的通过测试的元素的集合的数组
示例
删选过滤掉所有的小值
function isBigEnough(element) {
return element >= 10;
}
let filtered = [12, 5, 8, 130, 44].filter(isBigEnough);
// filtered is [12, 130, 44]
reduce
reduce()方法对累加器和数组中的每个元素（从左到右）应用一个函数，将其减少为单个值。
语法
arr.reduce(callback[, initialValue])
参数
callback
执行数组中每个值的函数，包含四个参数：
-
accumulator
累加器累加回调的返回值; 它是上一次调用回调时返回的累积值，或initialValue（如下所示）。 -
currentValue
数组中正在处理的元素。 -
currentIndex(可选)
数组中正在处理的当前元素的索引。 如果提供了initialValue，则索引号为0，否则为索引为1。 -
array(可选)
调用reduce的数组
initialValue(可选)
用作第一个调用 callback的第一个参数的值。 如果没有提供初始值，则将使用数组中的第一个元素。 在没有初始值的空数组上调用 reduce 将报错。
返回值
函数累计处理的结果
示例
reduce如何运行
[0, 1, 2, 3, 4].reduce((accumulator, currentValue, currentIndex, array) => {
return accumulator + currentValue
})
callback 被调用四次，每次调用的参数和返回值如下表：
| callback | accumulator | currentValue | currentIndex | array | return value |
|---|---|---|---|---|---|
| first call | 0 | 1 | 1 | [0, 1, 2, 3, 4] | 1 |
| second call | 1 | 2 | 2 | [0, 1, 2, 3, 4] | 3 |
| third call | 3 | 3 | 3 | [0, 1, 2, 3, 4] | 6 |
| fourth call | 6 | 4 | 4 | [0, 1, 2, 3, 4] | 10 |
sort
sort(compareFunction) 对数组自身排序, 接收一个函数
参数
compareFunction
可选。用来指定按某种顺序进行排列的函数。如果省略，元素按照转换为的字符串的各个字符的Unicode位点进行排序。
- 如果
compareFunction(a, b)小于 0 ，那么 a 会被排列到 b 之前； - 如果
compareFunction(a, b)等于 0 ， a 和 b 的相对位置不变。备注： ECMAScript 标准并不保证这一行为，而且也不是所有浏览器都会遵守（例如 Mozilla 在 2003 年之前的版本）； - 如果
compareFunction(a, b)大于 0 ， b 会被排列到 a 之前。 -
compareFunction(a, b)必须总是对相同的输入返回相同的比较结果，否则排序的结果将是不确定的。
返回值
返回排序后的数组。原数组已经被排序后的数组代替。
var numbers = [4, 2, 5, 1, 3];
numbers.sort((a, b) => a - b);
console.log(numbers);
// [1, 2, 3, 4, 5]
join
join('separator')方法将一个数组（或一个类数组对象）的所有元素连接成一个字符串并返回这个字符串。不会改变数组！
参数
separator
- 指定一个字符串来分隔数组的每个元素。
- 如果需要(separator)，将分隔符转换为字符串。
- 如果省略()，数组元素用逗号分隔。默认为 ","。
- 如果separator是空字符串("")，则所有元素之间都没有任何字符。
返回值
一个所有数组元素连接的字符串。如果 arr.length 为0，则返回空字符串
示例
let a = ['Wind', 'Rain', 'Fire']
let myVar1 = a.join() // myVar1的值变为"Wind,Rain,Fire"
let myVar2 = a.join(', ') // myVar2的值变为"Wind, Rain, Fire"
let myVar3 = a.join(' + ') // myVar3的值变为"Wind + Rain + Fire"
let myVar4 = a.join('') // myVar4的值变为"WindRainFire"
concat
concat()方法用于合并两个或多个数组。此方法不会更改现有数组，而是返回一个新数组。
语法
let new_array = old_array.concat(value1[, value2[, ...[, valueN]]])
参数
valueN
将数组和/或值连接成新数组。
返回值
新的 Array 实例。
示例
let alpha = ['a', 'b', 'c'];
let numeric = [1, 2, 3];
alpha.concat(numeric);
// result in ['a', 'b', 'c', 1, 2, 3]