你可能不知道的有用的 JavaScript 技巧和窍门 💻👨‍💻

JavaScript 是一种广泛使用的 **Web 编程语言**。如果您正在考虑从事软件工程职业，那么您很可能会接触到 JavaScript 的概念。

JavaScript 无疑是 Web 开发领域最流行的编程语言。虽然它有自己的**注意事项和棘手/令人困惑的概念**，但如果您想在 Web 开发事业上取得进步，学习和使用 JavaScript 几乎是必要的。

在这篇博文中，我将列出一些有用的 JavaScript **技巧和窍门**，以帮助您解决使用该语言时遇到的困难情况。

JavaScript 中的自动分号注入 (ASI)

某些语言（例如 **C#、C++ 和 Java**）对每行以分号结尾的要求非常严格。

JavaScript 也使用分号来**表示行尾**，但在 JavaScript 中使用分号实际上是**可选的**。可选的意思是，JavaScript 将应用一组**复杂规则来确定分号是否应该出现在那里**。这被称为**自动分号注入**。

例子：

function returnSomething()
{
  return
    {
      name: 'JavaScript Expert'
      contactMethod: 'Shine batsign at sky'
    }
}

乍一看，您可能会认为记录此函数调用将显示此特定对象。但是，如果我们调用此函数，我们实际上会得到 **undefined** 作为输出。

**解释**：由于**左括号与回车符不在同一行**，ASI 为我们在其中添加了**一个分号**。因此，就 JavaScript 而言，我们的代码实际上如下所示：

function returnSomething()
{
  return ; // <-- semicolon inserted by ASI, remainder of function not evaluated.
    {
      name: 'JavaScript Expert'
      contactMethod: 'Shine batsign at sky'
    }
}

这就是ASI的过程。为了避免这种情况，我们应该仔细查看括号和其他语法的位置。

非连续数组键和索引

假设我们有一个简单的数组，我们知道我们可以**弹出、推送、附加**，以及对数组执行任何我们想做的事情。但我们也知道，与其他语言一样，JavaScript 允许我们**通过索引访问数组元素**。

然而，JavaScript 的不同寻常之处在于，当**数组尚未达到该索引**时，您也可以通过数组索引**设置**元素。

例子：

var arr = [];
arr[0] = 1;
arr[1] = 2;
arr[100] = 100;
console.log(arr);
console.log('The length of the array is ' + arr.length);

输出：

[ 1, 2, <98 empty items>, 100 ]
The length of the array is 101

使用 JavaScript 查找操作系统类型

**window.navigator** 对象包含 **有关访问者浏览器操作系统的详细信息**。部分操作系统属性可在 **platform 属性** 下找到。

您可以使用以下代码片段来获取操作系统类型：

console.log(navigator.platform);

输出：

Win32 (for Windows)
MacIntel (for modern macOS)
Linux x86_64 (64-bit Linux systems)
WebOS (for LG Smart TVs)
Linux (for Samsung Smart TVs)

如何检测是否正在使用移动浏览器浏览

您可以通过简单地浏览设备列表并检查 **userAgent** 是否匹配任何内容来 **检测移动浏览器**：

function detectMobileBrowser() {
  if (
    navigator.userAgent.match(/Android/i) ||
    navigator.userAgent.match(/webOS/i) ||
    navigator.userAgent.match(/iPhone/i) ||
    navigator.userAgent.match(/iPad/i) ||
    navigator.userAgent.match(/iPod/i) ||
    navigator.userAgent.match(/BlackBerry/i) ||
    navigator.userAgent.match(/Windows Phone/i)
  ) {
    return true;
  } else {
    return false;
  }
}

在 JS 控制台消息上应用 CSS 样式和颜色

您可以使用特定语法在控制台消息上应用 CSS 样式和颜色。这对于区分某些消息与其他消息非常有用。

代码示例：

console.log(
        "%cStop!",
        "color:red;font-family:system-ui;font-size:4rem;-webkit-text-stroke: 1px black;font-weight:bold"
      );

输出：

就是这样！这些只是一些鲜为人知的 JavaScript 技巧和窍门，将来可能会派上用场。

通过 LinkedIn 与我联系：- Linkedin

请查看我的 GitHub 来了解精彩项目：- Github

查看我的个人投资组合：- Aryan 的投资组合