全文共3019字，预计学习时长9分钟
来源：Pexels
JavaScript是目前最流行的编程语言之一。就像任何其他编程语言一样，它有许多让人马上就能学会的小技巧。
每一个技巧都能完成大多数开发人员每天需要完成的工作。根据经验，读者可能已经知道了其中一些，然而仍会对其他的技巧大吃一惊。
本文将介绍一系列技巧，而这些技巧能将读者打造为一名更好的开发人员，并增强JavaScript技能。
我们一起来看看吧~
1.对象解构
开发人员一旦了解了对象解构，就可能每天都会用到。
但什么是解构呢？
解构是一个JavaScript表达式，允许将数组、对象、映射和集合中的数据提取到其自己的变量中。它允许您一次从一个或多个对象中提取属性。
一起看看以下示例，其中有一个用户对象。如果要将用户名(name)存储在变量中，则必须将其赋给新行上的变量。如果想把性别(gender)也存储在一个变量中，就必须重复上述操作。
-
const user = {
-
name:
'Frank',
-
age:
23,
-
gender:
'M',
-
member:
false
-
}
const name = user.name
-
const gender = user.gender
使用解构，就可以通过以下语法直接获取对象属性的变量：
-
const { name, age, gender, member }= user;
console.log(name)
// Frank
-
console.log(age)
// 23
-
console.log(gender)
// M
-
console.log(member)
// false
2.使用设备性能以更好地调试
来源：Pexels
作为一名开发人员，做的最多的事情就是调试。但是调试不仅仅是使用console.log在控制台打印出一堆日志信息这么简单。
知道控制台对象有分析代码片段性能的好办法吗？大多开发人员只知道用标准的console.log方法来调试代码。
控制台对象有很多有用的功能。它有一个time和timeEnd函数，可以帮助分析性能。其工作原理非常简单。
在被测试的代码前调用console.time函数。此函数有一个参数，接受一个描述被分析内容的字符串。在被测试代码的末尾，调用console.timeEnd函数。给这个函数与第一个参数相同的字符串。然后，运行代码所需的时间将会在控制台中显示。
-
console.time(
'loop')
for (
let i =
0; i <
10000; i++) {
-
// Do stuff here
-
}
console.timeEnd(
'loop')
3. Every和 some函数
Every和some函数并不是为所有开发人员熟知。然而，它们在某些情况下非常有用。先来讲讲every函数。如果想要知道数组中的所有元素是否都通过了某个测试，那就可以应用此函数。本质上，这是在遍历数组中的每个元素，并且检查它们是否属性都为真。
这听起来可能有些抽象，所以请看以下示例。并没有那么复杂。
-
const random_numbers = [
13,
2,
37,
18,
5 ]
-
const more_random_numbers = [
0,
-1,
30,
22 ]
const isPositive =
(number) =>{
-
return number >
0
-
}random_numbers.every(isPositive);
// returns true
-
more_random_numbers.every(isPositive);
// returns false
Every函数返回一个布尔值。如果数组中的所有元素都通过了测试，则返回“真”(true)。如果数组中的某个元素未通过测试，则返回“假” (false)。
也可以使用一个匿名函数作为测试函数：
-
random_numbers.every(
(number) =>{
-
return number >
0
-
})
some函数与every函数的工作原理几乎完全相同。两个函数只有一个主要区别：some函数测试的是数组中是否至少有一个元素通过了测试。
回顾上述实例，如果使用some函数而不是every函数，那么两个数组都将返回“真”(true)，因为两个数组都包含一个正数。
-
const random_numbers = [
13,
2,
37,
18,
5 ]
-
const more_random_numbers = [
0,
-1,
30,
22 ]
const isPositive =
(number) =>{
-
return number >
0
-
}random_numbers.some(isPositive);
// returns true
-
more_random_numbers.some(isPositive);
// returns true
4.有条件地设置一个变量
有条件地设置一个变量很简单，而且能使代码更漂亮。在应用这个技巧的时候并不需要编写if语句——这是笔者最喜欢的JavaScript技巧之一。
所以要如何有条件地设置一个变量？
const timezone =user.preferred_timezone || 'America/New_York'
上述例子是检查用户是否有首选时区。如果用户有首选时区，则使用该时区。如果用户没有首选时区，则使用默认时区，即“美国/纽约”(‘America/New_York’)。
这段代码看起来比使用if语句要干净得多。
-
let timezone =
'America/New_York'
if(user.preferred_timezone) {
-
timezone = user.preferred_timezone
-
}
更简洁了，不是吗？
来源：Pexels
5.将值转换为字符串数组
有时需要将所有的值转换为字符串数组。例如，当使用Triple equal（===）运算符检查数组中是否存在某个数字时，可能会出现这种情况。
笔者最近遇到了一个问题，其包含multi-select控件。Select选项的HTML值是字符串而不是整数，而这是有意义的，选定值的数组如下所示：
let selected_values = [ '1', '5','8' ]
问题在于，没能成功检查所选值的数组中是否存在某个整数。笔者使用了一个Intersect函数，它使用了triple equals(===)运算符。并且由于‘5’ !== 5 ，而必须找到一个解决办法。
在笔者看来，最漂亮的解决方案是将数组中的所有值都转换为整数。当笔者进行尝试时，偶然间发现了一个极其简单，却又漂亮的解决办法。
selected_values = selected_values.map(Number)// [ 1, 5, 8 ]
与将所有值转换为整数不同，可以通过简单地更改map函数的参数，将数组中的值转化为布尔值。
-
-
selected_values =selected_values.
map(Boolean)
来源：Pexels
美好的未来在召唤你~干巴爹~
留言 点赞 关注
我们一起分享AI学习与发展的干货
欢迎关注全平台AI垂类自媒体 “读芯术”
（添加小编微信：dxsxbb，加入读者圈，一起讨论最新鲜的人工智能科技哦～）
转载：https://blog.csdn.net/duxinshuxiaobian/article/details/105290899