首页 > 编程语言 >16 个 JavaScript 简写神技,提效 60%!

16 个 JavaScript 简写神技,提效 60%!

时间:2025-01-23 11:22:13浏览次数:1  
标签:arr const name 16 JavaScript user 神技 简写 写法

今天看到一片文章觉得很适合在工作中常常用得到

1. 三元运算符简化条件判断

// 传统写法
let result;
if (someCondition) {
    result = 'yes';
} else {
    result = 'no';
}

// 简写方式
const result = someCondition ? 'yes' : 'no';

2. 空值合并运算符

// 传统写法
const name = user.name !== null && user.name !== undefined ? user.name : 'default';

// 简写方式
const name = user.name ?? 'default';

3. 可选链操作符

// 传统写法
const street = user && user.address && user.address.street;

// 简写方式
const street = user?.address?.street;

4. 数组去重

// 传统写法
function unique(arr) {
    return arr.filter((item, index) => arr.indexOf(item) === index);
}

// 简写方式
const unique = arr => [...new Set(arr)];

5. 快速取整

// 传统写法
const floor = Math.floor(4.9);

// 简写方式
const floor = ~~4.9;

6. 合并对象

// 传统写法
const merged = Object.assign({}, obj1, obj2);

// 简写方式
const merged = {...obj1, ...obj2};

7. 短路求值

// 传统写法
if (condition) {
    doSomething();
}

// 简写方式
condition && doSomething()

8. 默认参数值

// 传统写法
function greet(name) {
    name = name || 'Guest';
    console.log(`Hello ${name}`);
}

// 简写方式
const greet = (name = 'Guest') => console.log(`Hello ${name}`);

9. 解构赋值

10. 字符串转数字

11. 多重条件判断

12. 对象属性简写

13. 数组映射

14. 交换变量值

15.动态对象属性

// 传统写法
const obj = {};
obj[dynamic + 'name'] = value;

// 简写方式
const obj = {
    [`${dynamic}name`]: value
};

原文连接https://mp.weixin.qq.com/s/GRnPcjZ05PWD1AwLR0Ueow

标签:arr,const,name,16,JavaScript,user,神技,简写,写法
From: https://www.cnblogs.com/wangliko/p/18687388

相关文章

  • [FJOI2016] 建筑师 题解
    显然有一个\(dp\)思路。设\(f_{i,j}\)表示现在修了\(i\)栋楼,从第一栋楼外侧能看到\(j\)栋楼的方案数,显然有:\[f_{i,j}=\begin{cases}[i=0](j=0)\\f_{i-1,j-1}+(i-1)f_{i-1,j}(j\ne0)\end{cases}\]一眼\(f_{i,j}=\begin{bmatrix}i\\j\end{bmatrix}\)。那么答案即为:\[\s......
  • [TJOI/HEOI2016] 求和 题解
    为什么又是佳媛姐姐啊啊啊!斯特林数在这道题中不好处理,直接拆开:\[f(n)=\sum_{i=0}^n\sum_{j=0}^i\begin{Bmatrix}i\\j\end{Bmatrix}2^jj!\]\[=\sum_{j=0}^n2^jj!\sum_{i=0}^n\sum_{k=0}^j\frac{(-1)^k(j-k)^i}{k!(j-k)!}\]\[=\sum_{j=0}^n2^jj!\sum_{k=0}^j\frac{(-1)^k\sum\l......
  • JavaScript系列(40)--虚拟DOM实现详解
    JavaScript虚拟DOM实现详解......
  • JavaScript系列(39)-- Web Workers技术详解
    JavaScriptWebWorkers技术详解......
  • 1.16
    《构建之法》的第七章深入探讨了需求分析这一软件工程中的关键环节。作者邹欣通过丰富的案例和深刻的见解,让我对需求分析有了全新的认识和理解。在阅读过程中,我深刻体会到需求分析在软件开发中的重要性。它是软件开发的起点,决定了软件的功能、性能和用户体验。作者通过生动的比喻......
  • [SDOI2016小学组] 数苹果(apple)
    题目描述苹果丰收了,有n堆苹果,小红就在苹果堆旁。小红已经知道了每堆苹果有多少个。她要问一问从第a堆到第b堆一共有多少个苹果。输入输入数字n,然后输入n个数据。再输入问m,然后输入c行数据。输出输出m次a到b堆一共有多少个。样例输入 复制51234......
  • 【转】[JavaScript] import 和 export 的用法
    转自:kimi.ai在JavaScript中,import和export是ES6(ECMAScript2015)引入的模块化语法,用于在不同的文件或模块之间共享代码。它们使得代码更加模块化、可维护,并且可以避免全局变量的污染。以下是import和export的基本用法和一些常见场景。1. export 的用法export用于......
  • 题解:P11600 『Fwb』流星の陨落
    『Fwb』流星の陨落题目描述流星雨来了!当然,这场流星雨确确实实是Fwb设计的。Fwb在天空中放置了许多的流星,同时也在地面上放置了许多的烟花。当流星和烟花发生碰撞时,就会出现美丽而独特的风景。由于方便控制流星雨的发射,流星的发射是有规律的,这个发射的规律叫做流星间隔。我......
  • oracle从库遇到的ORA-04045和ORA-16000错误
     遇到的ORA-04045和ORA-16000错误ORA-04045错误:这个错误通常表示数据库中的某个对象(如表、视图或同义词)无效。这可能是因为对象的定义发生了变化,例如基表的结构被修改,导致依赖于它的对象无效。ORA-16000错误:这个错误表示数据库或插接式数据库是以只读访问方式打开的。这意味着......
  • 216基于链式存储结构的图书信息表的修改
    描述定义一个包含图书信息(书号、书名、价格)的链表,读入相应的图书数据完成图书信息表的创建,然后计算所有图书的平均价格,将所有低于平均价格的图书价格提高20%,所有高于或等于平均价格的图书价格提高10%,最后逐行输出价格修改后的图书信息。输入输入n+1行,前n行是n本图书的信息(......