前端常用的20个JavaScript函数

为了提高开发效率并编写更清晰、可维护的代码，程序员们经常使用各种自定义函数。今天给大家介绍20个常用的JavaScript函数，希望对大家有帮助。

1. 深度复制对象

深度复制对象是在JavaScript中非常有用的操作，特别是当你需要克隆对象以避免引用问题时。deepCopy函数递归地复制对象的所有属性，确保不会共享引用。

function deepCopy(obj) {
  if (obj === null || typeof obj !== 'object') return obj;
  const copy = Array.isArray(obj) ? [] : {};
  for (let key in obj) {
    if (obj.hasOwnProperty(key)) {
      copy[key] = deepCopy(obj[key]);
    }
  }
  return copy;
}

2. 异步循环执行数组元素

在处理异步任务时，经常需要循环执行数组元素，并确保每个任务完成后才执行下一个任务。asyncForEach函数可以帮助你实现这一目标，以避免回调地狱。

async function asyncForEach(arr, callback) {
  for (let i = 0; i < arr.length; i++) {
    await callback(arr[i], i, arr);
  }
}

3. 生成唯一标识符（UUID）

生成唯一标识符对于跟踪对象或数据非常有用。generateUUID函数生成符合UUID格式的唯一标识符，可用于唯一标识数据或对象。

function generateUUID() {
  return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
    var r = Math.random() * 16 | 0,
        v = c === 'x' ? r : (r & 0x3 | 0x8);
    return v.toString(16);
  });
}

4. 扁平化嵌套数组

有时，你需要将嵌套数组扁平化，以便更轻松地处理数据。flattenArray函数将嵌套数组转换为一维数组，使数据更易于处理。

function flattenArray(arr) {
  return arr.reduce((acc, val) => Array.isArray(val) ? acc.concat(flattenArray(val)) : acc.concat(val), []);
}

5. 查找两个数组的交集

查找两个数组的交集是解决数据处理问题的一种常见方式。arrayIntersection函数接受两个数组作为参数，并返回它们的交集。

function arrayIntersection(arr1, arr2) {
  return arr1.filter(value => arr2.includes(value));
}

6. 查找两个数组的差集

有时，你需要找到两个数组之间的差异。arrayDifference函数接受两个数组作为参数，并返回它们的差集。

function arrayDifference(arr1, arr2) {
  return arr1.filter(value => !arr2.includes(value));
}

7. 判断是否为闰年

在某些情况下，你可能需要判断某一年是否为闰年。isLeapYear函数接受一个年份作为参数，并返回布尔值，指示该年份是否为闰年。

function isLeapYear(year) {
  return (year % 4 === 0 && year % 100 !== 0) || (year % 400 === 0);
}

8. 将函数柯里化

函数柯里化是一种有用的技术，可以将一个接受多个参数的函数转化为一系列接受单个参数的函数。curry函数接受一个函数作为参数，并返回其柯里化版本。

function curry(func) {
  return function curried(...args) {
    if (args.length >= func.length) {
      return func(...args);
    } else {
      return function(...nextArgs) {
        return curried(...args.concat(nextArgs));
      };
    }
  };
}

9. 查找数组中的最大连续子数组和

在处理数值数组时，你可能需要找到其中的最大连续子数组和。maxSubarraySum函数接受一个数组作为参数，并返回最大连续子数组的和。

function maxSubarraySum(arr) {
  let maxSum = -Infinity;
  let currentSum = 0;
  for (let num of arr) {
    currentSum = Math.max(num, currentSum + num);
    maxSum = Math.max(maxSum, currentSum);
  }
  return maxSum;
}

10. 计算斐波那契数列

斐波那契数列是一个常见的数学序列，用于模拟自然界的许多现象。fibonacci函数接受一个整数作为参数，并返回对应位置的斐波那契数。

function fibonacci(n) {
  if (n <= 1) return n;
  let a = 0, b = 1;
  for (let i = 2; i <= n; i++) {
    let temp = b;
    b = a + b;
    a = temp;
  }
  return b;
}

11. 生成指定范围内的随机整数

有时你需要生成指定范围内的随机整数用于各种目的。getRandomInt函数接受两个参数，min和max，并返回一个在这两个值之间（包括边界）的随机整数。

function getRandomInt(min, max) {
  return Math.floor(Math.random() * (max - min + 1)) + min;
}

12. 判断是否为回文字符串

回文字符串是指正读和反读都相同的字符串。isPalindrome函数接受一个字符串作为参数，将其转换为小写并移除非字母数字字符，然后检查是否为回文字符串。

function isPalindrome(str) {
  str = str.toLowerCase().replace(/[^a-z0-9]/g, '');
  return str === str.split('').reverse().join('');
}

13. 将秒数转换为时间字符串

你可能需要将给定的秒数转换为易读的时间字符串。secondsToTime函数接受一个秒数作为参数，并将其转换为时:分:秒的格式。

function secondsToTime(seconds) {
  const hours = Math.floor(seconds / 3600);
  const minutes = Math.floor((seconds % 3600) / 60);
  const remainingSeconds = seconds % 60;
  return `${hours}:${minutes}:${remainingSeconds}`;
}

14. 判断是否为整数

在某些情况下，你可能需要检查一个值是否为整数。isInteger函数接受一个值作为参数，并返回布尔值，指示该值是否为整数。

function isInteger(value) {
  return Number.isInteger(value);
}

15. 计算字符串中特定字符的出现次数

countOccurrences函数接受两个参数，一个是字符串，另一个是要计算的字符，然后返回该字符在字符串中出现的次数。

function countOccurrences(str, target) {
  return str.split(target).length - 1;
}

16. 随机生成指定范围内的整数

有时，你可能需要生成指定范围内的整数，而不仅仅是整数。getRandomInt函数可以接受min和max两个参数，然后生成一个在这两个值之间的随机整数。

function getRandomInt(min, max) {
  if (min > max) {
    [min, max] = [max, min];
  }
  return Math.floor(Math.random() * (max - min + 1)) + min;
}

17. 将字符串反转

有时，你可能需要将一个字符串反转，以实现不同的效果。reverseString函数接受一个字符串作为参数，并返回该字符串的反转版本。

function reverseString(str) {
  return str.split("").reverse().join("");
}

18. 将首字母大写

有时，你可能需要将字符串中的首字母大写，以满足特定的文本格式。capitalizeFirstLetter函数接受一个字符串作为参数，并返回一个新字符串，其中首字母大写。

function capitalizeFirstLetter(str) {
  return str.charAt(0).toUpperCase() + str.slice(1);
}

19. 判断数组是否包含特定元素

在处理数组时，你可能需要确定数组中是否包含特定元素。arrayContains函数接受一个数组和一个要查找的元素作为参数，然后返回一个布尔值，指示数组是否包含该元素。

function arrayContains(arr, element) {
  return arr.indexOf(element) !== -1;
}

20. 验证电子邮件地址格式

在处理用户输入或表单数据时，你可能需要验证电子邮件地址的格式是否有效。isValidEmail函数接受一个电子邮件地址作为参数，并使用正则表达式来验证其格式是否符合标准。

function isValidEmail(email) {
  const regex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
  return regex.test(email);
}

Happy coding! 🚀👨‍💻📝

本文由mdnice多平台发布