美文网首页前端学习
如何删除 JavaScript 数组中的虚值

如何删除 JavaScript 数组中的虚值

作者: 1194b60087a9 | 来源:发表于2019-04-20 11:06 被阅读0次

Photo by Vincent van Zalinge on Unsplash

引用自 MDN:

falsy(虚值)是在 Boolean 上下文中已认定可转换为‘假‘的值.

JavaScript 在需要用到布尔类型值的上下文中使用强制类型转换(Type Conversion )将值转换为布尔值,比如:在条件语句或者循环语句中。

falsy 有时写作 falsey

在 JavaScript 中有很多方法可以从数组中删除元素,但是从数组中删除所有虚值的最简单方法是什么?为了回答这个问题,我们将仔细研究 truthy 与 falsy 值和类型强制转换

算法说明

从数组中删除所有虚值。

JavaScript 中的虚值是false、 null、 0、 ""、 undefined 和NaN。

提示:尝试将每个值转换为布尔值。

1functionbouncer(arr){

2returnarr;

3}

4

5bouncer([7,"ate","",false,9]);

提供的测试用例

bouncer([7, "ate", "", false, 9]) 应该返回[7, "ate", 9]。

bouncer(["a", "b", "c"]) 应该返回 ["a", "b", "c"]。

bouncer([false, null, 0, NaN, undefined, ""]) 应该返回 []。

bouncer([1, null, NaN, 2, undefined]) 应该返回 [1, 2]。

解决方案:.filter( ) 和 Boolean( )

理解问题:我们有一个作为输入的数组。目标是从数组中删除所有的虚值然后将其返回。

freeCodeCamp 上的好心人告诉我们,JavaScript 中的虚值是false、 null、 0、 ""、undefined 和NaN。

他们也给了我们一个重要的提示!他们建议将数组的每个值转换为布尔值以完成此挑战。我认为这个提示很不错!

示例/测试用例:前面提供的测试用例告诉我们,如果输入数组只包含虚值,那么应该只返回一个空数组。这非常简单。

数据结构:在这里我们将坚持使用数组。

我们来谈谈.filter():

.filter()创建一个新数组,其中包含通过所提供函数测试的所有元素。

换句话说,.filter() 遍历数组中的每个元素并保留通过其中某个测试的所有元素。数组中未通过该测试的所有元素都被过滤掉了 —— 被删除了。

如果我们有一个数组并且只想保留大于 100 的数字,可以用 .filter() 来实现:

1letnumbers = [4,56,78,99,101,150,299,300]

2numbers.filter(number=>number >100)

3// returns [ 101, 150, 299, 300 ]

我们再来谈谈那个将每个元素转换为布尔值的提示。这是一个很好的提示,因为我们可以用.filter() 返回只有真值(truthy)的数组。

我们将通过JavaScript类型转换来实现这一目标。

JavaScript 为我们提供了将一种数据类型转换为另一种的有用函数,String()转换为字符串,Number() 转换为数字,Boolean() 转换为布尔值。

例如:

1String(1234)

2// returns "1234"

3Number("47")

4// returns 47

5Boolean("meow")

6// returns true

Boolean() 是我们完成这个挑战所需要的函数。如果提供给 Boolean() 的参数是真值,那么Boolean() 将返回 true 。如果提供给 Boolean() 的参数是虚值,那么 Boolean() 将返回false。

这对我们非常有用,因为我们从指令中知道只有 false,null,0,"",undefined 和NaN 在 JavaScript 中是虚值。其他每一个值都是真值。知道如果我们将输入数组中的每个值都转换为布尔值,就可以删除所有值为 false 的元素,这就满足了此挑战的要求。

算法

确定 arr 中的哪些值是虚值。

删除所有虚值。

返回仅包含真值(truthy)的新数组。

代码

1functionbouncer(arr){

2// Use filter to remove falsy elements from arr.

3letonlyTruthyValues = arr.filter(element=>Boolean(element) ===true)

4//                                7          Boolean(7) is true

5//                                "ate"      Boolean("ate") is true

6//                                ""         Boolean("") is false

7//                                false      Boolean(false) is false

8//                                9          Boolean(9) is true

9

10// Return the new array.

11returnonlyTruthyValues

12//     [7, "ate", 9]

13}

14

15bouncer([7,"ate","",false,9]);

去掉注释并删除局部变量:

1functionbouncer(arr){

2returnarr.filter(element=>Boolean(element) ===true)

3}

4

5bouncer([7,"ate","",false,9]);

如果你有其他解决方案或建议,请在评论中分享!

本文是该系列 freeCodeCamp Algorithm Scripting 的一部分。

本文引用了 freeCodeCamp Basic Algorithm Scripting:Falsy Bouncer。

十五年编程经验,今年1月整理了一批2019年最新WEB前端教学视频,不论是零基础想要学习前端还是学完在工作想要提升自己,这些资料都会给你带来帮助,从HTML到各种框架,帮助所有想要学好前端的同学,学习规划、学习路线、学习资料、问题解答。只要加入WEB前端学习交流Q群:296212562,即可免费获取。

相关文章

  • 如何删除 JavaScript 数组中的虚值

    Photo by Vincent van Zalinge on Unsplash 引用自 MDN: falsy(虚...

  • Falsy Bouncer(过滤数组假值)

    过滤数组假值 (真假美猴王) 删除数组中的所有假值。 在JavaScript中,假值有false、null、0、"...

  • FCC-JS-BAS-Falsy Bouncer-过滤数组假值

    过滤数组假值 (真假美猴王) 删除数组中的所有假值。 在JavaScript中,假值有false、null、0、"...

  • 过滤数组假值,运用array.filter()方法和布尔值

    过滤数组假值 (真假美猴王) 删除数组中的所有假值。 在JavaScript中,假值有false、null、0、"...

  • 8.2练习

    一.删除特定值题目:删除数组中的所有的假值。在JavaScript中,假值有false、null、0、""、und...

  • 过滤数组假值

    删除数组中的所有假值。 在JavaScript中,假值有 false、null、0、""、undefined 和 ...

  • JavaScript知识整理——关于值

    数组 在Javascript中,数组可以容纳任何类型的值。 使用delete运算符删除数组中单元时,lenght属...

  • 磨人的NaN小妖精

    用这道题来理解NaN. 过滤数组假值 (真假美猴王) 删除数组中的所有假值。 在JavaScript中,假值有fa...

  • JavaScript 使用小技巧

    1.删除数组中的假值 我们时常需要在处理数据的时候要去掉假值。在Javascript中,假值是false, 0, ...

  • 记录

    JS如何删除对象中的某一属性 JavaScript数组去重(12种方法,史上最全)[https://segment...

网友评论

    本文标题:如何删除 JavaScript 数组中的虚值

    本文链接:https://www.haomeiwen.com/subject/vnekgqtx.html