10个你每天都需要用到的Javascript代码片段

￡神魔★判官ぃ 2023-01-13 12:52 76阅读 0赞

![8617c85e1ab3f015c5de794658d48e1a.png][]

英文 | https://medium.com/dev-genius/10-useful-javascript-code-snippets-that-you-need-everyday-2de5c4ef79c6

翻译 | 小爱

程序员总是喜欢做一些新的事情，但是每个项目都必须包含一些基本和常规的事情。

在这里，我想与你分享一些工作中经常使用到的JavaScript代码片段，从中可以找到新的内容。

# **1、遍历对象** #

循环遍历对象是每种编程语言的常规需求。有时，它可能是具有多个键和值的复杂对象。通过这种配对有点令人困惑。在这里，我将描述两种可能的方式。

代码如下：

// Simple way
    const person = { name: "Shoaib", Age: 25, Gender: "Male" };
    for (const property in person) {
      console.log(`${property}: ${person[property]}`);
    }
    
    
    // Another way
    const anotherPerson = {
      Name: 'Shoaib',
      Age: 25,
      Gender:"Male"
    };
    
    
    for (const [key, value] of Object.entries(anotherPerson)) {
      console.log(`${key}: ${value}`);
    }

# **2、查找对象数组** #

进入阵列是日常开发或编程中最需要完成的任务。在这里，我们使用find函数来执行此操作。该功能也适用于其他阵列。数字数组，对象数组，字符串数组，所有内容都支持此方法。

代码如下：

# **3、对数组排序** #

对数组进行排序是一个令人困惑且经常使用的代码段。Javascript具有其内置sort()功能。此方法适用于字母排序。因此，针对数字的解决方案是添加一个处理数字类型的新方法。在这里，我描述了字母排序和数字排序。

注意：在期望数值排序时，请不要忘记使用新方法。

// sort alphabetically
    const name = ['Shoaib', 'Mehedi', 'Alex', 'Jane'];
    const arr = [1, 30, 4, 21, 100000];
    name.sort();
    console.log(name);
    
    
    // sort numerically
    arr.sort(function(a, b) {
      return a - b;
    });
    
    
    console.log(arr);

# **4、字符串反转** #

字符串反向是一个基本而普遍的问题。在这里，我将展示一些可能的方法。

*  Reverse using basic functions。只是拆分一个字符串并创建一个数组，然后反转它，最后，你去加入它。
 *  Reverse using a loop。以相反的顺序循环遍历一个数组，并将其添加到新变量中，就可以了。
 *  最后一种可能的解决方案是recursion function。看看吧。

// reverse using basic functions
    function reverse(string) {
        return string.split("").reverse().join("");
    }
    console.log(reverse('shoaib'));
    
    
    // reverse using loop
    function reverse(string) {
        var newString = "";
        for (var i = string.length - 1; i >= 0; i--) {
            newString += string[i];
        }
        return newString;
    }
    console.log(reverse('shoaib'));
    
    
    // reverse using recursion function
    function reverse(string) {
      if (string === "")
        return "";
      else
        return reverse(string.substr(1)) + string.charAt(0);
    }
    console.log(reverse('shoaib'));

# **5、查找最大数量的阵列** #

这是一种查找最大数组数的方法。也可以循环执行此操作，但这是下面的一种简单方法。

const array1 = [1, 3, 2];
    console.log(Math.max(...array1));
    // expected output: 3

# **6、合并数组** #

合并数组可以通过多种方式完成。一种是内置concat()功能。另一个是点差运算符（…）。在这里，我解释了两者。

let arrOne = [1,3,5]
    let arrTwo = [2,4,6]
    // first way
    let combine = arrOne.concat(arrTwo) 
    console.log(combine)
    // second way
    combine = [...arrOne,...arrTwo]
    console.log(combine)

# **7、错误处理** #

try-catch语句适用于异常处理程序。只需将你的代码放入try块中即可。如果一切正常，就可以开始工作了，如果发生异常，你的代码将执行catch块，并且你可以在catch块中做任何你想做的事情。错误报告和其他决策主要在catch块中执行。

最后，使用try-catch也是必不可少的。try语句执行后，将执行“最后”块。

try {
      try_statements
    }
    catch (exception_var) {
      catch_statements
    }
    finally {
      finally_statements
    }

# **8、查找多数重复数组** #

这是日常生活中最常见的任务之一。这是下面的例子。只需使用将帮助你找到数组中重复次数最多的元素即可。这适用于数字和字符串。

function mostRepeated(array){
        return array.sort((a,b) =>
              array.filter(v => v===a).length
            - array.filter(v => v===b).length
        ).pop();
    }
    
    
    console.log(mostRepeated(['shoaib', 'alex', 'mehedi', 'alex'])); // apple

# **9、交换值** #

交换值是编程中最基本的问题。在这里，我们使用技巧，并同时将多个值分配给多个变量。

示例如下：

let a = 50, b = 16;
    [a, b] = [b, a];
    console.log(a,b);

# **10、功能链** #

链接功能的概念很有趣。函数链接是javascript的概念，其中单个对象中包含多个函数。

在这里，我们可以通过一遍又一遍地提及对象来调用所有功能。链接主要是提高代码的可读性。这是下面的例子。

# **结论** #

在本文中，我试图介绍日常生活中所需的所有潜在且定期使用的代码段。希望本文对你的日常工作有所帮助。

如果我错过了一些好的方法，请别忘记提醒我，如果你有什么问题，也可以在留言区与我交流，我们一起探讨。

感谢你的阅读，编程愉快！

[8617c85e1ab3f015c5de794658d48e1a.png]: /images/20221022/aa581d1a6d4c43e58385f4e2f41b585a.png