前言#

JavaScript是一门强大的编程语言，它不仅被用来开发前端，也在后端中扮演着重要的角色。作为用途如此广泛的语言，怎能没有一些小技巧呢？

本篇记录了本人在编程过程中发现的一些奇淫技巧和一些易错点(其实大部分是问ai得知的)，希望对大家有帮助~

正片开始#

1. 关于扩展运算符(...)

   • 基本

   1
   const a = [1, 2, 3];
   2
   const b = [4, 5, 6];
   3
   const merged = [...a, ...b];
   4
   
   5
   //传参
   6
   const lst = [1,2,3]
   7
   f(...lst)
   

   • 将字符串转换为字符数组

   1
   const str = "hello";
   2
   const chars = [...str]; // ['h', 'e', 'l', 'l', 'o']
   

   • 用于赋值

   1
   const { a, b, ...newDict } = dict; // newDict为dict去除a和b后的对象
   2
   //数组中同理
   

2. 可选链操作符(?.)

   1
   const dict = {
   2
       a: 'b'
   3
   };
   4
   console.log(dict?.a)
   

   等效于

   1
   if('a' in dict)
   2
       console.log(dict.a)
   3
   else
   4
       console.log(undefined)
   

3. 一些赋值操作

   • 基本

   1
   const a = null;
   2
   const b = a ?? 'default'; //如果a为null或undefined，b为'default'
   3
   const b = a || 'default';
   4
   const b = a ? a : 'default';//这三行效果相同
   5
   console.log(b); // 'default'
   

   • 同理

   1
   let user = { name: "test", age: 0 };
   2
   user.age ??= 18;
   3
   user.score ??= 100;
   4
   //{name: "test", age: 0, score: 100}
   

   等效于

   1
   user.age = user.age || 18;
   2
   user.score = user.score || 100;
   

   又或者

   1
   user.age = user.age ? user.age : 18;
   2
   user.score = user.score ? user.score : 100;
   

4. 关于对象

   • p判断是否为对象

   1
   typeof obj === 'object' && obj!== null // 排除null的情况
   

   • 动态创建对象属性

   1
   const key = 'name';
   2
   const value = 'John';
   3
   const obj = { [key]: value };
   4
   console.log(obj); // { name: 'John' }
   

结语#

差不多就是这样，更多技巧待我后续补充~