你可能不知道的实用 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 小技巧，将来或许能对你有所帮助。
在领英上与我联系：-领英
欢迎访问我的 GitHub，那里有很多精彩的项目：- Github
查看我的个人作品集：- Aryan 的作品集
文章来源：https://dev.to/aryan_shourie/useful-javascript-tips-and-tricks-that-you-may-not-be-aware-of-32af