定义一个数组
对象是js里面一个大的范畴,而对象的呈现形式是多种多样的,数组也属于对象这个类型下的一个分支,因此返回的类型就是对象
var arr = ['111', 'ddd', '小小小']
console.log(typeof arr) // object
数组的操作
- 获取数组元素
var arr = ['111', 'ddd', '小小小', '火辣', '甜妹', '御姐', '姨']
console.log(arr[0])
console.log(arr[1])
希望获取到最后一个数组元素?
数组.length-1
2. 设置数组元素(不存在的下标,如果是存在的下标就变成替换--修改)
arr[6] = '哈哈'
// arr[8] = '嘻嘻'
- 修改(替换)
arr[5] = '呵呵'
- 删除,要使用系统关键字delete(删除后数组元素的位置依旧存在)
delete arr[5]
console.log(arr)
数组遍历
第一种方式直接使用for循环
var arr = [['111', 'ddd', '小小小', '内敛的', '火辣', '甜妹', '御姐', '姨']
for(var i=0; i<arr.length; i++){
document.write('<h1>'+arr[i]+'</h1>')
}
第二种遍历方式 for in
var arr = [['111', 'ddd', '小小小', '内敛的', '火辣', '甜妹', '御姐', '姨']
for(var i in arr){
console.log(arr[i])
}
for和for in区别
- for方式可以指定遍历的开始和结束位置
- for in方式无法指导遍历的开始和结束位置
- for不能遍历对象,而for in可以遍历对象
- for下标数据类型是number
- for in下标数据类型string
练习
将数组中数字内容求和,数组[10, 2, 6, 20, 6]
var arr = [10, 2, 6, 20, 6, 10]
var sum = 0
for(var i=0; i<arr.length; i++){
sum += arr[i]
}
console.log(sum)
已知数组[3, 5, -2, 7, 4],获取数组中最大的值并打印 --- 并改成函数形式
var data = [3, 5, -2, 7, 12, 4]
// 注意点:函数的实参和形参名称可以是一样的
function getMax(arr){
// 假设第一个数组元素是最大值
var max = arr[0]
// 遍历
for(var i=0; i<arr.length; i++){
// 比较
if(arr[i]>max){
max = arr[i]
}
}
// 把最大值返回给外界
return max
}
var res = getMax(data)
console.log(res)
数组方法
shift():
删除数组中第一个元素,并将长度减1.
var arr = ['张三', '李四', '成成', '俊俊骏']
arr.shift()
pop():
删除数组中最后一个元素,并将长度减1.
arr.pop()
unshift():
往数组前面添加一个或多个数组元素,长度要改变。
arr.unshift('123', '嘿嘿', '嘻嘻')
push():
往数组结尾添加一个或多个数组元素,长度要改变。
arr.push('你好啊', 'hello')
实例
var arr = [1, 5, 6, 3, 8, 10, 7, 2]
var data = []
for(var i=0; i<arr.length; i++){
if(arr[i]%2==0){
data.push(arr[i])
}
}
console.log(data)
concat():
方法用于连接两个或多个数组, 不改变原数组。返回一个新的数组。
var age = [18, 20, 16, 21, 23]
var myName = ['王成', '张三']
var data = age.concat(myName, ['嘿嘿', '嘻嘻'])
console.log(data)
封装一个组合数据的方法
function myConcat(){
var data = []
for(var i=0; i<arguments.length; i++){
data = data.concat(arguments[i])
}
return data
}
var res = myConcat([1, 2, 3], ['你好', '嘻嘻'])
console.log(res)
reverse():
逆向排序, 原数组也被逆向排序了
var arr = ['张三', '李四', '成成', '俊俊骏']
var res = arr.reverse()
console.log(arr)
console.log(res)
var arr = ['张三', '李四', '成成', '俊俊骏']
for(var i=0; i<arr.length; i++){
document.write('<h1>'+arr[i]+'</h1>')
}
arr.reverse()
toString():
将数组转成字符串
var arr = ['张三', '李四', '成成', '俊俊骏']
var res = arr.toString()
console.log(res)
注意:加号运算符把其他类型转成字符串,就是默认调用了toString()方法
join(“拼接符”):
将数组转成字符串,中间以拼接符连接
var arr = ['张三', '李四', '成成', '俊俊骏']
var res = arr.join('-')
console.log(res)
注意:join()方法不传递参数,默认是以逗号隔开的。如果传递的是一个空字符串,那么字符和字符之间没有隔开符号了
slice(start,end):
不修改原数组, 将原数组中的指定区域数据提取出来。start开始 end结束。 如果参数是负值表示从倒数开始。不含结束位置
- 参数1表示开始的位置
- 参数2表示结束的位置(不包含,例如:到3结束,拿不到3那个位置的数据)
- 注意:如果给负值,那么会从倒数开始截取
var arr = ['成', '强', '俊骏', '烟友之家', '早点戒烟', '避免影响你的身体']
console.log(arr)
var data = []
for(var i=1; i<3; i++){
data.push(arr[i])
}
console.log(data)
var data = arr.slice(1, 3)
console.log(data)
var data = arr.slice(1, -2)
console.log(data)
splice():
删除、替换、增加
- 1表示从那个位置开始删除或者添加
- 2表示删除的项数,如果是新增的话那么第二个参数必须为0
- 3表示添加的数组内容
- 点:返回值是被删除掉的元素
var res = arr.splice(0, 2)
console.log(res)
// 删除功能
arr.splice(0, 2)
// 替换功能
arr.splice(1, 2, 'a', 'b')
// 添加功能
arr.splice(1, 0, 'a', 'b', 'c')
console.log(arr)
sort():
- 会进行字母排序
var arr = ['d', 'a', 'g', 'f', 'b']
var res = arr.sort()
console.log(arr)
console.log(res)
- 会对数字进行排序
var arr = [5, 1, 3, 2, 4, 6]
arr.sort()
console.log(arr)
- 注意:如果排序的数组中出现了两位以上的数字,那么它们在排序的时候会以数字的位数进行排序
var arr = [5, 1, 3, 12, 4, 6]
arr.sort()
console.log(arr)
为了解决以上的问题,官方给咱们提供了一种方式
a-b 如果它的值为正数,就交换它们的位置
b-a 如果值为正数,交换它们的位置
var arr = [5, 1, 3, 12, 4, 6]
// 要求给sort()方法传递一个函数作为参数,在作为参数的这个函数里面有一个a和b作为形参
// a - b 升序排列 ( b - a 降序排列)
var res = arr.sort(function(a, b){
return a - b
})
console.log(arr)
console.log(res)
常用总结
- push()
- concat()
- toString() 不是说咱们自己会经常用到,而是js会默认调用这个方法的次数比较多的
- slice() 截取数据
- splice() 组合方法(删除、添加、修改--替换) 把二维数组转成一维数组
练习
要求将数组中的0项去掉,将不为0的值存入一个新的数组
var arr = [0, 'a', 0, 'b', 0, 0, 'c', 0]
var data = []
// 思考1:为什么这里会存在删除不掉的情况
// 思考2:为什么结果里面会出现undefined
for(var i=0; i<arr.length; i++){
if(arr[i]==0){
arr.splice(i, 1)
}
data.push(arr[i])
}
for(var i=0; i<arr.length; i++){
if(arr[i]==0){
continue
}
data.push(arr[i])
}
console.log(data)
数组:数组嵌套数组
var arr = [['张三', '王成'], ['你好', 'hello']]
var data = []
for(var i=0; i<arr.length; i++){
data = data.concat(arr[i])
}
console.log(data)
// 读取二维数组
console.log(arr[0][0])
console.log(arr[0][1])
// 修改二位数
arr[1][0] = '王成成'
console.log(arr)
调函数
关于函数调用
- 函数名称加括号调用
- 通过事件调用函数
- 一个函数里面可以调用另一个函数
- 函数自己调用自己,就是递归
callback回调函数
- 简写:cb
- 把函数自身作为参数给另一个函数使用,当当前的函数执行完毕后,作为参数的函数再去执行,把这种情况称之为回调函数
- 作用
- 方便数据的传递
- 作为参数,可以处理的业务逻辑更多
function data(a, b){
console.log(a, b)
console.log('我是作为参数的函数')
}
function fn(callback){
callback(10, 20)
}
fn(data)
回调函数应用
计算器
// 有几个计算的方法
function add(num1, num2){
return num1 + num2
}
function sub(num1, num2){
return num1 - num2
}
function nul(num1, num2){
return num1 * num2
}
function dis(num1, num2){
return num1 / num2
}
// 可以利于回调函数把这几个计算方法进行整合处理
function calc(num1, num2, callback){
return callback(num1, num2)
}
var res = calc(10, 20, sub)
console.log(res)
冒泡排序
一组无限的数,两两依次进行比较,如果那个大就和小的交换位置,直到比较完毕
var arr = [5, 3, 7, 12, 1]
// 外层循环执行一次,内层循环执行一轮
// 外层循环控制的是轮数
// 注意点:外层循环长度-1,是由于四个数字其实只需要比较三轮就出结果了,最后一轮没有比较执行,因此-1
// count1表示的是外层循环的循环次数
var count1 = 0
// count2表示的是内层循环的循环次数
var count2 = 0
for(var i=0; i<arr.length-1; i++){
// 注意点:内层循环长度-1,是由于使用前面一个数和后面一个数进行比较,把下标长度每次比较时+1,因此多出了一个下标的值是取不出数组元素,所以-1
for(var j=0; j<arr.length-1-i;j++){
// 前面和后面进行比较
// 0 1
// 1 2
if(arr[j]>arr[j+1]){
//交换两个数的值
var temp
temp = arr[j]
arr[j] = arr[j+1]
arr[j+1] = temp
}
count2++
}
count1++
}
console.log(arr)
console.log('外层循环执行了'+count1+'次')
console.log('----------内层循环执行了'+count2+'次')