使用这11个代码，可以大大地简化我们的代码

 在这篇文章中，使用我将与你分享一些关于JS的个代技巧，可以提高你的码可码JS技能。

1.避免if过长

如果判断值满足多个条件，大大地简的代我们可能会这么写：

if (value === a || value === b || value === c) {  ... } 

像这样如果有多个条件，化们if 条件就会很我，使用可读性降低，个代我们可以这样简化：

if ([a,码可码 b, c].includes(value)) {  ... } 

2.双!操作符将任何变量转换为布尔值

!(NOT)运算符可以使用两次!!，这样可以将任何变量转换为布尔值(像布尔函数)，大大地简的代当你需要在处理它之前检查某个值时非常方便。化们

const toto = null !!toto // false Boolean(toto) // false if (!!toto) {  } // toto is not null or undefined 

3.可选项 (?使用)

在 JS 中，我们需要经常检查对象的个代某些属性是否存在，然后才能再处理它，码可码不然会报错。大大地简的代早期我们可能会这么干：

const toto = {  a: {  b: {  c: 5 } } } if (!!toto.a && !!toto.a.b && !!toto.a.b.c) {  ... } // toto.a.b.c exist 

如果对象嵌套很深，化们我们这写法就难以阅读，这时可以使用?来简化：

if (!!toto.a?.b?.c) {  ... } // toto.a.b.c exist //  如果键不存在，返回 `undefined`。 const test = toto.a?.b?.c?.d // undefined 

4. 如果if中返回值时， 就不要在写else

经常会看到这种写法：

if (...) {    return toto } else {    return tutu } 

 如果if有返回值了，可以这样写：

if (...) {    return toto } return tutu 

5.避免forEach，多使用filter、map、reduce、云南idc服务商every、some

作为初学者，我们使用了很多forEach函数，但 JS 为我们提供了很多选择，而且这些函数是FP(函数式编程)。

filter

filter() 方法创建一个新数组, 其包含通过所提供函数实现的测试的所有元素。

const toto = [1, 2, 3, 4] // 过滤奇数 const evenValue = toto.filter(currentValue => {     return currentValue % 2 == 0 }) // [2, 4] 

map

map() 方法创建一个新数组，其结果是该数组中的每个元素是调用一次提供的函数后的返回值。

const toto = [1, 2, 3, 4] const valueMultiplied = toto.map(currentValue => {     return currentValue * 2  }) // [2, 4, 6, 8] 

reduce

reduce() 方法对数组中的每个元素执行一个由您提供的reducer函数(升序执行)，将其结果汇总为单个返回值。

const toto = [1, 2, 3, 4] const sum = toto.reduce((accumulator, currentValue) => {     return accumulator += currentValue  }, 0) // 10 

Some & Every

some() 方法测试数组中是不是至少有1个元素通过了被提供的函数测试。它返回的是一个Boolean类型的值。

every() 方法测试一个数组内的所有元素是高防服务器否都能通过某个指定函数的测试。它返回一个布尔值。

什么时候使用?

所有项目都符合一个条件可以用 every

const toto = [ 2, 4 ] toto.every(val => val % 2 === 0) // true const falsyToto = [ 2, 4, 5 ] falsyToto.every(val => val % 2 === 0) // false 

只要一个符合条件就行，用some

const toto = [ 2, 4, 5 ] toto.some(val => val % 2 !== 0) // return true 

6.不要使用delete来删除属性

从一个对象中 delete 一个属性是非常不好的(性能不好)，此外，它还会产生很多副作用。

但是如果你需要删除一个属性，你应该怎么做?

可以使用函数方式创建一个没有此属性的新对象，如下所示：

const removeProperty = (target, propertyToRemove) => {    const {  [propertyToRemove]: _, ...newTarget } = target   return newTarget } const toto = {  a: 55, b: 66 } const totoWithoutB = removeProperty(toto, b) // {  a: 55 } 

7.仅当对象存在时才向其添加属性

有时，如果对象已经定义了属性，我们需要向对象添加属性，我们可能会这样写：

const toto = {  name: toto } const other = {  other: other } // The condition is not important const condition = true if (condition) {     other.name = toto.name  } 

❌不是很好的代码

✅ 可以用一些更优雅的东西!

const condition = true const other = {     other: other,    ...condition && {  name: toto } } 

8. 使用模板字符串

在 JS 中学习字符串时，我们需要将它们与变量连接起来

const toto = toto const message = hello from  + toto + ! // hello from toto! 

 如果还有其它变量，我们就得写很长的表达式，这时可以使用模板字符串来优化。

const toto = toto const message = `hello from ${ toto}!` // hello from toto! 

9. 条件简写

当条件为 true 时，执行某些操作，我们可能会这样写：

if(condition){      toto() } 

这种方式可以用 && 简写:

condition && toto() 

10.设置变量的默认值

如果需要给一个变量设置一个默认值，可以这么做：

let toto console.log(toto) //undefined toto = toto ?? default value console.log(toto) //default value toto = toto ?? new value console.log(toto) //default value 

11.使用 console timer

如果需要知道一个函数的执行时间，亿华云计算可以这么做：

for (i = 0; i < 100000; i++) {    // some code } console.timeEnd() // x ms 

作者：CodeOz 译者：前端小智 来源：dev 原文：https://dev.to/codeoz/improve-your-js-skls-with-theses-tips-52ia