javascript—数组的属性和方法总结

1.数组的声明

数组的声明主要有以下两种方式

 //数组的声明
 var arr1 = new Array()//创建一个空数组
 var arr2 = new Array(10)//创建数组并指定长度为10
 var arr3 = new Array(1, 2, 3)
 var arr4 = []//用字面量声明一个空数组
 var arr5 = [1, 2, 3]//用字面量声明一个有三个元素的数组

2.数组的属性

1.length属性

length属性是数组的长度属性，这个值可以修改

 console.log(arr1.length);//得到数组的长度
 arr1.length = 10//修改数组的长度为10

2.可以通过数组.[下标]去访问数组元素

 console.log(arr3[2]);//访问arr3的第3个元素

3.数组的方法

1.尾部的增删push()方法和pop()方法

 [arr1.push(1, 2, 3)//追加三个元素到arr1的末尾，参数可以是一个或多个
 console.log(arr1.push(1, 2, 3));//返回的值是新数组的长度

2.头部的增删unshift()和shift()方法

 arr1.unshift(1, 2, 3)//追加三个元素到arr1的开头，参数可以是一个或多个
 console.log(arr1.unshift(1, 2, 3));//返回的值是新数组的长度

3.数组的两种变序方法reverse()翻转数组和sort()排序

var arr6 = [44, 33, 21, 5, 7, 3, 234, 56, 5]
console.log(arr6.reverse());//[5, 56, 234, 3, 7, 5, 21, 33, 44]反转数组
arr6.sort(function (a, b) {
    return a - b
})
console.log(arr6);// [3, 5, 5, 7, 21, 33, 44, 56, 234]将数组从小到大排列
arr6.sort(function (a, b) {
    return b - a
})
console.log(arr6);//[234, 56, 44, 33, 21, 7, 5, 5, 3]将数组从大到小排列

4.数组中截取字符串的方法slice()和splice()

splice会影响原数组，要么进行了删除要么进行了替换，而slice则不会对原数组产生影响会返回新的数组，且splice不仅可以截取数组，还可以对数组进行添加元素和替换数组中的元素

var arr7 = [1, 2, 435, 4, 6, 76, 8, 797, 43]
//slice的第一个参数是开始下标（包括），第二个参数是结束下标（不包括）
console.log(arr7.slice(2, 5));//[435, 4, 6]返回一个新的数组，原数组不会发生任何改变
//splice第一个参数是开始下标（包括），第二个参数是截取的个数
console.log(arr7.splice(2, 3));//[435, 4, 6]返回截取后的新数组，但此时原数组已经发生了变化
console.log(arr7);//[1, 2, 76, 8, 797, 43]原数组被截取了一部分
//当第二个参数没有的时候默认从开始下标截取到最后
console.log(arr7.splice(2));//[76, 8, 797, 43]返回截取后的新数组，开始下标截取到最后，此时原数组已经发生了变化
console.log(arr7)//[1,2]原数组只剩下两个元素
//splice还可以插入元素(将第二个参数写成0 返回一个空数组)，之后的参数都是插入的一个或多个
console.log(arr7.splice(1, 0, 1, 2, 3, 45, 5));
console.log(arr7)//[1, 1, 2, 3, 45, 5, 2]从第二个元素开始加
//splice的替换
console.log(arr7.splice(1, 1, 2));//[1]返回的是被替换的元素，将第二个元素替换成2
console.log(arr7);//[1, 2, 2, 3, 45, 5, 2]原数组已经被替换了

5.数组中的拼接方法concat()

console.log(arr8.concat([1, 2, 3]));//[1, 24, 556, 7, 778, 75, 1, 2, 3]返回拼接好的新数组，原数组不变
console.log(arr8);//[1, 24, 556, 7, 778, 75]//原数组并未发生改变

6.数组转换成字符串方法toString(),toLocalString()和join()

var arr9 = [1, 2, 3, 5, 6, 5, 4, 56, 7, 8]
console.log(arr9.toString());//1,2,3,5,6,5,4,56,7,8相当于把中括号去掉，不会对原数组产生影响
console.log(arr9.toLocaleString());// 1, 2, 3, 5, 6, 5, 4, 56, 7, 8和toString差不多只是根据本地格式转化，不会对原数组产生影响
console.log(arr9);//[1, 2, 3, 5, 6, 5, 4, 56, 7, 8]
console.log(arr9.join());//join不传参数默认用逗号分割，相当于去掉中括号，不会对原数组产生影响
console.log(arr9.join("h"));//1h2h3h5h6h5h4h56h7h8，用指定符号分割数组组成一个字符串，不会对原数组产生影响
console.log(arr9)//[1, 2, 3, 5, 6, 5, 4, 56, 7, 8]

7.数组中的迭代方法forEach()方法用于遍历,map()方法用于遍历,filter()方法用于过滤,some()方法用于判断,every()方法用于判断

var arr10 = [1, 2, 3, 4, 3, 4, 54, 6, 5, 6, 52, 32, 32]
//forEach()用于遍历
arr10.forEach(function (value, key, Array) {
    //去执行某些操作，没有返回值
    console.log(value);//会逐项输出数组中的值
})//value（值）,index（下标），arr（遍历的数组）

//map()也是用于遍历，它和forEach的用法一样不同的是map()有返回值，可以用一个变量去接它
var arr11 = []
arr11.push(arr10.map(function (value, key, Array) {
    //有返回值，可以直接返回对数据的操作
    return value * 2
}))
console.log(arr11);//[2, 4, 6, 8, 6, 8, 108, 12, 10, 12, 104, 64, 64]返回了一个所有value都乘以2的数组

//filter()方法用于过滤
var filterresult = arr10.filter(function (value, key, Array) {
    return value > 2//后面这个是条件
})
console.log(filterresult);//[3, 4, 3, 4, 54, 6, 5, 6, 52, 32, 32]返回一个过滤后的数组

//some()用于判断
var someresult = arr10.some(function (value, key, Array) {
    return value > 2
})
console.log(someresult);//ture 只要数组中有大于2的值就返回ture
//every()用于判断
var everyresult = arr10.every(function (value, key, Array) {
    return value < 10
})
console.log(everyresult);//false 需要数组中每一个元素都小于10才会返回ture

8.数组中的归并计算方法reduce(),reduceRight()(与reduce一样只是从右到左)

//reduce归并计算
var arr11 = [1, 2, 3, 34, 5, 456]
var reduceresult = arr11.reduce(function (pre, value, key, Array) {
    return pre * value
})//pre(前一个值), value（当前值）, key（下标）, Array（遍历数组）
console.log(reduceresult);//输出数组各项的乘积

9.新增查询方法indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置，lastIndexOf() 方法可返回一个指定的字符串值最后出现的位置，在一个字符串中的指定位置从后向前搜索

//indexOf()方法
var arr12 = [12, 3, 43, 5, 4, 6, 4, 3, 22, 2]
console.log(arr12.indexOf(3));//1 从头开始查找3 返回第一次出现的下标 找不到就返回-1
console.log(arr12.indexOf(3, 3));//7 从第四个开始查找3 返回第一次出现的下标
//lastIndexOf()方法
console.log(arr12.lastIndexOf(3));//1 从后往前开始查找3 返回第一次出现的下标 找不到就返回-1
console.log(arr12.lastIndexOf(3, 3));//7 从第四个开始从后往前查找3 返回第一次出现的下标

10.新增查找高阶函数方法find()方法返回第一个符合条件的元素和findIndex()方法返回第一个符合条件的元素的下标

//find()方法返回第一个符合条件的元素
var arr13 = [1, 2, 3, 4, 4, 5, 6, 5, 677]
var findresult = arr13.find(function (value, key, Array) {
    return value > 4
})
console.log(findresult);//5
//findIndex()方法返回第一个符合条件的元素的下标
var findresult = arr13.findIndex(function (value, key, Array) {
    return value > 4
})
console.log(findresult);//5

11.数组中的静态（直接用类来调用）方法form（）方法（将伪数组数组转换成数组）和of()方法（将一组数据转换成数组）

// from方法
function fn() {
    Array.from(arguments)
    console.log(arguments);//转换成数组
}
fn(1, 34, 6, 7)
//of方法
var str = "1,2,45,6,7"
console.log(Array.of(str));//['1,2,45,6,7']str作为一个整体参数所以数组中只有这一个元素
console.log(Array.of(1, 2, 3, 5));//[1, 2, 3, 5]三个参数，数组的长度为三