JavaScript终极秘密揭晓:每个程序员都应该掌握的20 个技巧!

42 阅读2分钟

pexels-photo-3225519.webp

后端又炸了,进度又滞后了一天,又是前端的锅,不行!!!这个锅不接,闲来无事,写点东西吧,高级 JavaScript 的一些技巧

1. 处理真/假值:初学者与专业人士

初学者:

let name = ""
if(!name){
    name="zhansan"
}

他们经常用if(!name)处理虚假值,但它可能无法涵盖所有​​边缘情况。

专业:

let name=""
name ||="zhansan"

优点是利用逻辑空赋值运算符 ( ||=) 来简洁、更安全地处理假值。

2. 增强对象创建:初学者与专业人士

初学者:

const name="zhangsan";
const age = 25;
const user = {
    name:name,
    age:age
}

对于这样的方式来看并没有什么问题,但是就是看起来很冗长,不专业而已

专业:

const name="zhangsan";
const age = 25;
const user = {
    name,
    age
}

这样看起来是不是好看多了,专业性是不是嘎一下就上来了,也比较的简洁了,对于我们来说写多一个属性都是浪费(类似于大学的60分吧)

3. 处理 Null 或未定义:初学者与专业人士

初学者:

let name;
if(name !==null &&name!==undefined){
    name="zhangsan"
}else{
    name="lisi"
}

对于这种null或者undefined用这种显示的情况来进行检查

专业:

let name ="zhangsan"??"lisi"

这是省了多少代码啊

4. 确保数组中的元素唯一:初学者与专业人士

初学者:

const num =[1,2,3,4,2,5,6,1,5]
const uniquenum = Array.from(new Set(num))

用这种方式from的方式加Set 也确实可以,就是不够优美

专业:

const num =[1,2,3,4,2,5,6,1,5]
const uniquenum = [...new Set(num)]

用 ***...***用扩展运算符不是更加的简洁,优美嘛

5. 简化幂运算:初学者与专业人士

初学者:

let num = Math.pow(2,2);

专业:

let num = 2**2;

求幂运算符 ( **) 来获得更清晰、更简洁的求幂语法。

6. 处理浮点数学:初学者与专业人士

初学者:

let num =(1.2+0.2).toFixed(2);

专业:

let num =Number((1.2+0.2).toFixed(2));

Number()将固定数字转换回数值以获得更高的准确性。

7. 简化对象属性分配:初学者与专业人士

初学者:

const person = {name:"zhangsan",age:25}
const upPerson = Object.assign({},person,{age="30"})

专业:

const person = {name:"zhangsan",age:25}
const upPerson = {...person,age:30}

扩展运算符以更简洁、更清晰的方式更新对象属性。

8. 简化数组过滤:初学者与专业人士

初学者:

const num = [1,2,5,6,3,4,8]
const upNum = num.filter(num=>num%2===0)

专业:

const num = [1,2,5,6,3,4,8]
const upNum = num.filter(num=>!(num%2))

JavaScript 中 0 的真实性来进行更简洁的过滤。

不说了,我们后端又站起来了,必须与我们后端一起肝!!!!!!!