数组结构(跟着B站coderwhy老师视频学习笔记)

数组结构

1.数组的基本使用

创建和初始化数组

// 创建和初始化数组
var daysOfWeek = new Array(7)
var daysOfWeek = new Array('Sunday', 'Monday', 'Tuesday', 'Wednesday','Thursday', 'Friday', 'Saturday')

• 使用new关键字，就能简单地声明并初始化一个数组
• 用new创建数组并不是最好的方式。如果你想在JavaScript中创建一个数组，只用中括号（[]）的形式就行了

var daysOfWeek = ['Sunday', 'Monday', 'Tuesday', 'Wednesday','Thursday', 'Friday', 'Saturday'];

数组长度和遍历数组

用length属性获取数组长度

alert(daysOfWeek.length)

遍历数组

// 普通for方式遍历数组
for (var i = 0; i < daysOfWeek.length; i++) {
    alert(daysOfWeek[i])
}

// 通过foreach遍历数组
daysOfWeek.forEach(function (value) {
    alert(value)
})

练习

• 求菲波那切数列的前20个数字, 并且放在数组中.
• 菲波那切数列数列第一个数字是1, 第二个数字也是1, 第三项是前两项的和

//求菲波那切数列的前20个数字
var fb = [];
fb[0] = 1;
fb[1] = 1;
for (i = 2; i < 20; i++) {
    fb[i] = fb[i - 2] + fb[i - 1];
}
console.log(fb);

2.数组的常见操作

数组中常见的操作有: 添加元素、删除元素、修改元素、获取元素.

添加元素

初始化一个数组

// 初始化一个数组
var numbers = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]

添加一个元素到数组的最后位置:通过push()方法

// 添加一个元素到数组的最后位置
// 方式一:
numbers[numbers.length] = 10

// 方式二:push()方法
numbers.push(11)
numbers.push(12, 13)

alert(numbers)

在数组首位插入一个元素，使用unshift()方法

for (var i = numbers.length; i > 0; i--) {
    numbers[i] = numbers[i-1]
}
numbers[0] = -1
alert(numbers) // -1,0,1,2,3,4,5,6,7,8,9,10,11,12,13

// 通过unshift在首位插入数据
numbers.unshift(-2)
numbers.unshift(-4, -3)
alert(numbers) // -4,-3,-2,-1,0,1,2,3,4,5,6,7,8,9,10,11,12,13

删除元素

删除数组最后的元素, 可以使用pop()方法

numbers.pop()
alert(numbers) // -4,-3,-2,-1,0,1,2,3,4,5,6,7,8,9,10,11,12

删除数组第一个元素, 可以使用shift()方法

numbers.shift()
alert(numbers)

任意位置添加删除元素

通过splice()方法删除数据

numbers.splice(5, 3) //从索引为5的元素开始，删除索引为5，6，7的三个元素，数组索引从0开始
alert(numbers) // -4,-3,-2,-1,0,4,5,6,7,8,9,10,11,12,13

通过splice()方法添加数据

numbers.splice(5, 0, 3, 2, 1) //5表示从索引为5的位置开始插入，0表示插入数据，后面为要插入的数据
alert(numbers) // -4,-3,-2,-1,0,3,2,1,4,5,6,7,8,9,10,11,12,13

通过splice()方法替换数据

numbers.splice(5, 3, "a", "b", "c") //5表示从索引为5的位置开始替换，3表示替换的数据个数，后面的为要替换的数据
alert(numbers) // -4,-3,-2,-1,0,a,b,c,4,5,6,7,8,9,10,11,12,13

3.数组的其他操作

数组合并

使用concat或直接合并

// 数组的合并
var nums1 = [1, 2, 3]
var nums2 = [100, 200, 300]
var newNums = nums1.concat(nums2)
alert(newNums) // 1,2,3,100,200,300

newNums = nums1 + nums2
alert(newNums) // 1,2,3,100,200,300

迭代方法

every()方法

• every()方法是将数组中每一个元素传入到一个函数中, 该函数返回true/false
• 一旦有一次函数返回了false, 那么迭代就会结束. 并且结果为false
• every 不会改变原数组。

判断一组元素中是否都包含某一个字符

// 定义数组
var names = ["abc", "cb", "mba", "dna"]

// 判断数组的元素是否都包含a字符
var flag = names.every(function (t) {
    return t.indexOf('a') != -1//返回false
})
alert(flag)//输出false

some()方法

• some()方法是将数组中每一个元素传入到一个函数中, 该函数返回true/false
• 但是和every不同的是, 一旦有一次函数返回了true, 那么迭代就会结束. 并且结果为true

// 定义数组
var names = ["abc", "cb", "mba", "dna"]

// 判断数组中是否包含有a字符的字符
var flag = names.some(function (t) {
    alert(t)
    return t.indexOf("a") != -1 //返回true
})
alert(flag) //输出true

forEach()方法

forEach()方法仅仅是一种快速迭代数组的方式，没有返回值.

var names = ["abc", "cb", "mba", "dna"]

// forEach的使用
names.forEach(function (t) {
    console.log(t)  
}

filter()方法

• filter()方法是一种过滤的函数

• 首先会遍历数组中每一个元素传入到函数中

• 函数的结果返回true, 那么这个元素会被添加到最新的数组中, 返回false, 则忽略该元素.

• 最终会形成一个新的数组, 该数组就是filter()方法的返回值

var names = ["abc", "cb", "mba", "dna"]

// 获取names中所有包含'a'字符的元素
var newNames = names.filter(function (t) {
    return t.indexOf("a") != -1
})
console.log(newNames)//返回 ["abc","mba","dna"]

map()方法

• map()方法提供的是一种映射函数.

• 首先会遍历数组中每一个元素传入到函数中.

• 元素会经过函数中的指令进行各种变换, 生成新的元素, 并且将新的元素返回.

• 最终会将返回的所有元素形成一个新的数组, 该数组就是map()方法的返回值

var names = ["abc", "cb", "mba", "dna"]

// 在names中所有的元素后面拼接-abc
var newNames = names.map(function (t) {
    return t + "-abc"
})
consle.log(newNames)  //返回["abc-abc", "cb-abc", "mba-abc", "dna-abc"]

reduce()方法

使用方法array.reduce(function(total, currentValue, currentIndex, arr),initialValue)

定义：reduce() 方法为数组中的每一个元素依次执行回调函数，不包括数组中被删除或从未被赋值的元素，

total	必需。初始值, 或者上次调用函数的返回值
currentValue	必需。当前元素
currentIndex	可选。当前元素的索引
arr	可选。当前元素所属的数组对象。
initialValue	可选。传递给函数的初始值

求一个数组的累加和

var arr = [1, 3, 4, 5, 6, 7];
var sum = arr.reduce(function(total, currentValue) {
    return total + currentValue
}, 0)
console.log(sum); //输出26