处理数组的常用内置对象
常用的处理数组内置对象总结了
1. push()数组后添加元素
2. unshift()数组前添加元素
3. pop()数组后删除元素
4. shift()数组前删除元素
5. splice()数组的元素添加、删除、替换
6. slice()数组的截取
7. split()字符串转化为数组
8. indexOf()搜索数组或字符串中的元素有就返回索引,无则返回-1
9. lastIndexOf()从最后开始搜索数组或字符串中的元素有就返回索引,无则返回-1
10. toString()讲数组转化为字符串,每个元素由逗号隔开
11. join()讲数组转化为字符串,并可以选择指定义符号或无符号进行隔开
12. concat()拼接数组
13. sort()数组中的元素排序
14. reverse()数组实行翻转
15. forEach()迭代遍历数组
16. map() 迭代遍历数组返回新数组
16. filter()数组元素的筛选返回成新数组
17. some()数组元素的判断是否存在数组中返回布尔值
-------------------------------------------------------------------------------
数组增添push()与unshift()-------改变原数组
1. push()数组元素最后添加数组元素
var arr = [1, 2, 3, 4, 5]
console.log(arr)
arr.push("我是push新增在数组最后的元素")
console.log(arr)
打印出:
(5) [1, 2, 3, 4, 5]
(6) [1, 2, 3, 4, 5, "我是push新增在数组最后的元素"]
2. unshift()数组元素开头添加数组元素
var arr1 = [1, 2, 3, 4, 5]
console.log(arr1)
arr1.unshift("我是unshift在数组前新增的元素")
console.log(arr1)
打印出:
(5) [1, 2, 3, 4, 5]
(6) ["我是unshift在数组前新增的元素", 1, 2, 3, 4, 5]
数组删除pop()与shift()--------改变原数组
1.pop()删除数组最后一个元素
var arr2 = [1, 2, 3, 4, 5, "我是最后一个数组元素"]
console.log(arr2)
arr2.pop()
console.log(arr2)
打印结果:
(6) [1, 2, 3, 4, 5, "我是最后一个数组元素"]
(5) [1, 2, 3, 4, 5]
2.shift()删除数组开始第一个元素
var arr3 = ["我是数组前一个元素", 1, 2, 3, 4, 5]
console.log(arr3)
arr3.shift()
console.log(arr3)
打印结果:
(6) ["我是数组前一个元素", 1, 2, 3, 4, 5]
(5) [1, 2, 3, 4, 5]
-------------------------------------------------------------------------
实现增添、删除和替换操作splice()-------改变原数组
splice(参数1,参数2,参数3)
参数1:数组索引,从什么地方开始
参数2:选取的个数/0
参数3:值或空值
1、实现增与push一样的数组最后添操作
var arr4 = ["马云", "刘强东", "王兴", "张一鸣"]
console.log(arr4)
arr4.splice(arr4.length, 0, "马化腾")
console.log(arr4)
打印结果:
(4) ["马云", "刘强东", "王兴", "张一鸣"]
(5) ["马云", "刘强东", "王兴", "张一鸣", "马化腾"]
原理是splice()参数1为数组长度为4,但数组索引为3,参数2为0就参数1中选索引前面元素,参数3为添加的元素。因为索引为4时无元素且大于数组索引,索引实现了在数组后添加元素效果
2、实现与unshift()一样的数组开头添加操作
var arr4 = ["马云", "刘强东", "王兴", "张一鸣"]
console.log(arr4)
arr4.splice(0, 0, "马化腾")
console.log(arr4)
打印结果:
(4)["马云", "刘强东", "王兴", "张一鸣"]
(5) ["马化腾", "马云", "刘强东", "王兴", "张一鸣"]
原理是splice()参数1为0代表索引为0,参数2为0就参数1中选索引前面元素,参数3位添加的元素,因为索引为0时前面无元素,就实现了数组前添加元素效果。
3、实现与pop()一样的数组最后删除操作
var arr4 = ["马云", "刘强东", "王兴", "张一鸣"]
console.log(arr4)
arr4.splice(arr4.length-1, 1)
console.log(arr4)
打印结果:
(4) ["马云", "刘强东", "王兴", "张一鸣"]
(3) ["马云", "刘强东", "王兴"]
原理是splice()参数1为数组长度-1代表选中数组最后一个元素本身,参数2为1带表选中当前索引元素,参数三为空代表将当前数组最后一个元素替换成空或删除。
4、实现与shift()一样的数组数组开头删除操作
var arr4 = ["马云", "刘强东", "王兴", "张一鸣"]
console.log(arr4)
arr4.splice(0, 1)
console.log(arr4)
打印结果:
(4) ["马云", "刘强东", "王兴", "张一鸣"]
(3) ["刘强东", "王兴", "张一鸣"]
原理是splice()参数1为0代表数组开头第一个元素,参数2为1代表选中当前数组索引元素,参数3为空代表当前第一个元素替换成空或删除。
5、实现替换操作splice(3, 1, "我被替换了")
var arr4 = ["马云", "刘强东", "王兴", "张一鸣"]
console.log(arr4)
arr4.splice(3, 1, "我被替换了")
console.log(arr4)
打印结果:
(4) ["马云", "刘强东", "王兴", "张一鸣"]
(4) ["马云", "刘强东", "王兴", "我被替换了"]
原理是splice()参数1为数组索引的任意存在的数,参数2为1代表选中当前替换的元素,参数3为你要替换的内容。
6、返回原数组splice(0)
---------------------------------------------------------------------------
数组与字符串截取操作slice() ------不改变原数组返回新数组
参数1:是数组索引或字符串从哪里开始截取,本身会算进去
参数2:是你要截取到的数组索引,当前索引本身是不会算进去的
如果参数为负值就是从数组背后算起。
1、截取数组slice()
let arr5 = [1, 2, 3, 4, 5]
let str = "12345"
console.log(arr5)
let arr6 = arr5.slice(1, -1)
console.log(arr5)
console.log(arr6)
打印结果:
(5) [1, 2, 3, 4, 5]
(5) [1, 2, 3, 4, 5]
(3) [2, 3, 4]
-------------------------------------------------------------
字符串转化为数组
split("字符串中针对什么元素进行分割成数组")------------不改变原数组
let str1 = "小强&小明"
let str2 = "abcdef"
let arr11 = str1.split("&")
let arr12 = str2.split("")
console.log(arr11)
console.log(arr12)
打印结果:
(2) ["小强", "小明"]
(6) ["a", "b", "c", "d", "e", "f"]
注意:split("哈哈")当你要分割的字符串中没有你写的指定元素分割符,那么它会返回整个字符串,不写默认将每个字符串分割成数组元素。
-------------------------------------------------------------
数组转换为字符串
toString()----------不改变原数组
let arr9 = [1, 2, 3, 4, 5]
let str = arr9.toString()
console.log(str)
console.log(arr9)
打印结果:
1,2,3,4,5
(5) [1, 2, 3, 4, 5]
返回的字符串间隔用逗号分割
join()-------------不改变原数组
let arr9 = [1, 2, 3, 4, 5]
let str = arr9.join("+")
console.log(str)
打印结果:
1+2+3+4+5
--------------------------------------------------------------------------
字符串拼接
concat(arr,arr1,arr2,arr3.....) ----------不改变原数组返回新数组
let arr7 = [1, 2, 3, 4, 5]
let arr8 = [6, 7, 8, 9]
let concat1 = arr7.concat(arr8)
console.log(concat1)
打印结果:
(9) [1, 2, 3, 4, 5, 6, 7, 8, 9]
------------------------------------------------------------------------
数组和字符串查找
indexOf(查找的元素,从数组哪个索引开始)-------------返回查找字符串或数组元素索引
参数1:查找的元素 参数2:从数组哪个索引开始,包括数组索引本身
let arr10 = [1, 2, 3, 4, 5, 1, 3]
let x = arr10.indexOf(1, 1)
let y = arr10.indedOf(6,1)
console.log(x)
console.log(y)
打印结果:
5
-1
注意:在数组或字符串中如果找到就返回索引号,如果没找到就返回-1
lastIndexOf(查找的元素,从数组哪个索引开始(一般为负数))------------返回查找字符串或数组元素的索引
let arr10 = [1, 2, 3, 4, 5, 1, 3]
let x = arr10.lastIndexOf(3, -1)
let y = arr10.lastIndexOf(6, 0)
console.log(x)
console.log(y)
打印结果:
6
-1
注意:lastIndexOf()为逆向查找但它返回的数组索引是正向索引,一般参数2为负数,-1代表最后元素的第一个。
------------------------------------------------------------
数组排序
sort()--------------改变原数组
1.正向排序(从小到大)sort(function(a,b){return a-b})
2.逆向排序(从大到小)sort(function(a,b){return b-a})
let arr13 = [32, 44, 23, 54, 90, 12, 9]
let arr14 = [32, 44, 23, 54, 90, 12, 9]
arr13.sort((a, b) => {
return a - b
})
arr14.sort((a, b) => {
return b - a
})
console.log(arr13)
console.log(arr14)
打印结果:
(7) [9, 12, 23, 32, 44, 54, 90]
(7) [90, 54, 44, 32, 23, 12, 9]
注意:sort()里边不写函数参数返回值是会以第一数字从小到大排序
-----------------------------------------------------------------------
数组翻转
reverse()-----------------改变原数组
let arr15 = [1, 2, 3, 4, 5, 6, 7]
arr15.reverse()
console.log(arr15)
打印结果:
(7) [7, 6, 5, 4, 3, 2, 1]
----------------------------------------------------------------------
迭代遍历
一、forEach(function(value,index,arr){})
- 参数1:数组叠代遍历的值
- 参数2:数组迭代遍历的索引
- 参数3:返回原数组
let arr = ["小明", "小张", "小强"]
arr.forEach(function (value, index, arr1) {
console.log("数组当前项的的值:" + value + "\n数组当前的索引" + index)
console.log(arr1)
})
打印结果:
数组当前项的的值:小明
数组当前的索引0
(3) ["小明", "小张", "小强"]
数组当前项的的值:小张
数组当前的索引1
(3) ["小明", "小张", "小强"]
数组当前项的的值:小强
数组当前的索引2
(3) ["小明", "小张", "小强"]
二、map(function(v,i){ return 内容})
- 参数1:数组叠代遍历的值
- 参数2:数组迭代遍历的索引
- 参数3:返回原数组
let str = "GET-ELementS-By-clASS-NaMe"
str = str.toLowerCase()
let arr = str.split("-")
console.log(arr)
let newArr = arr.map((v, i) => {
if (i !== 0) {
return v[0].toUpperCase() + v.substr(1)
}
else {
return v
}
})
str = newArr.join("")
console.log(Boolean("0"))
</script>
筛选方法
一、filter(function(value,index,arr){return 筛选条件})
1. 参数1:数组叠代遍历的值
2. 参数2:数组迭代遍历的索引
3. 参数3:返回原数组
let arr = [22, 4, 66, 88]
let newArr = arr.filter(function (value, index, arr1) {
console.log("第一个参数返回的是数组当前索引的值:" + value)
console.log("第二个参数返回的是当前索引" + index)
console.log("第三个参数反回的是当前数组" + arr1)
return value <= 25
})
console.log(newArr)
打印结果:
(2)[22, 4]
注意:filter()是利用return 加后面的筛选条件来进行返回,返回的对象是一个数组,它是将数组全部迭代遍历一遍,符合条件的就添加到返回的数组中去。
--------------------------------------------------------------
检查数组中的是否有满足条件的方法
some(function(value,index,arr){return 筛选条件})
1. 参数1:数组叠代遍历的值
2. 参数2:数组迭代遍历的索引
3. 参数3:返回原数组
var arr = ["肖航", "pink", "哈哈哈"]
var flag = arr.some(function (value, index, arr1) {
return value === "pink"
})
console.log(flag)
打印结果:
true