每种语言都有其独特性,使用最广泛的编程语言 JAVAScript 也不例外。
今天这篇文章将讨论一些 JavaScript 通用优化技巧,这些技巧将帮助您编写更好的代码,希望你能从今天这篇文章中获取一些新知识。
如果值为 [] 或 0,则使用逻辑或 || 没有给你预期的结果。
无效共生将是一个更好的解决方案?如果定义的值为 null 或未定义,则仅使用回退值。
// Lengthy
let name;
if (user?.name) {
name = user.name;
} else {
name = "Anonymous";
}
// Shortly
const name = user?.name ?? "Anonymous";
Long switch case 通常通过使用一个对象来最大化,该对象的键充当开关,而值试图充当返回值。
const dayNumber = new Date().getDay();
// Lengthy
let day;
switch (dayNumber) {
case 0:
day = "Sunday";
break;
case 1:
day = "Monday";
break;
case 2:
day = "Tuesday";
break;
case 3:
day = "Wednesday";
break;
case 4:
day = "Thursday";
break;
case 5:
day = "Friday";
break;
case 6:
day = "Saturday";
}
// Shortly
const days = [
"Sunday",
"Monday",
"Tuesday",
"Wednesday",
"Thursday",
"Friday",
"Saturday",
];
// Or
const days = `Sunday,Monday,Tuesday,Wednesday,Thursday,Friday,Saturday`.split(
","
);
const day = days[dateNumber];
您还可以使用二元运算符来根据条件决定调用哪个函数。
函数的调用模式必须相同,否则最终会出错。
function f1() {
// ...
}
function f2() {
// ...
}
// Lengthy
if (condition) {
f1();
} else {
f2();
}
// Shortly
conditon ? f1() : f2();
需要检查一个字符串是否等于多个值之一是很常见的,这很快就会变得烦人。
幸运的是,JavaScript 有办法帮助您解决这个问题。
// Lenghty
cconst isVowel = (letter) => {
return (
letter === "a" ||
letter === "e" ||
letter === "i" ||
letter === "o" ||
letter === "u"
);
};
// Shortly
const isVowel = (letter) =>
For-of 和 For-in 循环有利于重复数组或对象,而无需手动跟踪对象键的索引。
For-of
const arr = [1, 2, 3, 4, 5];
// Lengthy
for (let i = 0; i < arr.length; i++) {
const element = arr[i];
// ...
}
// Shortly
for (const element of arr) {
// ...
}
For-in
const obj = {
a: 1,
b: 2,
c: 3,
};
// Lengthy
const keys = Object.keys(obj);
for (let i = 0; i < keys.length; i++) {
const key = keys[i];
const value = obj[key];
// ...
}
// Shortly
for (const key in obj) {
const value = obj[key];
// ...
}
如果要检查变量是否为 null、undefined、0、false、NaN 或空字符串,可以使用逻辑非 (!) 运算符来执行此操作,而无需多重效果。
这使得验证变量是否包含有效数据变得简单。
// Lengthy
const isFalsey = (value) => {
if (
value === null ||
value === undefined ||
value === 0 ||
value === false ||
value === NaN ||
value === ""
) {
return true;
}
return false;
};
// Shortly
const isFalsey = (value) => !value;
作为 JavaScript 开发人员,您一定遇到过三元运算符。
这是编写简洁的 if-else 语句的绝佳方法。
但是,您可以使用它来编写简洁的代码,甚至可以将它链接起来以检查多个条件。
// Lengthy
let info;
if (value < minValue) {
info = "Value is too small";
} else if (value > maxValue) {
info = "Value is too large";
} else {
info = "Value is in range";
}
// Shortly
const info =
value < minValue
? "Value is too small"
: value > maxValue ? "Value is too large" : "Value is in range";
到这里,我要与你分享的内容,就全部结束了,感谢你的阅读,祝编程开心。