ES5-ES6-ES7_数组的扩展
Array.prototype.indexOf(value)
得到值在数组中的第一个下标,如果元素不存在返回-1,可以用来判断是否包含指定的元素
var arr = [6,5,4,3,1,7,6]; console.log(arr.indexOf(5))
Array.prototype.includes(value)
判断数组中是否包含指定value
var arr = [6,5,4,3,1,7,6]; console.log(arr.includes(5)) // true console.log(arr.includes(8)) // false
Array.prototype.lastIndexOf(value)
得到值在数组中的最后一个下标
var arr = [6,5,4,3,1,7,6]; console.log(arr.lastIndexOf(6))
Array.prototype.forEach(function(item, index){})
遍历数组
var arr = [6,5,4,3,1,7,6];
arr.forEach(function (item, index) {
console.log(item + '-' + index) // index是角标,item是元素值
})
Array.prototype.map(function(item, index){})
遍历数组返回一个新的数组,返回加工之后的值
var arr = [6,5,4,3,1,7,6];
var newArr = arr.map(function (item, index) {
return item + 10
})
console.log(newArr)
Array.prototype.filter(function(item, index){})
遍历过滤出一个新的子数组, 返回条件为true的值
var arr = [6,5,4,3,1,7,6];
var newArr = arr.filter(function (item, index) {
return item > 5 //将arr数组中所有大于5的元素添加到一个新的数组中
})
console.log(newArr)
Array.from(v)
将伪数组对象或可遍历对象转换为真数组
<html lang="en">
<head>
<meta charset="UTF-8">
<title>03_数组扩展</title>
</head>
<body>
<button>测试1</button>
<br>
<button>测试2</button>
<br>
<button>测试3</button>
<br>
<script type="text/javascript">
let btns = document.getElementsByTagName('button') //现在btns也是一个数组(伪数组,没有数组一般的方法)
// 因为btns是个伪数组,没有数组的一般方法,所以会报错
// btns.forEach(function (item, index) {
// console.log(item)
// })
// 将伪数组对象转换为真数组
Array.from(btns).forEach(function (item, index) {
console.log(item)
})
</script>
</body>
</html>
Array.of(v1, v2, v3)
将一系列值转换成数组
console.log(Array.of('3', 3, '4')) //["3", 3, "4"]
find(function(value, index, arr){return true})和findIndex(function(value, index, arr){return true})
find:找出第一个满足条件返回true的元素
findIndex:找出第一个满足条件返回true的元素下标
let arr = [4,5,1,6,4,7,9,13]
let result = arr.find(function (item, index) {
return item > 3
})
let resultIndex = arr.findIndex(function (item, index) {
return item > 3
})
console.log(result) //4,也就是数组中的第一个元素的值,满足了条件大于3
console.log(resultIndex) //0,也就是数组中的第一个元素的下标,满足了条件大于3
ES5-ES6-ES7_数组的扩展的更多相关文章
- ES6对数组的扩展(简要总结)
文章目录 数组的扩展(ES6) 1. 扩展运算符 2. Array.from 3. Array.of() 4. copyWithin() 5. find() 和 findIndex() 6. fill ...
- ES6 之 数组的扩展
ES5 检测数组 let arr = [1,2,3,4] Array.isArray(arr) arr instanceof Array 转换方法 arr.toLocaleString() arr.t ...
- ES6对数组的扩展
ECMAScript6对数组进行了扩展,为数组Array构造函数添加了from().of()等静态方法,也为数组实例添加了find().findIndex()等方法.下面一起来看一下这些方法的用法. ...
- 【ES6】数组的扩展——扩展运算符
1.扩展运算符[三个点(...)将一个数组转为用逗号分隔的参数序列] 作用:用于函数调用 function add(x, y) { return x + y; } const numbers = [2 ...
- 【ES6】数组的扩展
1.Array.from(): 将伪数组对象和遍历的对象转为真数组 如果一个对象的键都是正整数或者0,并且有 Length属性,那么这个对象很想数组,称它为伪数组. 伪数组: let obj = { ...
- 数组的复制及ES6数组的扩展
一.数组的复制 // alert([1,2,3]==[1,2,3]); let cc = [0,1,2]; let dd = cc; alert(dd==cc);//此时改变dd会影响cc ES5 只 ...
- ES6的新特性(8)——数组的扩展
数组的扩展 扩展运算符 含义 扩展运算符(spread)是三个点(...).它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列. console.log(...[1, 2, 3]) / ...
- ES6数组的扩展运算符
一.基本使用 ES6中函数可以使用 rest参数 接收函数的多余参数,组成一个数组,放在形参的最后面. let fn = (a, ...value) => { console.log(a); c ...
- ES6学习(三):数组的扩展
chapter08 数组的扩展 8.1 扩展运算符 8.1.1 扩展运算符的含义 ... 如同rest运算符的逆运算,将一个数组转换为用逗号分隔的参数序列. console.log(...[1, 2, ...
- ES6学习笔记(六)数组的扩展
1.扩展运算符 1.1含义 扩展运算符(spread)是三个点(...).它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列. console.log(...[1, 2, 3]) // ...
随机推荐
- Webservice开发、引用
一.Webservice开发 1.在解决方案右键添加新建项目,新建空的web应用程序 2.在新建的项目右键添加新建项选择web服务 3.这里就是webservice 里的方法,可以添加自己需要的方法( ...
- 在CentOS下面安装hue时报的错
说明:我的系统为CentOS 7 ,系统自带的python版本为2.7.5. 安装hue时,推荐使用2.7.0以上的版本,可以自己查看自己系统自带的版本 若是版本不对,要升级为2.7的版本,这里不再说 ...
- H5新增特性、方法
1.FileReader和progress实现实时监控文件上传进度 2.HTML5新增的客户端校验 1.调用checkValidity方法进行校验 2.setCustomValidity自定义错误
- js正整数正则表达式
function testNumber(){ var yourinputValue=$("#yourinputId").val(); var reg = /^[1-9]\d*$/; ...
- java调用matlab
object result[]; result = pClass1.job_3in1(2, c, ws2, 1275, a, 0); string adg[]; adg = result[1].toS ...
- 如何用ABP框架快速完成项目(2) - 快的定义!
为什么要从快的角度来讲这系列课程呢? 因为快是一个很统一很清晰的标准. 所有人对时间都有一个统一清晰的概念. 比如说这系列课程会讲到的一个实例: 集成LinqToExcel, 用我的方法大概耗时 ...
- 浅谈servlet与jsp的关系
servlet是用java语言编写的,是一个java类.主要功能是用来接受.处理客户端的请求,并把处理结果返回到客户端显示.Jsp是servlet发展后期的产物.在没有jsp之前,servlet利用输 ...
- .net webapi 后台导出excel 申请付款单实例
[HttpGet, AllowAnonymous] public void ExportSettlementPrint(string code) { FinSettlementModel settle ...
- 章节五、2-Package包和权限修饰符
一.Package包 为了更好的组织类,java提供了包机制,用于区别类名的命名空间. 包的作用: 1.把功能相似或相关的类或接口组织在同一个包中,方便类的查找和使用. 2.如同文件夹一样,包也采用了 ...
- CSS回顾(常见问题解决)
一.margin的塌陷解决: BFC (block format context)块级格式化上下文格式 display:inline-block float:left / right overflow ...