Array of JavaScript Basic Series (4)

Introduction to arrays

An array is a special variable that can hold one or more values.

create array

• Use array literals

var a = [1, 2, 3, 4]
复制代码

• Create with newkeywords

var a = new Array(1, 2, 3, 4)
复制代码

access array elements

Access via subscript

var b = a[0]
复制代码

change array element

a[0]= 5
复制代码

length property

a.length // 4

// 访问最后一个元素
a[a.length - 1]
复制代码

iterate over array elements

for loop

var a = [1, 2, 3, 4]
var sum = 0
for (var i = 0; i < a.length; i++) {
    sum += a[i]
}
console.log(sum) // 10
复制代码

forEach

forEach() The method calls the function (callback function) once for each array element. Receives three parameters: item value, item index, array itself

var a = [1, 2, 3, 4]
var sum = 0
a.forEach((item, index, self) => {
    console.log(item, index, self)
    console.log('this', this)
    sum = item + 10
})
console.log(sum)
console.log(a)
复制代码

map

• Create a new array by executing a function on each array element.
• The function will not be executed on array elements that have no value.
• The original array is not changed.

Receives three parameters: item value, item index, array itself

var a = [1, 2, 3, 4]
var b = a.map((item, index, self) => {
    console.log(item, index, self)
    console.log('this', this)
    return item + 10
})

console.log(b)
console.log(a)
复制代码

It can be seen forEachfrom mapthe similarities and differences between

The same:
- Traverse the array
- The parameters are the same
- thispoint to window\

Differences:
- mapwith a return value, the map() method will get a new array and return
- forEachno return value; return undefined. forEach()will modify the original array

filter

filter() method creates a new array containing the array elements that pass the test.
Receives three parameters: item value, item index, array itself

var a = [1, 2, 3, 4]
var b = a.filter(item => item > 3)
console.log(b)
复制代码

reduce

Run a function on each array element to produce (reduce it) a single value.
Works from left to right in an array.
The original array is not reduced.
Receives three parameters: total (initial value/previously returned value), item value, item index, array itself

var a = [1, 2, 3, 4]
var b = a.reduce((total, item, index, self) => {
    return total + item
})
console.log(b)
复制代码

reduce()method can accept an initial value

var a = [1, 2, 3, 4]
var b = a.reduce((total, item, index, self) => {
    return total + item
}, 100)
console.log(b)
复制代码

reduceRight()

Similar reduceto , except that works right to left in an array .

every

every() 方法检查所有数组值是否通过测试。
接收三个参数：项目值、项目索引、数组本身

some

some() 方法检查某些数组值是否通过了测试。
接收三个参数：项目值、项目索引、数组本身

find

find() 方法返回通过测试函数的第一个数组元素的值。
接收三个参数：项目值、项目索引、数组本身

var a = [{id: 1, name: 'A'}, {id: 2, name: 'B'}]
var b = a.find(item => item.id == 2)
console.log(b)
复制代码

findIndex

findIndex() 方法返回通过测试函数的第一个数组元素的索引。

var a = [{id: 1, name: 'A'}, {id: 2, name: 'B'}]
var b = a.findIndex(item => item.id == 2)
console.log(b)
复制代码

数组方法

数组转换为字符串

• toString() 把数组转换为数组值（逗号分隔）的字符串
• join(分隔符) 方法也可将所有数组元素结合为一个字符串,可以定义分隔符。

var a = ['A', 'B', 'C', 'D']
var b = a.toString()
var c = a.join(',')
console.log(b) // A,B,C,D
console.log(c) // A,B,C,D
复制代码

push - 添加元素

push() 方法（在数组结尾处）向数组添加一个新的元素。
push() 方法返回新数组的长度

var a = ['A', 'B', 'C', 'D']
a.push('E')
console.log(a) // ["A", "B", "C", "D", "E"]
console.log(a.push()) // 5
var b = a.push('F')
console.log(b) // 6
复制代码

pop - 删除元素

pop() 方法从数组中删除最后一个元素。

var a = ['A', 'B', 'C', 'D']
a.pop()
console.log(a) // ["A", "B", "C"]
var b = a.pop()
console.log(b) // C
复制代码

位移元素

shift

shift() 方法会删除首个数组元素，并把所有其他元素“位移”到更低的索引。

var a = ['A', 'B', 'C', 'D']
var b = a.shift()
console.log(b) // A
console.log(a) //["B", "C", "D"]
复制代码

unshift

unshift() 方法**（在开头）向数组添加新元素**，并“反向位移”旧元素。
unshift() 方法返回新数组的长度。

var a = ['A', 'B', 'C', 'D']
a.unshift('A+')
console.log(a) // ["A+", "A", "B", "C", "D"]
console.log(a.unshift()) // 5
复制代码

splice - 删除、拼接

删除
两个参数：开始位置、删除几项

var a = ['A', 'B', 'C', 'D']
a.splice(2, 2)
console.log(a) // ["A", "B"]
复制代码

拼接
参数：开始位置、删除几项、添加的元素

var a = ['A', 'B', 'C', 'D']
a.splice(2, 2, 'E', 'F', 'G', 'H')
console.log(a) //  ["A", "B", "E", "F", "G", "H"]

// 替换
a.splice(2, 1, 'C')
console.log(a) // ["A", "B", "C", "F", "G", "H"]
复制代码

concat - 数组合并

concat() 方法通过合并（连接）现有数组来创建一个新数组。

var a = [1, 2, 3]
var b = [4, 5, 6]
console.log(a.concat(b)) // [1, 2, 3, 4, 5, 6]
复制代码

slice - 数组裁剪

slice() 方法用数组的某个片段切出新数组。
两个参数： 开始位置、结束位置（不包括结束位置元素）; 若不设置结束位置，就会从开始位置截取余下所有元素。

var a = [1, 2, 3, 4, 5]
console.log(a.slice(2, 3))
console.log(a.slice(2))
复制代码

indexOf

indexOf() 方法在数组中搜索元素值并返回其位置。
参数indexOf(item, start) 要检索的元素、开始位置（可选）。
若找到元素返回对应下标；若未找到元素返回-1。
从数组开始向结尾检索。

lastIndexOf lastIndexOf() 与 indexOf() 类似，区别在于，从结尾向开始检索

sort - 数字排序

sort() 对数组进行排序；数字则是升序，字母以字母顺序。

var a = [6, 1, 2, 8, 4]
console.log(a.sort()) // [1, 2, 4, 6, 8]
var b = ['a', 'g', 'j', 'd', 'c']
console.log(b.sort()) // "a", "c", "d", "g", "j"]
复制代码

reverse reverse() 反转数组中的元素。

var a = [6, 1, 2, 8, 4]
console.log(a.sort().reverse()) // [8, 6, 4, 2, 1]
复制代码

比值函数

比较函数的目的是定义另一种排序顺序。

// 降序
var arr = [6, 1, 2, 8, 4]
arr.sort(function(a, b) {return b - a})
console.log(arr) // [8, 6, 4, 2, 1]
console.log(arr[0]) 最大值
console.log(arr[arr.length - 1]) // 最小值

// 以随机顺序排序数组
arr.sort(function(a, b){return 0.5 - Math.random()})
console.log(arr)

// 查找数组中最大值
var max =Math.max.apply(null, arr)
console.log(max) // 8

// 查找数组中最小值
var min = Math.min.apply(null, arr)
console.log(min) // 1
复制代码