数组与数组方法
数组 创建 字面量创建 Array()函数创建 const a1 = ["fengfeng", "zhangsan", "lisi"] // index 0

数组与数组方法

发布时间:2024-07-01 (2024-07-01)

数组

创建

  1. 字面量创建
  2. Array()函数创建
const a1 = ["fengfeng", "zhangsan", "lisi"]
// index      0              1        2
console.log(a1[0]) // 获取数组的第一个元素
console.log(a1.length) // 获取数组的长度=数组中元素的个数
console.log(a1[a1.length - 1]) // 获取数组的最后一个元素
const a2 = Array("fengfeng", "zhangsan", "lisi")
console.log(a2)

索引

  1. 索引从0开始

遍历数组

for i

for (let i = 0; i < a1.length; i++) {
    console.log(i, a1[i])
}

for of

遍历数组最常用方法

for (const value of a2) {
    console.log(value)
}

判断一个对象是不是数组

typeof 数组得到的结果是object。因为数组本质就是对象

Array.isArray()

console.log(Array.isArray(a1)) // true
console.log(Array.isArray(1)) // false

instanceof

console.log(a1 instanceof Array) // true

数组方法

push()、pop()方法

push

数组末端添加一个或多个元素,返回添加之后数组的长度

const a1 = ["fengfeng", "zhangsan", "lisi"]
a1.push("王五")
const l = a1.push("z1", "z2")
console.log(l, a1)

pop

移除数组末端的元素,并返回

const a2 = ["fengfeng", "zhangsan", "lisi"]
const item = a2.pop()
console.log(item, a2)

shift()、unshift()方法

shift

从数组最左端移出元素,并返回移出的元素

const a3 = ["fengfeng", "zhangsan", "lisi"]
const fi = a3.shift()
console.log(fi, a3)

unshift

在数组的开头插入新元素,并返回数组的新长度

const a4 = ["fengfeng", "zhangsan", "lisi"]
const l1 = a4.unshift("小红")
console.log(l1, a4)

join()方法

将数组的所有元素添加到由指定的分隔符字符串分隔的字符串中。

const a5 = ["fengfeng", "zhangsan", "lisi"]

const s = a5.join(",")
console.log(s) // fengfeng,zhangsan,lisi
console.log(a5.join()) // 默认就是,
console.log(a5.join("|")) // fengfeng|zhangsan|lisi

sort()方法

默认是升序

const a6 = [4, 2, 1, 5]
const a7 = a6.sort() // 升序
console.log(a6, a7)

可以通过reverse()反转得到降序

const a8 = a6.reverse() // 反转
console.log(a8, a6)

高级用法

return 正值和0不变

return 负值就交换

const a6 = [0, 2, 1, 5]

// [4, 2, 1, 5] a-b  2-4=-2 2,4 升序
//  [4, 2, 1, 5] b-a 4-2=2 4,2 降序
//  [0, 2, 1, 5] a-b 2-0=2 0,2 升序
//  [0, 2, 1, 5] b-a 0-2=-2 2,0 降序
a6.sort(function (a, b){
    console.log(a, b)
    return b-a
})
console.log(a6)

a-b 升序

b-a 降序

splice()方法

用于删除数组中的元素,并且返回被删除的数组

const a7 = ["fengfeng", "zhangsan", "lisi"]
const a8 = a7.splice(1, 1)
console.log(a8) // 被删除的数组  ["zhangsan"]  
console.log(a7) // 原位删除 ["fengfeng","lisi"]

以下是ES6新增的数组方法

forEach()方法

const a1 = ["fengfeng", "zhangsan", "lisi"]
a1.forEach(function (value, index, array){
    console.log(value, index, array)
})
  1. 不能中途退出

map()方法

迭代每一个元素,去进行操作

const a2 = a1.map(function (value, index, array){
    return value + "@qq.com"
})
console.log(a2) // ['fengfeng@qq.com', 'zhangsan@qq.com', 'lisi@qq.com'] 不会原位修改

filter()方法

过滤

const a3 = a1.filter(function (value, index, array){
    if (value === "zhangsan"){
        return true
    }
})
console.log(a3) // ['zhangsan']

every()方法、some()方法

every:判断数组中是不是 每一个 都满足条件

some:判断数组中 其中一个 满足条件

const a4 = [5, 1, 0, -1, 2]
console.log(a4.every(function (value){
    if (value >= 0){
        return true
    }
}))  // false

console.log(a4.some(function (value){
    if (value >= 0){
        return true
    }
})) // true

find()方法

获取数组中满足条件的数据,如果有 就是满足条件的第一个数据;如果没有就是undefined

const a5 = [5, 1, 0, -1, 2]
const item = a5.find(function (value, index, obj){
    if (value >= 5){
        return true
    }
})
console.log(item) // 5 找不到就是undefined
const index = a5.findIndex(function (value, index, obj){
    if (value >= 5){
        return true
    }
})
console.log(index) // 0 找不到就是-1