1.数组基础
什么是数组
- 数组是一系列有序数据的集合
- 也就是我们把一些数据放在一个盒子里面，按照顺序排好, 这个东西就是一个数组，存储着一些数据的集合
- [1, 2, 3, 'hello', true, false]
数组数据类型Array
我们简单的把所有数据类型分为两个大类 基本数据类型 和 复杂数据类型
- 基本数据类型： number / string / boolean / undefined / null
- 复杂数据类型： Object / Function / Array / ...
创建一个数组
- 数组就是一个 []
- 在 [] 里面存储着各种各样的数据，按照顺序依次排好
字面量创建一个数组
//创建一个空数组
var arr1 = []
//创建一个有内容的数组
var arr2 = [1,2,3]
内置构造函数创建数组
//创建一个空数组
var arr1 = new Array()
//创建一个长度为10的数组
var arr2 = new Array(10)
//创建一个有内容的数组
var arr3 = new Array(1，2,3)
数组的 length
- length: 长度的意思
- length 就是表示数组的长度，数组里面有多少个成员，length 就是多少
数组的索引
- 索引，也叫做下标，是指一个数据在数组里面排在第几个的位置
- 注意： 在所有的语言里面，索引都是从 0 开始的
- 在 js 里面也一样，数组的索引从 0 开始
//创建一个数组
var arr = ['hello','world']
在上面这个数组中，第0个数据就是字符串 'hello' ，第一个数据就是字符串 world 想获取数组中的第几个就使用数组[索引] 来获取
var arr = ['hello','world']
console.log(arr[0]) //hello
console.log(arr[1]) //world
数组遍历
- 因为数组的索引就可以获取数组中的内容
- 数组的索引又是按照 0 ～ n 顺序排列
- 我们就可以使用 for 循环来循环数组，因为 for 循环我们也可以设置成 0 ～ n 顺序增加
- 我们把这个行为叫做 遍历
var arr = [1,2,3,4,5]
//使用 for 循环遍历数组
for (var i = 0;i < arr.length; i++) {
console.log(arr[i])
}
//会在控台依次打印出 1, 2, 3, 4, 5
i < arr.length因为length就是数组的长度，就是一个数字，所以我们可以直接用它来决定循环次数console.log(arr[i])因为随着循环，i的值会从0开始依次增加- 所以我们实际上就是相当于在打印
arr[i]/arr[i]/...
2.数据类型之间存储的区别
- 我们的存储空间分成两种 栈 和 堆
- 栈： 主要存储基本数据类型的内容
- 堆： 主要存储复杂数据类型的内容
数据类型之间的比较
- 基本数据类型是 值 之间的比较
- 复杂数据类型是 地址 之间的比较
3.函数参数传递
基本数据类型和复杂数据类型的区别
- 因为复杂数据类型，变量存储的是地址，真实内容在 堆空间 内存储
- 所以赋值的时候相当于把 obj 存储的那个地址复制了一份给到了 obj2 变量
- 现在 obj 和 obj2 两个变量存储的地址一样，指向一个内存空间
- 所以使用 obj2 这个变量修改空间内的内容，obj 指向的空间也会跟着改变了
4. 数组的常用方法
push 是用来在数组的末尾追加一个元素
var arr=[1,2,3]
// 使用push方法追加一个元素在末尾
arr.push(4)
console.log(arr) //[1,2,3,4]
pop 是用来删除数组末尾的一个元素
var arr = [1, 2, 3]
arr.pop()
// 使用pop方法删除末尾的一个元素
console.log(arr) //[1,2]
unshift 是在数组的最前面添加一个元素
var arr = [1, 2, 3]
// 使用 unshift 方法数组的最前面添加一个元素
arr.unshift(4)
console.log(arr) //[4,1,2,3]
shift 是删除数组最前面的一个元素
var arr = [1, 2, 3]
// 使用shift方法删除数组最前面的一个元素
arr.shift()
console.log(arr)
splice 是截取数组中的某些内容，按照数组的索引来截取
- 语法： splice(从哪一个索引位置开始，截取多少个，替换的新元素) （第三个参数可以不写）
var arr = [1, 2, 3, 4, 5]
// 使用splice方法截取数组
arr.splice(1, 2)
console.log(arr) //[1,4,5]
arr.splice(1, 2)表示从索引1开始截取2个内容- 第三个参数没有写，就是没有新内容替换掉截取位置
var arr = [1, 2, 3, 4, 5]
// 使用splice方法截取数组
arr.splice(1,2,'我是最新内容')
console.log(arr) //[1,'我是最新内容',4,5]
arr.splice(1,2,'我是最新内容')表示从索引1开始截取2个内容- 然后用第三个参数把截取完空出来的位置填充
reverse 是用来反转数组使用的
var arr = [1, 2, 3]
// 使用reverse方法来反转数组
arr.reverse()
console.log(arr) //[3,2,1]
sort 是用来给数组排序的
var arr=[2,1,3]
// 使用sort方法给数组排序
arr.sort()
console.log(arr) //[1,2,3]
arr.sort(function(a,b){
return a - b
})
按字典顺序排序
- 排序默认由高到低，排序规则，按照字符编码unicode码
concat 是把多个数组进行拼接
- 和之前的方法有一些不一样的地方，就是 concat 不会改变原始数组，而是返回一个新的数组
var arr = [1, 2, 3]
// 使用concat方法来反转数组
var newArr = arr.concat([4, 5, 6])
console.log(arr) //[1,2,3]
console.log(newArr) //[1,2,3,4,5,6]
join 是把数组里面的每一项内容链接起来，变成一个字符串
- 可以自己定义每一项之间链接的内容 join(要以什么内容链接)
- 不会改变原始数组，而是把链接好的字符串返回
var arr = [1, 2, 3]
// 使用join方法来链接数组
var str = arr.join('-')
console.log(arr) //[1,2,3]
console.log(str) //1-2-3
- 注意： join方法不会改变原始数组，而是返回链接好的字符串
indexOf
indexOf用来找到数组中某一项的索引- 语法：
indexOf （你要找的数组中的项）
var arr = [1, 2, 3, 4, 5]
// 使用indexof方法来找数组中的某一项
var index = arr.indexOf(3)
console.log(index) // 2
- 我们要找的是数组中值为3的那一项
- 返回的就是值为3的那一项在该数组中的索引 如果你要找的内容在数组中没有，就会返回 -1
includes
检测数组site是否包含runoob：
let site = ['runoob', 'google', 'taobao']
site.includes('runoob')
// true
site.includes('baidu')
// false
5.ES5常用数组遍历方法
forEach
- 和 for 循环一个作用，就是用来遍历数组的
- 语法：arr.forEach(function (item, index, arr) {})
var arr = [1, 2, 3]
// 使用 forEach 遍历数组
arr.forEach(function (item, index, arr) {
// item就是数组中的每一项
// index就是数组索引
// arr就是原始数组
console.log('数组的第' + index + '项的值是' + item + ',原始数组是', arr);
})
- forEach()的时候传递的那个函数，会根据数组的长度执行
- 数组的长度是多少，这个函数就会执行多少回
map
和 forEach 类似，只不过可以对数组中的每一项进行操作，返回一个新的数组
var arr = [1, 2, 3]
// 使用 map 遍历数组
var newArr = arr.map(function (item, index, arr) {
// item就是数组中的每一项
// index就是数组索引
// arr就是原始数组
return item + 10
})
console.log(newArr) //[11,12,13]
filter
- 和 map 的使用方式类似，按照我们的条件来筛选数组
- 把原始数组中满足条件的筛选出来，组成一个新的数组返回
var arr = [1, 2, 3]
// 使用 filter 遍历数组
var newArr = arr.filter(function (item, index, arr) {
// item就是数组中的每一项
// index就是数组索引
// arr就是原始数组
return item > 1
})
console.log(newArr) //[11,12,13]
- 我们设置的条件就是
> 1 - 返回的新数组就会是原数组中所有
> 1的项
find
// 4.find 方式
var arr = [10, 11, 12, 13, 14, 15]
//find() 遍历数组返回数组中第一个满足条件的项
var newItem = arr.find(function (item, index) {
return item > 13
})
console.log(newItem)
every
- every：数组中是否每个元素都满足指定的条件, 全部满足返回true
some
- some:数组中是否有元素满足指定的条件,只要有一个满足返回true
reduce
累加器，数组中的每个值(从左至右) 开始合并，最终为一个值
let arr = [
{
name: 'jack',
score: 98
},
{
name: 'rose',
score: 88
},
{
name: 'tom',
score: 90
},
]
//计算总成绩
let total = arr.reduce((previousValue, currentValue) => currentValue.score + previousValue, 0)
console.log(total)
previousValue 上一个值，如果initValue存在，第一遍遍历时，previousValue就是initValue
7.数组的排序
排序
- 排序，就是把一个乱序的数组，通过我们的处理，让他变成一个有序的数组
- 两种方式来排序一个数组 冒泡排序 和 选择排序
冒泡排序
- 基本思想
比较相邻的元素。如果第一个比第二个大，就交换他们两个。 对每一对相邻元素作同样的工作，从开始第一对到结尾的最后一对。这步做完后，最后的元素会是最大的数。 针对所有的元素重复以上的步骤，除了最后一个。 持续每次对越来越少的元素重复上面的步骤，直到没有任何一对数字需要比较。
// 将下面的数进行排序，从小到大
var arr = [89, 98, 78, 68, 76]
//1.n个数进行n-1轮冒泡排序
var n = arr.length
//外层循环
for (var i = 0; i < n - 1; i++) {
//内层循环
for (var j = 0; j < n - 1 - i; j++) {
//相邻两个数，两两比较，前一个比后一个大，交换位置
if (arr[j] > arr[j + 1]) {
var temp = arr[j]
arr[j] = arr[j + 1]
arr[j + 1] = temp
}
}
console.log(arr)
}
console.log('排序后：', arr)
选择排序
- 基本思想：
首先在未排序序列中找到最小（大）元素，存放到排序序列的起始位置（交换位置） 再从剩余未排序元素中继续寻找最小（大）元素，然后放到已排序序列的末尾。 重复第二步，直到所有元素均排序完毕。
// 将下面的数进行排序，从小到大
var arr = [89, 98, 78, 68, 76]
// 0 1 2 3 4
var n = arr.length
//外层循环
for (var i = 0; i < n - 1; i++) {
//找最小数下标
var minIndex = i //假设最小数下标是第一个数
for (var j = i + 1; j < n; j++) {
if (arr[j] < arr[minIndex]) {
minIndex = j
}
}
//交换位置
var temp = arr[i]
arr[i] = arr[minIndex]
arr[minIndex] = temp
console.log('第' + (i + 1) + '次选择', arr)
}
console.log(arr)
数组去重
- 利用双重for循环+splice实现 外层循环遍历数组所有元素 内层循环依次判断后面元素是否与外层循环元素相同，如果相同，就截取掉
var arr = [9, 2, 5, 2, 8, 2, 5, 8]
for (var i = 0; i < arr.length; i++) {
var item = arr[i] //外层循环元素
for (var j = i + 1; j < arr.length; j++) {
if (item == arr[j]) {
arr.splice(j, 1)
}
}
}
console.log(arr)
