JS-Falsy Bouncer

这篇文章我们主要介绍如何通过JavaScript处理falsy值。将要完成的任务是创建一个函数bouncer(),它接受一个数组arr做为参数,并且删除所有falsy值。

在大数多编程语言中都知道布尔数据类型,它可以设置为true或false。而在JavaScript中,每个值都有一个固定的布尔值,称之为truthy或falsy。在JavaScript中,我们可以通过逻辑来处理,达到我们预期想要的效果,但如果使用不小心或没有理解清楚,它可能会导致一些问题。

什么情况值是falsy
在JavaScript中,下列值总是falsy:

false
null
undefined
NaN
0
" "(空字符串)
而其它值总是truthy。包括空的函数、对象、数组或者"0"或"false"这样的字符串。

一些falsy值表现有所不同,比如null、undefined和NaN。拿NaN为例,虽然它是falsy,但并不表示是其自身,而undefined和null相当于是其自身。

如何检测一个值是不是falsy
检测一个值是不是falsy,在JavaScript中可以使用===和!==来比较对象的值和类型。简而言之,任何值,通过逻辑比较,如果返回的值是false,那么它就是一个falsy值,反之是truthy值。

如何删除数组中的falsy值
文章开头已经说过,今天的任务是创建一个bouncer(arr)函数,通过逻辑判断,删除数组中的falsy值。比如:

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]
实现思路
通过Boolean对象创建一个函数isFalsy(value),判断值value是不是一个falsy值
通过Array.prototype.filter()过滤掉数组arr中的falsy值,并且将遍历后的值存在一个result变量中,并且返回这个result值
思路清楚了就好处理了。在继续完成后面的任务之前,先来简单了解Boolean对象和Array.prototype.filter()的知识。

Boolean对象是一个包装了布尔值的对象。如果Boolean构造函数的参数不是一个布尔值,则该参数会被转换成一个布尔值。如果参数是falsy值(也就是0,-0,null,false,NaN,undefined或者空字符串""),生成的Boolean对象的值为false。其他任何值,包括任何对象或者字符串"0"或"false"都会创建一个值为true的Boolean对象。

JS-Falsy Bouncer_第1张图片
1E609780-A9C8-4127-BC22-470826BEEDF1.png
JS-Falsy Bouncer_第2张图片
A128D93E-922D-489F-9D30-7087A816FD76.png
JS-Falsy Bouncer_第3张图片
8EF62E56-451B-43A6-B5EA-DE354A5DEB3F.png
JS-Falsy Bouncer_第4张图片
3AA1884E-C660-4D9D-BC2D-8B09E0CC795B.png

原文: http://www.w3cplus.com/javascript/falsy-bouncer-in-javascript.html © w3cplus.com

你可能感兴趣的:(JS-Falsy Bouncer)