push方法:向数组末尾增加内容
@params:多个任意类型
@return:新增后数组的长度
let ary=[10,20];
let res = ary.push(30,'AA',{name:周});
console.log(res,ary);
//用原生JS的方法向末尾增加(40)
ary[ary.length] = 40;
console.log(res,ary);//=>6 [10,20,30,'AA',{name:周},40]`js
unshift方法:向数组开头增加内容
@params:多个任意类型
@return:新增后数组的长度
let ary=[10,20];
let res = ary.unshift(30,'AA');
console.log(res,ary);//=>4 [30,'AA',10,20]
//基于原生ES6展开运算符,把原有的ary克隆一份,在新的数组中创建第一项,其余的内容使用原始ary中的信息即可,也算实现了像开始追加的效果
ary = [100,...ary];
console.log(ary);//=>[100,30,'AA',10,20]
shift:删除数组中的第一项
@params:无
@return:删除的那一项
let ary=[10,20,30,40];
let res = ary.shift();
console.log(res,ary);//=>10 [20,30,40]
//基于原生JS中的delete,把数组当作普通的对象,确实可以删除掉某一项的内容,但是不会影响数组本身的结构特点(length的长度不会跟着修改),真实项目中杜绝这样的删除使用
delete ary[0];
console.log(ary);//=>[1:30,2:40,length:3]
pop:删除数组中的最后一项(参数:无;返回值:删除的那一项)
@params:无
@return:删除的那一项
let ary=[10,20,30,40];
let res = ary.pop();
console.log(res,ary);//=>40 [10,20,30];
//基于原生JS让数组长度删除一位(默认删除的是最后一项)
ary.length--;//=>ary.length = ary.length-1;
console.log(ary);//=> [10,20]
splice:实现数组的增加、删除、修改(参数:数字(n,m) -从索引n开始删除m个元素;m不写删除到末尾;
@params:数字(n,m) -从索引n开始删除m个元素;m不写删除到末尾;
@return:新数组
修改操作(n,m,x): 从索引n开始山粗m个元素,用x(随便放,也可以不放,就代表删除)占用删除的部分 增加操作
(n,m,x,...): 从索引n开始,删除m个元素,把x以及后面的内容替换删除的内容
@return:把删除的部分以新数组返回
原数组改变
let ary=[10,20,30,40,50,60,70,80,90];
let res = ary.splice(2,4);
console.log(res,ary);//=>[30,40,50,60] [10,20,70,80,90]
//=>基于下面方法可以清空数组,把原始数组中的内容一新数组存储起来(有点类似数组的clon-把原来数组coln一份一摸一样的给新数组)
ary.splice(0);
console.log(res,ary);//=>[10,20,30,40,50,60,70,80,90] []
//删除数组中的最后一项
ary.splice(ary.length-1);
//删除数组中的第一项
ary.splice(0,1);
console.log(ary);
//=>修改操作(n,m,x): 从索引n开始山粗m个元素,用x(随便放,也可以不放,就代表删除)占用删除的部分
let ary=[10,20,30,40,50];
let res = ary.splice(1,2,'z',、,'j');
console.log(res,ary);//=>[20,30] [10,'z','j',40,50]
//=>增加操作(n,0,x): 从索引n开始,一个都不删,把x放在索引n的前面
ary.splice(3,0,'p');
console.log(ary);//=>[10,'z','j','p',40,50]
//=>向数组末尾追加
ary.splice(ary.length,0,'A');
console.log(ary);//=>[10,'z','j','p',40,50,'A']
//=>像数组开始追加
ary.splice(0,0,'B');
console.log(ary);//=>['B',10,'z','j','p',40,50,'A']
slice concat:数组的查找和拼接
slice:实现数组的查询
@params(参数) n,m都是数字 从索引n开始,找到索引位m的地方(不包含m这一项)
@return(返回值) 把找到的内容以一个新数组的形式返回
let ary=[10,20,30,40,50];
let res = ary.slice(1,3);
console.log(res,ary);//=>[20,30] [10,20,30,40,50]
//m不写找到末尾
let res = ary.slice(1);
console.log(res,ary);//=> [20,30,40,50] [10,20,30,40,50]
//数组的克隆,参数0不写也可以
let res = ary.slice(0);
console.log(res,ary);//=> [10,20,30,40,50] [10,20,30,40,50]
//思考:1.如果n/m为负数怎么办,如果n>m会怎么办,如果是小数怎么办,如果是非有效数字怎么办,如果m/n的值比最大索引都大怎么办 2.这种克隆方式叫做浅克隆,可以回去看看深度克隆如何处理!
concat 数组的拼接
@params(参数)
多个任意类型的值
@return(返回值)
拼接后的新数组(原来数组不会改变)
let ary1=[10,20,30];
let ary2=[40,50,60];
let res = ary1.concat('zfpx',ary2);
console.log(res);//=>[10,20,30,'zfpx',40,50,60]
toString:把数组转化为字符串
@params(参数) 没有参数
@return(返回值) 转化后的字符串
let ary=[10,20,30];
let res = ary1.toString();
console.log(res);//=>"10,20,30"
console.log([].toString)//=>""
console.log([12].toString);//=>"12"
join 把数组转化为字符串(可指定分隔符的)
@params(参数) 指定分隔符(字符串格式的)
@return(返回值) 转化后的字符串
let ary=[10,20,30];
let res = ary1.join();//=>默认的分隔符还是,
let res = ary.join("");
console.log(res);//=>"102030"
let res = ary.join(" ");//=>y有空格
console.log(res);//=>"10 20 30"
let res = ary.join("|");//=>常用
console.log(res);//=>"10|20|30"
let res = ary.join("+");
console.log(res);//=>"10+20+30"
console.log(eval(res));//=>就可以做js表达式的运算了(60)
eval:把字符串变为js表达式
indexOf/lastIndexOf/includes(ES6):(本意:检测当前项在数组中第一次或者最后一次数显位置的索引值)检测数组中是否包含某一项
@params(参数) 要检索的这一项内容
@return(返回值) 这一项出现的位置索引值(数字),如果数组中没有这一项,返回的结果是(-1),原来数组不变
let ary=[10,20,30,40,20,60];
console.log(ary.indexOf(20));//=>0
console.log(ary.lastIndexOf(20));//=>3
//想验证ary中是否包含‘zfpx’
//方法一:
if(ary.indexOf('zfpx')===-1){
//不包含
}else{
//包含
}
// 方法二:
console.log(ary.includes('zfpx'));//=>false (若存在就是true,若不存在就是false)
if(ary.includes('zfpx')){
...
}else{
...
}
reverse:数组的排序或者排列//=>把数组倒过来排列(原来的数组改变)
@params
@return(返回值) 排列后的新数组
let ary=[12,15,9,28,10,22];
console.log(ary.(ary.reverse()));//=>[22,10,28,9,28,14,12]
sort:实现数组的排序
@params:可以没有,也可以是个函数
@return(返回值) 排列后的新数组
let ary=[7,8,5,2,4,6,9];
console.log(ary.(ary.sort()));//=>[2,4,5,6,7,8,9]
//=>sort方法如果不传递参数,是无法处理10以上的数字排序(它默认按照每一项第一个字符来排,不是我们想要的效果)
let ary=[12,15,9,28,10,22];
console.log(ary.(ary.sort()));//=>[10,12,15,22,28,9]
//想要实现多位数正常排序,需要给sort传递一个函数,函数中返回a-b实现升序,返回b-a实现降序(冒泡排序机制)
let ary=[12,15,9,28,10,22];
//ary.sort(function(a,b){return a-b});
//a和b是相邻的两项
ary.sort((a,b)=>(a-b);
console.log(ary);//=>[9,10,12,15,22,28]
map[callback]:遍历数组中的每一项
map和forEach类似,也是依次遍历数组中的每一项,并且通知匿名回调函数执行(当前项/当前项索引 传递给函数),区别是map支持支持返回值的,回调函数中返回的结果会替换数组中的当前项(原数组不变,以新数组返回)
var arr =[10,20,30,40,50,60] ;
var res = arr.map((item,index)=>{
//返回啥相当于当前项替换成啥
return '@';
});
console.log(arr,res)//=>[10,20,30,40,50,60] ['@','@','@','@','@','@']
filter[callback](过滤器):遍历数组中的每一项(item,index),在每一次便利的时候,如果回调函数中返回的是true,我们把这一项留下,如果返回的是false,则这一项就不要了,把最后筛选的结果按照新数组返回,原数组不变
var arr =[10,20,30,40,50,60] ;
var res = arr.filter((item.index)=>{
//索引是偶数,代表第及数个
//0,2,4
return index % 2 === 0;
})
console.log(res,arr)//=>[10,30,50] [10,20,30,40,50,60]
find/findIndex[callback]:在数组中查找符合条件的这一项/在数组中查找符合条件的这一项的索引
var arr =[10,20,30,40,50,60] ;
var res = arr.find((item,index)=>{
//一旦找到符合条件的一项,则遍历结束
//改成:findIndex
return index > 2;
});
console.log(res);//=>40 (findIndex)3
reduce/reduceLeft/reduceRight[callback]:自查一下
some[callback]:依次遍历数组中的每一项,只要有一项,符合我们设定的条件,整体为true。否则为false
every[callback]:依次遍历数组中的每一项,真题都符合我们设定的条件,整体为true。否则为false
var arr =[10,20,30,40,50,60] ;
var res1 = arr.some((item,index)={
return item > 50
});
console.log(res1);//=>true
var res2 = arr.every((item,index)={
return item > 50
});
console.log(res2);//=>false
fill[val]:数组填充
var arr = new arr[10]//创建一个长度为10的数组,但是此时每一项没有内容
arr.fill(null);//填充后拥有了每一项,只不过结果为null(拥有美哟想就可以遍历了)
console.log(arr;)
falt[number]:数组扁平化===>把多为数组将为打击成一维数组 参数(Infinity):不管多深全降成一维数组,默认(不带参数)降一个维度======原始数组不变
var arr = [10,20,[30,40,[50,60]],70,80,[90,100]]
var res = arr.falt(Infinity);
console.log(res);//=>[10,20,30,40,50,60,70,80,90,100]
`遍历数组中每一项的方法(Array.prototype 可以在控制台查看数组中所有的提供的方法,可以基于MDN网站取查询方法的用法)`
## forEach:遍历数组中的每一项内容(原来数组不变)
@params:回调函数 @return
let ary=[7,8,5,2,4,6,9];
//基于原生JS中的循环可以实现
for(let i = 0 ;i<ary.length;i++){
//:当前循环这一项的索引
//ary[i]:根据索引获取循环的这一项
console.log('索引:'+i+'内容:'+ary[i]);
}
//方法二:
ary.forEach((item,index)=>{
// 数组中有多少项,函数就会默认执行多少次
// 每一次执行函数:item是数组中当前要操作的这一项,index是当前页的索引
console.log('index:'+i+'item:'+ary[i]);