IT服务圈
一个有体温、有态度的IT自媒体平台
来源：翻译|web后端开发（ID：web_qdkf）
英语|eeks.org/javascript-top-10-tips-and-tricks/?ref=rp
JavaScript 在 Web 开发或跨平台开发中变得越来越流行。 曾经，它只被认为是一种后端脚本语言，但现在它作为一种前端脚本语言也变得越来越流行。 甚至 Facebook 的 ReactNative 也是基于 JavaScript 的。
为此，了解 JavaScript 中的一些方法无疑是有好处的，这些方法除了不会阻止我们编写额外的代码外，还可以使我们的代码清晰高效。
1. 数组索引
考虑一个链表[10,9,8,7,6]，如果我们想将该字段的值赋给任何变量，我们的定位方法将是consta=array[0]。 如果我们想给多个变量赋值，继续这样做会很复杂。
代码 1：旧代码实践
var array1 = [10, 9, 8, 7, 6];var x = array1[0];var y = array1[1];var z = array1[2];document.write("x = " + x + "
");document.write("y = " + y + "
");document.write("z = " + z + "
");
输出：
x = 10y = 9z = 8
代码 2：更聪明的方法
<script>var array2 = [10, 9, 8, 7, 6];var [x, y, z, ...rest] = array2;document.write("x = " + x + "
");document.write("y = " + y + "
");document.write("z = " + z + "
");document.write("rest = " + rest + "
");</script>
输出：
x = 10y = 9z = 8rest = 7, 6
因此，像这样分配多个变量可以节省时间和代码。 并且，需要注意的是，剩余部分是剩余部分的集合链表，而不是单独使用每一项。
2. 定义函数
这个想法是将一些常见或重复的任务放在一起，并创建一个我们可以调用的函数，而不必为不同的输入一遍又一遍地编写相同的代码。 大家一定都在 JavaScript 中使用过类似的东西。
代码1：以通常的方式定义一个函数。
Usual function in JavaScript
function myFunction(p1, p2) {return p1 * p2;}document.getElementById("demo").innerHTML= myFunction(4, 3);
输出：
Usual function in JavaScript12
清单 2：还有另一种将函数视为变量的方法，虽然不是很有用，但仍然是一种新方法。 将函数保存在变量中遍历javascript对象，这需要借助像这样的箭头函数。
Function treated asvariable in JavaScript:var myFunction = (p1, p2) => {return p1 * p2;}document.getElementById("demo").innerHTML = myFunction(4, 3);
输出：
Function treated as variable in JavaScript12
3.一行定义函数
这些天，这个方法真的很酷。 如果您了解 Python，您可能了解 lambda 函数，它的行为与任何函数类似，但用一行编写。 好吧，我们在 JavaScript 中不使用 lambda 函数，我们仍然可以编写单行函数。
假设我们想要估计两个数字 a 和 b 的乘积，我们可以用一行脚本来完成。 为什么一定要写一个return语句，因为这些定义方法已经意味着它会自己返回输出了。
Function treated asvariable in JavaScriptconst productNum = (a, b) => a * bdocument.getElementById("demo").innerHTML = myFunction(4, 3);
输出：
Function treated as variable in JavaScript12
4. 布尔值
虽然每种编程语言都只有两个布尔值True和False。 JavaScript 更进一步，引入了用户创建布尔值的能力。
与 True 和 False 不同，它们通常分别命名为“Truthy”和“Falsy”。 为了防止混淆，除了 0、False、NaN、null、"" 之外的所有值都默认为 Truthy。 布尔值的这些广泛使用帮助我们有效地检测条件。
const a = !1;const b = !!!0;console.log(a);console.log(b);
输出：
FalseTrue
5. 过滤布尔值
有时我们可能想从链表中过滤掉所有布尔值，例如“Falsy”布尔值（0，False，NaN，null，“”），这可以通过组合映射和过滤函数来完成。 在这里，它使用 Boolean 关键字来过滤掉 Falsy 值。
arrayToFilter.map(item => {// Item values}).filter(Boolean);
Input: [1, 2, 3, 0, "Hi", False, True]Output: [1, 2, 3, "Hi", True]
6. 创建完全空的对象
如果我们被要求在 JavaScript 中创建一个空对象，我们的第一步将是使用花括号并将其分配给一个变量。 但这并不是一个空白对象，因为它仍然具有 JavaScript 对象属性，例如 __proto__ 等方法。
有一种方法可以创建没有任何对象属性的对象。 所以我们使用字典并将其 __proto__ 定义为空。
<script>/* Using .create() method to createa completely empty object */let dict = Object.create(null);// dict.__proto__ === "undefined"</script>
除非用户另有定义，否则该对象将没有默认的 __proto__ 或其他属性。
7. 截断字段
let arrayToTruncate = [10, 5, 7, 8, 3, 4, 6, 1, 0];/* Specifying the length till where thearray should be truncated */arrayToTruncate.length = 6;console.log(arrayToTruncate)
输出：如您所见，我们必须知道要使用这些方法截断的字段的宽度，否则将导致错误。 这里的运行时间是 O(k)，其中 k 是将保留在链表中的元素数量。
[10、5、7、8、3、4]
8. 合并对象
扩展运算符 (...) 的引入使用户可以轻松地合并到一个或多个对象，而以前可以通过创建单独的函数来实现此合并。
代码1：
function mergeObjects(obj1, obj2) {for (var key in obj2) {if (obj2.hasOwnProperty(key)) obj1[key] = obj2[key];}return obj1;}
代码2：使用加宽运算符可以轻松实现上述任务，而且代码也相当清晰。
<script>const obj1 = {};// Items inside the objectconst obj2 = {};// Items inside the objectconst obj3 = {...obj1, ...obj2};</script>
9. 状态检测
检测和遍历条件是每种编程语言的重要组成部分。 在 JavaScript 中，我们通过以下方式做到这一点：
代码1：
if (codition) {doSomething();}
清单 2：但是，使用按位运算符可以更轻松地检查条件，并使代码保持在一行：
condition && doSomething();
10.使用正则表达式替换所有字符
有时会出现这样的情况：每次出现一个字符或一个子字符串，但不幸的是 .replace() 方法仅替换一次出现。 我们可以通过使用正则表达式和 .replace() 方法来解决这个问题。
var string = "GeeksforGeeks"; // Some stringconsole.log(string.replace(/eek/, "ool"));
输出：
“ GoolsforGools”
*版权声明：转载文章及图片均来自公众网络，版权归作者本人所有。 除非难以确认推送的文章遍历javascript对象，否则我们会注明作者和来源。 若来源错误或侵犯原作者权益，请联系我们删除或授权。
