ES6中Array.includes()函数的用法


Posted in Javascript onSeptember 20, 2017

在ES5,Array已经提供了indexOf用来查找某个元素的位置,如果不存在就返回-1,但是这个函数在判断数组是否包含某个元素时有两个小不足,第一个是它会返回-1和元素的位置来表示是否包含,在定位方面是没问题,就是不够语义化。另一个问题是不能判断是否有NaN的元素。

const arr1 = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', NaN]
console.log('%s', arr1.indexOf(NaN))

结果:

-1

ES6提供了Array.includes()函数判断是否包含某一元素,除了不能定位外,解决了indexOf的上述的两个问题。它直接返回true或者false表示是否包含元素,对NaN一样能有有效。

const arr1 = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', NaN]
console.log('%s', arr1.includes('c'))
console.log('%s', arr1.includes('z'))
console.log('%s', arr1.includes(NaN))

结果:

true
false
true

includes()函数的第二个参数表示判断的起始位置。

const arr1 = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', NaN]
console.log('%s', arr1.includes('d', 1))
console.log('%s', arr1.includes('d', 3))
console.log('%s', arr1.includes('d', 4))

结果:

true
true
false

第二个参数也可以是负数,表示从右数过来第几个,但是不改变判断搜索的方向,搜索方向还是从左到右。

console.log('%s', arr1.includes('k', -1))
console.log('%s', arr1.includes('k', -2))
console.log('%s', arr1.includes('i', -3))

结果:

false
true
false

总结

以上所述是小编给大家介绍的ES6中Array.includes()函数的用法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
jquery tools系列 expose 学习
Sep 06 Javascript
jquery EasyUI的formatter格式化函数代码
Jan 12 Javascript
jquery实现的让超出显示范围外的导航自动固定屏幕最顶上
Sep 22 Javascript
IE与FireFox的JavaScript兼容问题解决办法
Dec 31 Javascript
使用原生js实现页面蒙灰(mask)效果示例代码
Jun 20 Javascript
JavaScript识别网页关键字并进行描红的方法
Nov 09 Javascript
14 个折磨人的 JavaScript 面试题
Aug 08 Javascript
分析javascript原型及原型链
Mar 18 Javascript
Angular搜索场景中使用rxjs的操作符处理思路
May 30 Javascript
微信小程序module.exports模块化操作实例浅析
Dec 20 Javascript
基于webpack4.X从零搭建React脚手架的方法步骤
Dec 23 Javascript
JS中封装axios来管控api的2种方式
Sep 11 Javascript
微信小程序视图template模板引用的实例详解
Sep 20 #Javascript
highcharts 在angular中的使用示例代码
Sep 20 #Javascript
jQuery实现可兼容IE6的滚动监听功能
Sep 20 #jQuery
Bootstrap Table快速完美搭建后台管理系统
Sep 20 #Javascript
VUE页面中加载外部HTML的示例代码
Sep 20 #Javascript
JavaScript实现焦点进入文本框内关闭输入法的核心代码
Sep 20 #Javascript
微信小程序 配置顶部导航条标题颜色的实现方法
Sep 20 #Javascript
You might like
php 什么是PEAR?(第三篇)
2009/03/19 PHP
php 邮件发送问题解决
2014/03/22 PHP
PHP5.2下preg_replace函数的问题
2015/05/08 PHP
PHP微信分享开发详解
2017/01/14 PHP
javascript showModalDialog,open取得父窗口的方法
2010/03/10 Javascript
为jQuery增加join方法的实现代码
2010/11/28 Javascript
jQuery数组处理代码详解(含实例演示)
2012/02/03 Javascript
点击显示指定元素隐藏其他同辈元素的方法
2014/02/19 Javascript
node.js中的fs.chown方法使用说明
2014/12/16 Javascript
深入理解JavaScript系列(25):设计模式之单例模式详解
2015/03/03 Javascript
JS获取网页图片name属性的方法
2015/04/01 Javascript
JavaScript中使用指数方法Math.exp()的简介
2015/06/15 Javascript
CSS图片响应式 垂直水平居中
2015/08/14 Javascript
AngularJS使用ngMessages进行表单验证
2015/12/27 Javascript
Jquery attr()方法 属性赋值和属性获取详解
2016/04/15 Javascript
浅谈jquery点击label触发2次的问题
2016/06/12 Javascript
Bootstrap modal使用及点击外部不消失的解决方法
2016/12/13 Javascript
微信小程序 生命周期和页面的生命周期详细介绍
2017/01/19 Javascript
bootstrap table之通用方法( 时间控件,导出,动态下拉框, 表单验证 ,选中与获取信息)代码分享
2017/01/24 Javascript
JavaScript与JQUERY获取元素的宽、高和位置
2017/02/26 Javascript
node.js中express中间件body-parser的介绍与用法详解
2017/05/23 Javascript
JS如何获取地址栏的参数实例讲解
2018/10/06 Javascript
vue学习笔记之slot插槽基本用法实例分析
2020/02/01 Javascript
Python读取环境变量的方法和自定义类分享
2014/11/22 Python
Python自动扫雷实现方法
2015/07/25 Python
python批量导入数据进Elasticsearch的实例
2018/05/30 Python
Python求两个圆的交点坐标或三个圆的交点坐标方法
2018/11/07 Python
Python3实现汉语转换为汉语拼音
2019/07/08 Python
Python使用贪婪算法解决问题
2019/10/22 Python
Python迭代器协议及for循环工作机制详解
2020/07/14 Python
简单介绍Object类的功能、常用方法
2013/10/02 面试题
如何编写优秀的食品项目创业计划书
2014/01/23 职场文书
2014年监理工作总结范文
2014/11/17 职场文书
2014年扫黄打非工作总结
2014/12/03 职场文书
公司致全体员工的感谢信
2019/06/24 职场文书
十大公认最好看的动漫:《咒术回战》在榜,《钢之炼金术师》第一
2022/03/18 日漫