怎樣使你的 JavaScript 代碼簡單易讀

翻譯:瘋狂的技術宅javascript

medium.freecodecamp.org/how-to-keep…前端

img

解決一個問題能夠有不少方法,可是有些方法很複雜,甚至有些是荒謬的。在本文中,我想談談解決一個問題時的好方案和壞方案。java


#1

讓咱們先從怎樣刪除數組中的重複項這個簡單問題開始。數組

複雜 - 使用 forEach 刪除重複項

首先,咱們新建立一個空數組,用 forEach() 在數組的每一個元素上執行一次提供的函數。最後檢查新數組中是否存在該值,若是不存在,則添加它。bash

function removeDuplicates(arr) {  
   const uniqueVals = [];   
   arr.forEach((value,index) => {     
       if(uniqueVals.indexOf(value) === -1) {
           uniqueVals.push(value);
       }  
   });
  return uniqueVals;
}
複製代碼

簡單 - 使用 filter 刪除重複項

filter 方法建立一個包含全部元素的新數組,經過提供的函數進行測試。基本上咱們只須要迭代數組,並檢查當前元素在數組中出現的第一個位置是否和當前位置相同。固然,這兩個位置對於重複元素來講是不一樣的。函數

function removeDuplicates(arr) {
  return arr.filter((item, pos) => arr.indexOf(item) === pos)
}
複製代碼

簡單 - 使用 Set 刪除重複項

ES6 提供了 **Set ** 對象,這使事情變得更加容易。 Set 僅容許存在惟一值,因此當你傳入數組時,它會自動刪除重複的值。 可是,若是你須要一個包含惟一元素的數組,爲何不一開始就用 Set 呢?測試

function removeDuplicates(arr) {
   return [...new Set(arr)];
}
複製代碼

#2

接下來讓咱們解決第二個問題:寫一個函數,向該函數傳入一組非負整數,其中的值各不不一樣,要求使它們連續,並返回缺失的數字個數。ui

對於const arr = [4,2,6,8],輸出應爲編碼

countMissingNumbers(arr)= 3spa

你能夠看到 357 是缺失的。

複雜 - 使用 sort 和 for 循環解決

要得到最小和最大的數字,咱們須要用用 sort方法按升序進行排序來達到這個目的,而後從最小的數字循環到最大的數字。每次檢查數組中是否存在應該出現的序號,若是不存在,就對計數器加一。

function countMissingNumbers(arr) {
    arr.sort((a,b) => a-b);    
    let count = 0;    
    const min = arr[0];    
    const max = arr[arr.length-1];
    for (i = min; i<max; i++) {
      if (arr.indexOf(i) === -1) {
          count++;         
      }      
    }        
    return count;
}
複製代碼

簡單 - 使用 Math.max 和 Math.min 求解

這個解決方案有一個簡單的解釋:Math.max()函數返回數組中最大的數字,而Math.min() 返回數組中最小的數字。

首先,若是沒有丟失數字,咱們能知道數組中有多少個數字。因此能夠用如下公式 maxNumber - minNuber + 1,並用這個結果減去數組長度,獲得的差就是缺失數字的個數。

function countMissingNumbers(arr) {
      return Math.max(...arr) - Math.min(...arr) + 1 - arr.length;
}
複製代碼

#3

最後一個問題是檢查字符串是否爲迴文。所謂 迴文 是一個從左到右和從右到左讀起來都同樣的字符串。

複雜 - 使用 for 循環檢查

這個方法的循環從字符串的第一個字符開始,一直到字符串長度的一半。字符串中最後一個字符的索引是 string.length-1,倒數第二個字符的索引是string.length-2,依此類推。因此在這裏咱們檢查從左邊開始的指定索引處的字符是否等於右邊指定索引處的字符。若是它們不相等,就返回false。

function checkPalindrome(inputString) { 
   let length = inputString.length
   for (let i =0; i<length / 2; i++) {
        if (inputString[i] !== inputString[length - 1 -i]) {
             return false        
        }
   }
  return true
}
複製代碼

簡單 - 用 reverse 和 join 檢查

我認爲這個解決方案簡單到不須要解釋,由於代碼自己說明了一切。咱們只需使用 spread operator 從字符串建立一個數組,而後reverse數組,最後用 join 方法將其再次轉換爲字符串,並與原始字符串進行比較。

function checkPalindrome(string) {
   return string === [...string].reverse().join('');
}
複製代碼

保持簡單!

當有更簡單的方法時,爲何要搞得那麼複雜?但願你能從這篇文章中學到一些頗有意思的思路。祝你有一個美好的編碼時間,儘可能不要讓生活中簡單的事情複雜化。

歡迎關注公衆號:前端先鋒,獲取更多前端乾貨。

相關文章
相關標籤/搜索