15个JS小技巧

245 阅读4分钟

6.随机项

生成随机数或从数组中获取随机项都是随手可得且非常有用的方法。这些方法已经在我的项目中出现过很多次了。

从数组中获取随机项,

通过一个指定了最小值和最大值的范围来生成一个随机数:

7.函数默认参数

在JavaScript中,函数参数(或参数)类似于这个函数的局部变量。在调用函数时,你既可以传递这些值,也可以选择不传递。如果你不传递参数的值,那么它将是undefined的状态,并且可能会导致一些其他不必要的状况出现。

有一种简单的方法,可以在定义参数时将默认值传递给函数参数。这里举的例子是,我们将默认值Hello传递给greetings函数的参数的message。

8.必备的函数参数

扩展默认参数技术,我们可以将参数标记为必需。首先定义一个函数,用错误消息抛出错误,

然后将功能分配为所需参数的默认值。请记住,在调用时为参数传递值时,将忽略默认值。但是,如果参数值为,则考虑默认值undefined。

在上面的代码中,name会是undefined状态,并且会试着为其设置默认值,即isRequired()函数。它将引发一个错误——

9.逗号运算符

当我意识到逗号(,)是一个单独的运算符并且从未被人注意到时,我感到非常惊讶。我已经在代码中使用很多次了,但从未意识到它如此真实的存在。

在JavaScript中,comma(,)运算符用于从左到右计算其每个操作数,并返回最后一个操作数的值。 在上面的示例中,变量的值为ret2。与实例类似,以下代码的输出将值32记录到控制台中。 我们在哪里使用它?有什么想法吗?comma(,)运算符最常见的用法就是在for循环中提供多个参数。

10.合并多个对象

你可能需要将两个对象合并在一起,并创建一个更好的信息对象进行使用。你也可以使用(...)点差运算符进行同样的操作。(是的,三个点!)

分别考虑emp和job这两个对象, 使用spread运算符,将它们合并为: 还有另一种执行此合并的方法。使用Object.assign()。你还可以这样做: 输出: 要注意,spread运算符和Object.assign都要执行浅合并。在浅表合并中,第一个对象的属性将被与第二个对象相同的属性值覆盖。

如果要进行深度合并,请使用lodash中_merge之类的方法。

11.解构 将数组元素和对象属性分解为变量的技术,被称为destructuring。让我们来看几个例子,

数组

在这里,我们有一系列的表情符号, 为了进行解构,我们将使用以下语法, 与执行相同,letfire = emojis[0];但具有更大的灵活性。你有没有注意到,我用一个空白的区域替换了原有的奖杯表情符号?那么,这将输出什么呢? 输出: 再介绍一下rest操作符。如果要对数组进行解构,以便要将一个或多个项目分配给变量,并将其余部分放在另一个数组中,就可以使用如下所示的...rest方法完成此操作。

输出:

对象

像数组一样,我们也可以解构对象。

像这样进行解构,我们就获得了名称,在一组变量的两边,并且其余部分在另一个对象中。 输出:

12.交换变量 现在运用我们刚刚学过的destructuring概念,就变得非常简单了。

13.isArray

确定输入的是否为数组,还有另一个有用的方法。

14.未定义vs空

undefined是一个已经声明,但变量未被定义的值。

null本身是一个空的且不存在的值,必须明确地分配给变量。

undefined与null并不严格相等

15.获取查询参数

window.location对象具有许多实用的方法和属性。使用这些属性和方法,我们可以从浏览器URL中获取有关协议,主机,端口,域等的信息。

我发现其中一个非常有用的特性是,

Location.search属性从位置URL返回查询字符串。我们可以使用另一个有用的被称为URLSearchParams的接口,以及location.search获取查询参数的值。 输出:js

原文链接: blog.greenroots.info/my-favorite…

作者:TapasAdhikary