ES6使用 Array.includes 处理多重条件用法实例分析

本文实例讲述了ES6使用 Array.includes 处理多重条件用法。分享给大家供大家参考，具体如下：

includes   [ɪnk'lu:dz]  包含，包括

includes() 方法用来判断一个数组是否包含一个指定的值，如果是返回 true，否则false。

举个例子：

// 条件语句
function test(fruit) {
 if (fruit == 'apple' || fruit == 'strawberry') {
 console.log('red');
 }
}

乍一看，这么写似乎没什么大问题。然而，如果我们想要匹配更多的红色水果呢，我们是不是得用更多的 || 来扩展这条语句？

我们可以使用 Array.includes(Array.includes) 重写以上条件句。

function test(fruit) {
 // 把条件提取到数组中
 const redFruits = ['apple', 'strawberry', 'cherry', 'cranberries'];
 if (redFruits.includes(fruit)) {
 console.log('red');
 }
}

我们把红色的水果（条件）都提取到一个数组中，这使得我们的代码看起来更加优雅，整洁。

fromIndex 大于等于数组长度

如果fromIndex 大于等于数组长度 ，则返回 false 。该数组不会被搜索:

var arr = ['a', 'b', 'c'];
arr.includes('c', 3);  //false
arr.includes('c', 100); // false

计算出的索引小于 0

如果 fromIndex 为负值，计算出的索引将作为开始搜索searchElement的位置。如果计算出的索引小于 0，则整个数组都会被搜索。

// 数组长度是3
// fromIndex 是 -100
// computed index 是 3 + (-100) = -97

var arr = ['a', 'b', 'c'];
arr.includes('a', -100); // true
arr.includes('b', -100); // true
arr.includes('c', -100); // true

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具：http://tools.jb51.net/code/HtmlJsRun测试上述代码运行效果。

更多关于JavaScript相关内容可查看本站专题：《JavaScript操作DOM技巧总结》、《JavaScript页面元素操作技巧总结》、《JavaScript事件相关操作与技巧大全》、《JavaScript查找算法技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript错误与调试技巧总结》

希望本文所述对大家JavaScript程序设计有所帮助。

赞 (0)

相关推荐

  • JavaScript中数组Array.sort()排序方法详解

    JavaScript中数组的sort()方法主要用于对数组的元素进行排序.其中,sort()方法有一个可选参数.但是,此参数必须是函数. 数组在调用sort()方法时,如果没有传参将按字母顺序(字符编码顺序)对数组中的元素进行排序,如果想按照其他标准进行排序,就需要进行传一个参数且为函数,该函数要比较两个值,并且会返回一个用于说明这两个值的相对顺序的数字. 1.对数字数组进行由小到大的顺序进行排序. 代码: var arr = [22,12,3,43,56,47,4]; arr.sort();

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

    在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)) 结果:

  • javascript Array.remove() 数组删除

    复制代码 代码如下: Array.prototype.remove = function(b) { var a = this.indexOf(b); if (a >= 0) { this.splice(a, 1); return true; } return false; }; 以后使用过程中,就可以直接利用这个函数,删除数组中的值了.

  • JS Array.slice 截取数组的实现方法

    slice定义和用法 slice() 方法可从已有的数组中返回选定的元素. 语法 arrayObject.slice(start,end) 参数 描述 start 必需.规定从何处开始选取.如果是负数,那么它规定从数组尾部开始算起的位置.也就是说,-1 指最后一个元素,-2 指倒数第二个元素,以此类推. end 可选.规定从何处结束选取.该参数是数组片断结束处的数组下标.如果没有指定该参数,那么切分的数组包含从 start 到数组结束的所有元素.如果这个参数是负数,那么它规定的是从数组尾部开始算

  • js利用Array.splice实现Array的insert/remove

    arrayObj.splice(start, deleteCount, [item1[, item2[, . . . [,itemN]]]]) 参数 arrayObj 必选项.一个 Array 对象. start 必选项.指定从数组中移除元素的开始位置,这个位置是从 0 开始计算的. deleteCount 必选项.要移除的元素的个数. item1, item2,. . .,itemN 必选项.要在所移除元素的位置上插入的新元素. 说明 splice 方法可以移除从 start 位置开始的指定个

  • Javascript中Array.prototype.map()详解

    在我们日常开发中,操作和转换数组是一件很常见的操作,下面我们来看一个实例: 复制代码 代码如下: var desColors = [],     srcColors = [         {r: 255, g: 255, b: 255 }, // White         {r: 128, g: 128, b: 128 }, // Gray         {r: 0,   g: 0,   b: 0   }  // Black     ]; for (var i = 0, ilen = sr

  • Javascript中关于Array.filter()的妙用详解

    前言 和map类似,Array的filter也接收一个函数.但是和map不同的是, filter把传入的函数依次作用于每个元素,然后根据返回值是 true 还是false决定保留还是丢弃该元素. 实例介绍 例如,在一个Array中,删掉偶数,只保留奇数,可以这么写: var arr = [1, 2, 4, 5, 6, 9, 10, 15]; var r = arr.filter(function (x) { return x % 2 !== 0; }); r; // [1, 5, 9, 15]

  • js Array.slice的8种不同用法示例

    前言 JS数组slice方法是JS语言中最强大.最常用的内建函数之一. 随着React和其他面向功能的JavaScript实践的兴起,它变得越来越重要,原因有两个: 函数式编程,尤其是高阶函数,与数据列表密切配合 函数式编程需要纯函数,即不会产生副作用或修改输入数据的函数 JavaScript 数组slice方法符合这两个标准. slice方法可以在不修改原始列表的情况下创建列表子集的浅拷贝.因此,它为编写函数式 JS 提供了一个关键的构建块. 在这篇文章中,我们将通过实例来掌握slice方法,

  • 你应该了解的JavaScript Array.map()五种用途小结

    前言 从经典的 for 循环到 forEach() 方法,用于迭代数据集合的各种技术和方法比比皆是.但是现在比较流行的方法是 .map() 方法. .map() 通过指定函数调用一个数组中每一项元素,来创建一个新数组. .map() 是一种 non-mutating(非变异) 方法,它创建一个新数组,而不是只对调用数组进行更改的 mutating(变异) 方法.这可能很难记住. 语法: array.map(function(currentValue,index,arr), thisValue)

  • ES6使用 Array.includes 处理多重条件用法实例分析

    本文实例讲述了ES6使用 Array.includes 处理多重条件用法.分享给大家供大家参考,具体如下: includes   [ɪnk'lu:dz]  包含,包括 includes() 方法用来判断一个数组是否包含一个指定的值,如果是返回 true,否则false. 举个例子: // 条件语句 function test(fruit) { if (fruit == 'apple' || fruit == 'strawberry') { console.log('red'); } } 乍一看,

  • es6数组的flat()，flatMap()函数用法实例分析

    本文实例讲述了es6数组的flat(),flatMap()函数用法.分享给大家供大家参考,具体如下: 数组的成员有时还是数组,Array.prototype.flat()用于将嵌套的数组"拉平",变成一维数组.该方法返回一个新数组,对原数据没有影响. [1, 2, [3, 4]].flat() // [1, 2, 3, 4] 上面代码中,原数组的成员里面有一个数组,flat()方法将子数组的成员取出来,添加在原来的位置. flat()默认只会"拉平"一层,如果想要&

  • ES6学习笔记之let与const用法实例分析

    本文实例讲述了ES6学习笔记之let与const用法.分享给大家供大家参考,具体如下: 在ES6中不是var,而是通过let来声明变量,用const来声明常量,有如下一些不同: 1.let与const作用域只限于当前代码块{},而var则没有这种限制. 2.使用let.const申明的变量作用域不会被提升.例如: console.log(str); var str="var declare"; 控制台输出undefined:因为变量申明是在任意代码执行前处理的,在代码区中任意地方声明变

  • es6中Promise 对象基本功能与用法实例分析

    本文实例讲述了es6中Promise 对象基本功能与用法.分享给大家供大家参考,具体如下: Promise 是异步编程的一种解决方案,解决--回调函数和事件 ES6 规定,Promise对象是一个构造函数,用来生成Promise实例. 下面代码创造了一个Promise实例. 基本用法 ES6 规定,Promise对象是一个构造函数,用来生成Promise实例. const promise = new Promise(function(resolve, reject) { //resolve (d

  • Python iter()函数用法实例分析

    本文实例讲述了Python iter()函数用法.分享给大家供大家参考,具体如下: python中的迭代器用起来非常灵巧,不仅可以迭代序列,也可以迭代表现出序列行为的对象,例如字典的键.一个文件的行,等等. 迭代器就是有一个next()方法的对象,而不是通过索引来计数.当使用一个循环机制需要下一个项时,调用迭代器的next()方法,迭代完后引发一个StopIteration异常. 但是迭代器只能向后移动.不能回到开始.再次迭代只能创建另一个新的迭代对象. 反序迭代工具:reversed()将返回

  • Python callable()函数用法实例分析

    本文实例讲述了Python callable()函数用法.分享给大家供大家参考,具体如下: python中的内建函数callable( ) ,可以检查一个对象是否是可调用的 . 对于函数, 方法, lambda 函数式, 类, 以及实现了 _ _call_ _ 方法的类实例, 它都返回 True. >>> help(callable) Help on built-in function callable in module __builtin__: callable(...) calla

  • Python lambda函数基本用法实例分析

    本文实例讲述了Python lambda函数基本用法.分享给大家供大家参考,具体如下: 这里我们简单学习一下python lambda函数. 首先,看一下python lambda函数的语法,如下: f=lambda [parameter1,parameter2,--]:expression lambda语句中,冒号前是参数,可以有0个或多个,用逗号隔开,冒号右边是返回值.lambda语句构建的其实是一个函数对象. 1>无参数 f=lambda :'python lambda!' >>&

  • Tensorflow tf.tile()的用法实例分析

    tf.tile()应用于需要张量扩展的场景,具体说来就是: 如果现有一个形状如[width, height]的张量,需要得到一个基于原张量的,形状如[batch_size,width,height]的张量,其中每一个batch的内容都和原张量一模一样.tf.tile使用方法如: tile( input, multiples, name=None ) import tensorflow as tf a = tf.constant([7,19]) a1 = tf.tile(a,multiples=[

  • java队列之queue用法实例分析

    Queue: 基本上,一个队列就是一个先入先出(FIFO)的数据结构 Queue接口与List.Set同一级别,都是继承了Collection接口.LinkedList实现了Deque接 口. Queue的实现 1.没有实现的阻塞接口的LinkedList: 实现了java.util.Queue接口和java.util.AbstractQueue接口 内置的不阻塞队列: PriorityQueue 和 ConcurrentLinkedQueue PriorityQueue 和 Concurren

随机推荐