20个JS精简代码无形装逼集合，最为致命，记得收藏好

在这里插入代码片

单行 If-Else 语句

这是许多编程语言的共同特征。你可以使用三元运算符用一行代码编写整个语句，而不是在多行上编写 if-else.
例如

const age = 12;
let ageGroup;
// LONG FORM
if (age > 18) {
ageGroup = "An adult";
} else {
ageGroup = "A child";
}
// SHORTHANDageGroup = age > 18 ? "An adult" : "A child";

但是，不要过度使用它。它会使你的代码更加冗长。明智的做法是仅用此替换简单的表达式以提高可读性并减少代码行数。

2、从数组中删除重复项
在 JavaScript 中，Set 是一个集合，它允许你仅存储唯一值。这意味着删除任何重复的值。
因此，要从数组中删除重复项，你可以将其转换为集合，然后再转换回数组。

const numbers = [1, 1, 20, 3, 3, 3, 9, 9];
const uniqueNumbers = [...new Set(numbers)]

困惑吗？让我解释一下它是如何工作的：
1)、new Set(numbers)从数字列表中创建一个集合。创建集合会自动删除所有重复值。2）、展开运算符…将任何可迭代对象转换为数组。这意味着将集合转换回数组。[…new Set(numbers)]
3、较短的 If-Else 的空合并
这也是 if-else 的简写。
你可以使用看涨合并，而不是使用 if-else 构造来检查值是否为空。该nullish合并操作 ??，如果没有定义左侧返回右侧。如果是，则返回左侧：

let maybeSomething;
// LONG FORM
if(maybeSomething){
console.log(maybeSomething)
} else {
console.log("Nothingfound")
}
//SHORTHAND
console.log(maybeSomething ?? "Nothing found")

4、防止崩溃的可选链
如果访问未定义的属性，则会产生错误。这就是可选链的用武之地。
在未定义属性时使用可选链运算符，undefined将返回而不是错误。这可以防止你的代码崩溃。例如：

graph TD;
A-->B;
const student = {name: "Matt",age: 27,  address: {    state: "New York"  },};// LONG FORMconsole.log(student && student.address && student.address.ZIPCode); // Doesn't exist - Returns undefined//SHORTHANDconsole.log(student?.address?.ZIPCode);// Doesn't exist - Returns undefined
B-->C;

5、在没有第三个变量的情况下交换两个变量
在 JavaScript 中，你可以使用解构从数组中拆分值。这可以应用于交换两个变量而无需第三个：

let x = 1;
let y = 2;// LONGER FORM
let temp = x;
x = y;
y = temp;// SHORTHAND
[x, y] = [y, x];

6、将任何值转换为布尔值
在 JavaScript 中，你可以使用 !! 在 JS 中将任何内容转换为布尔值。
例如，这里有一些例子：

!!true    // true
!!2       // true
!![]      // true
!!"Test"  // true
!!false   // false
!!0       // false
!!""      // false

7、扩展运算符
使用扩展运算符组合两个数组…：

const nums1 = [1, 2, 3];
const nums2 = [4, 5, 6];// LONG FORMlet newArray = nums1.concat(nums2);
// SHORTHAND
newArray = [...nums1, ...nums2];

也可以使用此语法代替将值推送到数组：

在这里插入代let numbers = [1, 2, 3];// LONGER FORM
numbers.push(4);
numbers.push(5);// SHORTHAND
numbers = [...numbers, 4, 5];

8、传播解构
使用扩展运算符将剩余元素分配给变量：

const student = {name: "Matt",  age: 23,  city: "Helsinki",  state: "Finland",};// LONGER FORMconstname = student.name;const age = student.age;const address = { city: student.city, state: student.state };// SHORTHANDconst { name, age, ...address } = student;

20个JS精简代码无形装逼集合，最为致命，记得收藏好相关推荐

装逼 | 10个JS精简代码无形装逼集合，最为致命，记得收藏好
Hi! 我是小小,今天是本周的第一篇,主要内容是这10个 js 精简代码,无形中装逼,最为致命,切记收藏,还有其他的,记得给小小留言哦! 日历创建过去七天的数组,如果把代码中的减号换成加号,将会得到 ...
10个JS精简代码无形装逼集合，最为致命，记得收藏好
作者 | megatron 链接 | https://juejin.im/post/5cc55eb5e51d456e577f93f0 除了三目运算,你还知道其他的装逼姿势吗?留言走你~~ 单行简洁的代 ...
10个JS精简代码无形装逼集合，最为致命
01.日历创建过去七天的数组,如果将代码中的减号换成加号,你将得到未来7天的数组集合. // 创建过去七天的数组 [...Array(7).keys()].map(days => new Da ...
推荐10个JS精简代码无形装逼集合，记得收藏好
01.日历创建过去七天的数组,如果将代码中的减号换成加号,你将得到未来7天的数组集合 // 创建过去七天的数组 [...Array(7).keys()].map(days => new Dat ...
Android特效专辑（六）——仿QQ聊天撒花特效，无形装逼，最为致命
Android特效专辑(六)--仿QQ聊天撒花特效,无形装逼,最为致命我的关于特效的专辑已经在CSDN上申请了一个专栏--http://blog.csdn.net/column/details/li ...
无形装逼，最为致命——玩LOL那些有趣的台词
玩LOL也很久了,这个游戏浪费我很多时间,但是也带给我很多快乐,这已足够.虽然现在工作没什么时间玩,但是回想起某些英雄的语录感觉还是很有意思,或搞笑.或经典.或哲理,好的游戏让人收获的不仅是游戏本身, ...
js日历代码_JS无形装逼，最为致命
单行简洁的代码很难维护(有时甚至难以理解),但这并不能阻止广大攻城狮们脑洞,在编写简洁的代码后获得一定的满足感. 以下我最近的一些收藏 javascript精简代码集合.它们都可以在你的开发控制台中运 ...
JS 无形装逼，最为致命
除了三目运算,你还知道其他的装逼姿势吗?留言走你~~ 单行简洁的代码很难维护(有时甚至难以理解),但这并不能阻止广大攻城狮们脑洞,在编写简洁的代码后获得一定的满足感. 以下我最近的一些收藏 javas ...
JS无形装逼，最为致命
除了三目运算,你还知道其他的装逼姿势吗?留言走你~~ 单行简洁的代码很难维护(有时甚至难以理解),但这并不能阻止广大攻城狮们脑洞,在编写简洁的代码后获得一定的满足感. 以下我最近的一些收藏javasc ...

20个JS精简代码无形装逼集合，最为致命，记得收藏好

20个JS精简代码无形装逼集合，最为致命，记得收藏好相关推荐

最新文章

热门文章