菜单 学习猿地 - LMONKEY

VIP

开通学习猿地VIP

尊享10项VIP特权 持续新增

知识通关挑战

打卡带练!告别无效练习

接私单赚外块

VIP优先接,累计金额超百万

学习猿地私房课免费学

大厂实战课仅对VIP开放

你的一对一导师

每月可免费咨询大牛30次

领取更多软件工程师实用特权

入驻
36
0

如何使你的JavaScript代码简单易读

原创
05/13 14:22
阅读数 1257

解决同一问题的方法有很多,但有些解决方法很复杂,甚至有些是荒谬的。在这篇文章中,我想谈谈解决同样问题的好方法和坏方法。

让我们先从怎样删除数组中的重复项这个简单问题开始。

复杂 - 使用 forEach 删除重复项

首先,我们新创建一个空数组,用 forEach() 在数组的每个元素上执行一次提供的函数。最后检查新数组中是否存在该值,如果不存在,则添加它。

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)];
}

接下来让我们解决第二个问题:写一个函数,向该函数传入一组非负整数,其中的值各不不同,要求使它们连续,并返回缺失的数字个数。

对于const arr = [4,2,6,8],输出应为

countMissingNumbers(arr)= 3

你可以看到 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;
}

最后一个问题是检查字符串是否为回文。所谓 回文 是一个从左到右和从右到左读起来都一样的字符串。

复杂 - 使用 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('');
}

保持简单!

当有更简单的方法时,为什么要搞得那么复杂?希望你能从这篇文章中学到一些很有意思的思路。祝你有一个美好的编码时间,尽量不要让生活中简单的事情复杂化。

原文地址:https://www.freecodecamp.org/news/how-to-keep-your-javascript-code-simple-and-easy-to-read-bff702523e7c/

发表评论

0/200
36 点赞
0 评论
收藏
为你推荐 换一批