JavaScript数组方法
字符串和数组转换
数组转字符串
let gossip=['乾','坤']
console.log(gossip.toString());//乾,坤
let gossip=['乾','坤']
console.log(gossip.toLocaleString());//乾,坤
let gossip=['乾','坤']
console.log(String(gossip));//乾,坤
let gossip=['乾','坤']
console.log(gossip.join('|'));//乾|坤
//join的参数是连接起来的字符
字符串转字符
let gossip='乾(☰)、坎(☵)、艮(☶)、震(☳)、巽(☴)、离(☲)、坤(☷)、兑(☱)'
console.log(gossip.split('、'));//["乾(☰)", "坎(☵)", "艮(☶)", "震(☳)", "巽(☴)", "离(☲)", "坤(☷)", "兑(☱)"]
let gossip='乾坎艮震巽离坤兑'
console.log(Array.from(gossip));//["乾", "坎", "艮", "震", "巽", "离", "坤", "兑"]
//有length属性的都可以转
let gossip='乾坎艮震巽离坤兑'
console.log([...gossip]);//["乾", "坎", "艮", "震", "巽", "离", "坤", "兑"]
改变原数组的方法
push和pop后增后减
let gossip=['乾','坤']
let newGossip = gossip.push('坎')//最后面增加一个
console.log(gossip);// ["乾", "坤", "坎"]
console.log(newGossip);// 3 //3是新数组的长度
let gossip=["乾", "坤", "坎"]
let newGossip = gossip.pop()//最后面减少一个
console.log(gossip);// ["乾", "坤"]
console.log(newGossip);// 坎 //这是删除的项
unshift和shift前增前减
let gossip=['乾','坤']
let newGossip = gossip.unshift('坎')//最前面增加一个
console.log(gossip);// [ "坎","乾", "坤"]
console.log(newGossip);// 3 //3是新数组的长度
let gossip=["乾", "坤", "坎"]
let newGossip = gossip.shift()//最前面减少一个
console.log(gossip);// ["坤", "坎"]
console.log(newGossip);// 乾 //这是删除的项
splice的增删改
let gossip=["乾", "坎", "艮", "震", "巽", "离", "坤", "兑"]
let narr=gossip.splice(3)
console.log(gossip);//["乾", "坎", "艮"]
console.log(narr);// ["震", "巽", "离", "坤", "兑"]
//只有一个参数时,是截取开始的位置不包括,返回截取的项
let gossip=["乾", "坎", "艮", "震", "巽", "离", "坤", "兑"]
console.log(gossip);// ["乾", "坎", "艮", "离", "坤", "兑"]
console.log(gossip.splice(3,2));//["震", "巽"]
//两个参数,第一个表示开始截取的位置不包括,第二个表示截取的数量,返回截取的项
let gossip=["乾", "坎", "艮", "震", "巽", "离", "坤", "兑"]
let narr=gossip.splice(3,2,'甲','乙')
console.log(gossip);//["乾", "坎", "艮", "甲", "乙", "离", "坤", "兑"]
console.log(narr);//["震", "巽"]
//三个参数,第一个表示开始截取的位置不包括,第二个表示截取的数量,后面表示截取位置增加的项,返回截取的项
reverse翻转
let gossip=["乾", "坤", "坎","艮","震","巽","离","兑"]
gossip.reverse()//前后翻转
console.log(gossip);// ["兑", "离", "巽", "震", "艮", "坎", "坤", "乾"]
sort排序
let arr=['car','apple','chrome','body','android']
console.log(arr.sort());//["android", "apple", "body", "car", "chrome"]
//按照第一个字母的Unicode码顺序排列,相同时看第二个,一直到最后
let arr=['11','9','25','10','34']
console.log(arr.sort());//["10", "11", "25", "34", "9"]
//按照第一位的数字大小排列,第一位相同时看第二位,一直到最后
sort的参数里面可以有函数,返回值决定排序顺序
返回值<0,换位
返回值>=0,不变
let arr=['11','9','25','10','34']
console.log(arr.sort((a,b)=>{return a-b}));//["9", "10", "11", "25", "34", "121"]
copyWithin复制内容替换其他位置
三个参数
第一个参数:替换开始的位置,包裹该位置
第二个参数:复制内容开始的地方默认0,负数从末尾开始,包裹该位置
第三个参数:复制内容结束的位置默认结尾负数从末尾开始,不包裹该位置
let arr=['1','2','3','4','5','6','7','8','9']
console.log(arr.copyWithin(1,2,4));//["1", "3", "4", "4", "5", "6", "7", "8", "9"]
fill填充
三个参数
第一个参数:要填充的值
第二个参数:填充开始的地方默认0负数从末尾开始,包裹该位置
第三个参数:填充结束的位置默认结尾负数从末尾开始,不包裹该位置
let arr=['1','2','3']
console.log(arr.fill(1));//[1, 1, 1]
//只有一个参数情况
let arr=['1','2','3']
console.log(arr.fill("5",1,2));//["1", "5", "3"]
不改变原数组的方法
slice截取
两个参数
第一个参数:截取开始的地方包括负数从末尾开始
第二个参数:截取结束的位置,默认结尾不包括负数从末尾开始
let gossip=["乾", "坎", "艮", "震", "巽", "离", "坤", "兑"]
console.log(gossip.slice(0,5));// ["乾", "坎", "艮", "震", "巽"]
concat数组合并
let gossips=["乾", "坎", "艮", "震"]
let gossipx=["巽", "离", "坤", "兑"]
console.log(gossips.concat(gossipx));//["乾", "坎", "艮", "震", "巽", "离", "坤", "兑"]
indexof查看值是否存在
两个参数
第一个一个参数:查询的值
第二个参数:查询开始的位置包括该位置,默认为0,接受负数
let gossip=["乾", "坎", "艮", "震","乾", "坎", "艮", "震",]
console.log(gossip.indexOf('艮',3));//6
//返回值的位置,没有返回-1
lastIndexof查看值是否存在
和indexof的区别是从后面往前查询,第二个参数大于数组长度时会全部查找,
includes查看值是否存在
这是对上面两个方法的补充,上面两个方法不能识别NaN,返回的值不是布尔值需要判断
let gossip=["乾", "坎", "艮", "震","乾", "坎", "艮", "震",]
console.log(gossip.includes('艮',6));//true
//返回值为布尔值,第一参数是查找的值,第二个是开始的位置,接受负数,默认0,负数的值超过数组长度就会全部查找
...扩展运算符数组的用法
这是我用起来感觉最香的的东西,能把数组拆开和合并,
let gossip=["乾", "坎", "艮", "震","乾", "坎", "艮", "震",]
console.log(...gossip);//乾 坎 艮 震 乾 坎 艮 震
//拆开
let gossips=["乾", "坎", "艮", "震"]
let gossipx=["巽", "离", "坤", "兑"]
console.log([...gossips,...gossipx]);//["乾", "坎", "艮", "震", "巽", "离", "坤", "兑"]
//合并
常用于函数的参数不知道有多少时的获取
function see(...arr) {
console.log(arr);
}
see("乾", "坎", "艮", "震")//["乾", "坎", "艮", "震"]
//传多少参数,接多少参数
遍历数组
for循环我们直接过
forEach
两参数
第一个参数:回调函数,控制数组
第二个参数:回调函数的this指向
let gossips=["乾", "坎",, "艮", "震"]
let obj = { name: '不忘' };
let result=gossips.forEach(function(value,index,array){//第一个参数是数组的值,第二个是数组的索引,第三个是数组
array[index]=value+"-"+this.name;
return 1
},obj)
console.log(gossips);//["乾-不忘", "坎-不忘", empty, "艮-不忘", "震-不忘"]
console.log(result);//undefined
//无论返回什么都是undefined
//一共循环四次,空的项不循环
every是否全部符合条件
let arr = [1,2,3,4,5,6,7,8,9];
let result=arr.every((value)=>{
return value <10
})
console.log(result);//true
//和forEach差不多,就是返回一个条件,全部满足返回true
some是否有满足条件的项
let arr = [1,2,3,4,5,6,7,8,9];
let result=arr.some((value)=>{
return value <2
})
console.log(result);//true
//和every差不多,区别是只要一个条件满足就返回true
filter过滤
let arr = [1,2,3,4,5,6,7,8,9];
let result=arr.filter((value)=>{
return value <5
})
console.log(result);//[1, 2, 3, 4]
//差不多,返回的是满足条件的项
map对每个项同样操作
let arr = [1,2,3,4,5,6,7,8,9];
let result=arr.map((value)=>{
return value+1
})
console.log(result);//[2, 3, 4, 5, 6, 7, 8, 9, 10]
//差不多,区别是返回的方法可以对每一项进行一样的操作
find查找
let arr = [1,2,3,4,5,6,7,8,9];
let result=arr.find((value,index,array)=>{
return value>7;
})
console.log(result);//8
//差不多,区别是返回第一个满足条件的项,没有返回nuderfind
findIndex查找
let arr = [1,2,3,4,5,6,7,8,9];
let result=arr.findIndex((value,index,array)=>{
return value>7;
})
console.log(result);//true
//和find差不多,返回的是索引,没有返回-1
reduce累加
两个参数,
第一个参数:回调函数
第二个参数:是最开始的值
let arr = [1,2,3,4,5,6,7,8,9];
let result=arr.reduce((total,value,index,array)=>{//total是最开始的值,value是每一项的值,index是索引,array是数组
return total+value;
},0)//设置开始值total为0
console.log(result);//45
//这里每次循环返回的值都会传给total,最终的返回值是最后的total值
reduceRight累加
和reduce一样,就是从后面开始往前累计执行
array Iterator迭代器
entries
let gossip=["乾", "坎", "艮", "震","乾", "坎", "艮", "震",]
let entries=gossip.entries()
console.log(entries.next());//{value:[0,"乾"],done:false}
console.log(entries.next());//{value:[1,"坎"],done:false}
//当执行到第八次的时候done会变成true,表示遍历完了
keys
和entries差不多,就是value显示索引
values
和entries差不多,就是value显示值
for...in....
let gossip=["乾", "坎", "艮", "震","乾", "坎", "艮", "震",]
for (const value in gossip) {
console.log(value);
}
//遍历索引
for...of....
let gossip=["乾", "坎", "艮", "震","乾", "坎", "艮", "震",]
for (const value of gossip) {
console.log(value);
}
//遍历值