ES6 Array常用扩展的应用实例分析
本文实例讲述了ES6Array常用扩展的应用。分享给大家供大家参考，具体如下：
在ES6中又对Array扩展了不少方法，下面我们来看下
from方法
将伪数组转换为数组
letobj={
'0':'h',
'1':'i',
'length':2
};
letarr=Array.from(obj);
console.log(Array.isArray(arr));//true
console.log(arr);//["h","i"]
通过第二个回调参数对值进行再加工处理
letobj={
'0':'h',
'1':'i',
'length':2
};
letarr=Array.from(obj,function(item,index){
//对返回的值进行处理
returnitem+'...'
});
console.log(arr);//["h...","i..."]
可转换实现了interator接口的类型如：set和map为数组
varset=newSet(['me','book','Joh']); vararr=Array.from(set); console.log(arr);//["me","book","Joh"]
其他：使dom节点NodeList转化为数组
of方法
vararr=newArray(5);//数组之前的这种形式和字符串等类型的操作不统一，得到的只是长度为5的空数组 console.log(arr);//[empty×5] vararr2=Array.of(12); console.log(arr2);//[12] vararr3=Array.of(12,3,5,22); console.log(arr3);//[12,3,5,22]
使用of方法，直接获得数组
find方法
find查找符合函数的标准，返回一个真值，第一个就符合:
vararr=[undefined,22,33,44];
varval=arr.find(function(){
returntrue;
});
console.log(val);//undefined始终返回第一个值，无论是0,'',NaN,undefined,null都返回第一个值
返回false,将没有一个符合，最终结果是undefined
vararr=[20,22,33,44];
varval=arr.find(function(){
returnfalse;
});
console.log(val);//undefined
通过find参数中的value来判断
vararr=[21,22,33,44];
varval=arr.find(function(value,index,arr){
returnvalue>22;
});
console.log(val);//33
findIndex方法
和find方法几乎一样，就是返回值是索引
vararr=[21,22,33,44];
varval=arr.findIndex(function(value,index,arr){
returnvalue>22;
});
console.log(val);//2
findIndex可以解决indexOf无法解决的问题：
vararr=[NaN];
varres1=arr.indexOf(NaN);
varres2=arr.findIndex(function(v){
returnObject.is(NaN,v);
});
console.log(res1);//-1未找到
console.log(res2);//0找到
copyWithin方法
copyWithin操作原数组(起始索引,拷贝值的索引起点，拷贝值的索引终点),将拷贝的值替换原值,注意左闭右开
//替换多个值 vararr1=[1,2,3,4,5,6,7]; arr1.copyWithin(1,5,7); console.log(arr1);//[1,6,7,4,5,6,7] //替换一个值的不同表示1 vararr2=[1,2,3,4,5,6,7]; arr2.copyWithin(2,5,6);//将6替换3 console.log(arr2);//[1,2,6,4,5,6,7] //替换一个值的不同表示2从后面数，最后一个是-1，倒数第二个是-2 vararr3=[1,2,3,4,5,6,7]; arr3.copyWithin(2,-2,-1); console.log(arr3);//[1,2,6,4,5,6,7] //替换一个值的不同表示3前后混合使用 vararr3=[1,2,3,4,5,6,7]; arr3.copyWithin(2,5,-1); console.log(arr3);//[1,2,6,4,5,6,7]
fill方法
fill(默认填充值，填充起始索引，填充结束索引)，注意区间的左闭右开
vararr1=[1,2,3,4,5,6,7]; arr1.fill(10); console.log(arr1);//[10,10,10,10,10,10,10] vararr2=[1,2,3,4,5,6,7]; arr2.fill(10,2,5); console.log(arr2);//[1,2,10,10,10,6,7]
includes方法
includes用于查找是否包含某种元素
constarr1=['a','b','c','d','e','f','g','h','i','j','k',NaN];
console.log('%s',arr1.includes('c'))//true
console.log('%s',arr1.includes('z'))//false
console.log('%s',arr1.includes(NaN))//true
函数的第二个参数表示判断的起始位置:
constarr1=['a','b','c','d','e','f','g','h','i','j','k',NaN];
console.log('%s',arr1.includes('d',1))//true
console.log('%s',arr1.includes('d',3))//true
console.log('%s',arr1.includes('d',4))//false
第二个参数也可以是负数，表示从右数过来第几个，但是不改变判断搜索的方向，搜索方向还是从左到右
constarr1=['a','b','c','d','e','f','g','h','i','j','k',NaN]
console.log('%s',arr1.includes('k',-1));//false
console.log('%s',arr1.includes('k',-2));//true
console.log('%s',arr1.includes('i',-3));//false
更多关于JavaScript相关内容感兴趣的读者可查看本站专题：《JavaScript数组操作技巧总结》、《JavaScript遍历算法与技巧总结》、《javascript面向对象入门教程》、《JavaScript数学运算用法总结》、《JavaScript数据结构与算法技巧总结》及《JavaScript错误与调试技巧总结》
希望本文所述对大家JavaScript程序设计有所帮助。