程序员必备：JavaScript常用方法大合集，让编程更轻松！

2022-11-27 11:22:04

JavaScript：7 个常用的实用方法

JavaScript 作为一门功能强大的编程语言，因其广泛的应用而备受开发者的青睐。熟练掌握 JavaScript 方法可以极大地提升开发效率，让编程变得轻而易举。在这篇文章中，我们将深入探讨 7 个常用的 JavaScript 方法，涵盖各种常见的应用场景，包括复制 URL 地址、处理文件大小显示、获取音视频时长、下载文件、对象数组去重、获取地址栏参数以及处理 params 参数。

1. 复制 URL 地址

需要分享页面链接？只需利用这个方便的 JavaScript 方法即可轻松复制当前 URL 地址。

function copyUrl() {
  const url = window.location.href;
  navigator.clipboard.writeText(url);
  alert("URL 已复制！");
}

2. 处理文件大小显示

处理文件大小时，这个方法可以将字节转换成更易读的格式（如 KB、MB、GB）。

function formatFileSize(bytes) {
  if (bytes < 1024) {
    return bytes + " 字节";
  } else if (bytes < 1024 * 1024) {
    return (bytes / 1024).toFixed(2) + " KB";
  } else if (bytes < 1024 * 1024 * 1024) {
    return (bytes / (1024 * 1024)).toFixed(2) + " MB";
  } else {
    return (bytes / (1024 * 1024 * 1024)).toFixed(2) + " GB";
  }
}

3. 获取音视频时长

无论是 audio 元素还是 video 元素，这个方法都能轻松获取其时长。

function getDuration(media) {
  return media.duration;
}

4. 下载文件

想让用户下载文件？利用这个方法，只需指定文件 URL 和文件名即可轻松实现。

function downloadFile(url, filename) {
  const a = document.createElement("a");
  a.href = url;
  a.download = filename;
  a.click();
}

5. 对象数组去重

当处理包含重复对象的数组时，这个方法可以快速去除重复项，仅保留唯一对象。

function uniqueArray(array) {
  return [...new Set(array)];
}

6. 获取地址栏参数

需要从地址栏中提取参数？这个方法将帮助你轻松搞定。

function getUrlParams() {
  const params = {};
  window.location.search.replace(/[?&]+([^=&]+)=([^&]*)/gi, (s, k, v) => {
    params[k] = v;
  });
  return params;
}

7. params 参数处理

params 参数通常包含编码后的值，这个方法可以帮你解码这些值，并返回一个处理后的 params 对象。

function processParams(params) {
  const processedParams = {};
  for (const key in params) {
    if (params.hasOwnProperty(key)) {
      processedParams[key] = decodeURIComponent(params[key]);
    }
  }
  return processedParams;
}