ES6 对数组的扩展

简介: 函数作用:将一组值,转换成数组

一、Array.of()函数

函数作用:将一组值,转换成数组

var arr=Array.of(1,2,3,4)
		console.log(arr) // [1,2,3,4]

二、Array.from()函数

1.可以将类似数组的对象或者可遍历的对象转换成真正的数组。
比如:getElementsByTagName等

let ele = document.getElementsByTagName('a');    ele instanceof Array;  //结果:false,不是数组    ele instanceof Object; //结果:true,是对象
  Array.from(ele) instanceof Array;    //结果:true,是数组

2.将字符串转换成数组

 let str='hello';
 let newarr=Array.from(str)
   console.log(newarr) // ['h','e','l','l','o']

三、find()函数

函数作用:找出数组中符合条件的第一个元素。

let arr=[1,3,5,6,7]
    let x=arr.find(function(num){
    	return num<8 // 1
    	num>2 //3
    	num>9 // underfined
    })

可以看出 find()函数的参数是一个匿名函数,数组的每个元素都会进入匿名函数执行,直到结果为true,find函数就会返回value的值,如果所有元素都不符合匿名函数的条件,find( )函数就会返回undefind。

四、findIndex()函数

函数作用:返回符合条件的第一个数组成员的位置。

let arr=[1,3,5,6,7]
    let x=arr.findIndex(function(num){
    	return num<8 // 0
    	 num>2 // 1
    	 num>9   // -1
    })

可以看出数组元素是从0算起;不符合匿名函数的条件,findIndex( )函数就会返回-1。

五、fill( 所填元素,起始位置,结束位置 )函数

函数作用:用指定的值,填充到数组。

let arr=[1,3,5,6,7]
    arr.fill(10,0,1)
    console.log(arr) // [10,3,5,6,7]

可以看出会覆盖掉原数组的值

六、entries( )函数

函数作用:对数组的键值对进行遍历,返回一个遍历器,可以用for..of对其进行遍历。

for(let[key,value] of ['aa','bb'].entries()){
	console.log(key,value); // 0 'aa' 1 'bb'
}

七、keys( )函数

对数组的索引键进行遍历,返回一个遍历器。

for(let index of ['aa','bb'].keys()){
	console.log(index); // 0 1 
}

八、values( )函数

作用:对数组的元素进行遍历,返回一个遍历器。

 for(let value of ['aa','bb'].values()){
    	console.log(value); // aa bb 
 }



原文发布时间为:2018年03月31日
原文作者:前端喵 

本文来源:开源中国 如需转载请联系原作者


目录
相关文章
|
6月前
|
网络架构
ES6中数组新增了哪些扩展?
ES6中数组新增了哪些扩展?
75 1
|
6月前
|
JSON 自然语言处理 JavaScript
ES6 字符串的扩展
ES6 字符串的扩展
|
1月前
|
前端开发 网络架构
ES6对函数做了哪些扩展?
本文首发于微信公众号“前端徐徐”,介绍了 ES6 中函数参数的默认值、rest 参数、严格模式、name 属性、箭头函数、尾调用优化等新特性,并详细解释了各个特性的使用方法和注意事项。同时,还介绍了 ES2017 和 ES2019 中关于函数的一些改进,如函数参数尾逗号、`Function.prototype.toString()` 方法的修改以及 `catch` 语句参数的省略。
11 1
|
3月前
|
JavaScript 前端开发
利用ES6中的...扩展运算符来合并数组
本文介绍了使用ES6的新特性简化JavaScript编程的多种方法。其中包括使用扩展运算符`...`优雅地合并数组,解构赋值快速提取数组和对象值,`for...of`循环及箭头函数提升数组遍历效率,`find`方法简化数组搜索,`+`号与短路运算符优化数据类型转换及默认值设置,以及模板字符串和扩展运算符增强的对象合并技巧,这些方法让代码更加简洁高效。
25 0
|
自然语言处理 JavaScript 前端开发
ES6(字符串的扩展)
ES6(字符串的扩展)
94 0
|
JavaScript 前端开发 安全
ES6(数值的扩展)
ES6(数值的扩展)
66 0
|
11月前
|
网络架构
ES6学习(五)—数组的扩展
ES6学习(五)—数组的扩展
|
11月前
ES6学习(三)—字符串的扩展
ES6学习(三)—字符串的扩展
|
11月前
|
网络架构
ES6学习(六)—函数的扩展
ES6学习(六)—函数的扩展