如何刪除 JavaScript 數組中的虛值

時間 2019-11-08

原文原文鏈接

翻譯：瘋狂的技術宅
https://medium.freecodecamp.o...

本文首發微信公衆號：前端先鋒
歡迎關注，天天都給你推送新鮮的前端技術文章javascript

引用自 MDN:前端

falsy(虛值)是在 Boolean 上下文中已認定可轉換爲‘假‘的值.
JavaScript 在須要用到布爾類型值的上下文中使用強制類型轉換(Type Conversion )將值轉換爲布爾值，好比：在條件語句或者循環語句中。java

falsy 有時寫做 falsey程序員

在 JavaScript 中有不少方法能夠從數組中刪除元素，可是從數組中刪除全部虛值的最簡單方法是什麼？爲了回答這個問題，咱們將仔細研究 truthy 與 falsy 值和類型強制轉換。面試

算法說明

從數組中刪除全部虛值。
JavaScript 中的虛值是 false、 null、 0、 ""、 undefined 和 NaN。
提示：嘗試將每一個值轉換爲布爾值。

function bouncer(arr) {
  return arr;
}

bouncer([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。segmentfault

他們也給了咱們一個重要的提示！他們建議將數組的每一個值轉換爲布爾值以完成此挑戰。我認爲這個提示很不錯！數組

示例/測試用例：前面提供的測試用例告訴咱們，若是輸入數組只包含虛值，那麼應該只返回一個空數組。這很是簡單。微信

數據結構：在這裏咱們將堅持使用數組。數據結構

咱們來談談.filter()：

.filter()建立一個新數組，其中包含經過所提供函數測試的全部元素。

換句話說，.filter() 遍歷數組中的每一個元素並保留經過其中某個測試的全部元素。數組中未經過該測試的全部元素都被過濾掉了 —— 被刪除了。

若是咱們有一個數組而且只想保留大於 100 的數字，能夠用 .filter() 來實現：

let numbers = [4, 56, 78, 99, 101, 150, 299, 300]
numbers.filter(number => number > 100)
// returns [ 101, 150, 299, 300 ]

咱們再來談談那個將每一個元素轉換爲布爾值的提示。這是一個很好的提示，由於咱們能夠用 .filter() 返回只有真值（truthy）的數組。

咱們將經過JavaScript類型轉換來實現這一目標。

JavaScript 爲咱們提供了將一種數據類型轉換爲另外一種的有用函數， String()轉換爲字符串，Number() 轉換爲數字，Boolean() 轉換爲布爾值。

例如：

String(1234)
// returns "1234"
Number("47")
// returns 47
Boolean("meow")
// returns true

Boolean() 是咱們完成這個挑戰所須要的函數。若是提供給 Boolean() 的參數是真值，那麼 Boolean() 將返回 true 。若是提供給 Boolean() 的參數是虛值，那麼 Boolean() 將返回 false。

這對咱們很是有用，由於咱們從指令中知道只有 false，null，0，""，undefined 和 NaN 在 JavaScript 中是虛值。其餘每個值都是真值。知道若是咱們將輸入數組中的每一個值都轉換爲布爾值，就能夠刪除全部值爲 false 的元素，這就知足了此挑戰的要求。

算法：

肯定 arr 中的哪些值是虛值。
刪除全部虛值。
返回僅包含真值（truthy）的新數組。

代碼：

function bouncer(arr) {
  // Use filter to remove falsy elements from arr.
  let onlyTruthyValues = arr.filter(element => Boolean(element) === true)
  //                                7          Boolean(7) is true
  //                                "ate"      Boolean("ate") is true
  //                                ""         Boolean("") is false
  //                                false      Boolean(false) is false
  //                                9          Boolean(9) is true

  // Return the new array.
  return onlyTruthyValues
  //     [7, "ate", 9]
}

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

去掉註釋並刪除局部變量：

function bouncer(arr) {
  return arr.filter(element => Boolean(element) === true)
}

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

若是你有其餘解決方案或建議，請在評論中分享！

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

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

本文首發微信公衆號：前端先鋒

歡迎掃描二維碼關注公衆號，天天都給你推送新鮮的前端技術文章

歡迎繼續閱讀本專欄其它高贊文章：

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。