温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

JavaScript代码中的函数参数和副作用是什么

发布时间:2021-09-13 11:43:56 来源:亿速云 阅读:177 作者:柒染 栏目:web开发


这篇文章给大家介绍JavaScript代码之函数参数和副作用是什么,内容非常详细,感兴趣的小伙伴们可以参考借鉴,希望对大家能有所帮助。

函数是JavaScript程序的重要组成部分,用于将代码分成可重用的块。因此,为了拥有整洁的JavaScript代码,我们需要具有易于理解的函数。

本文将介绍优质函数的更多属性,包括标志参数,二元和三元函数以及副作用。

JavaScript代码中的函数参数和副作用是什么

标志参数

布尔参数应谨慎使用。它使函数签名更加复杂,并告诉我们函数不仅做一件事(具有多个路径)。

二元函数

二元函数比采用较少参数的函数更难理解。但有些时候使用二元函数是有道理的。例如,如果有一个保存笛卡尔坐标的对象,那么它应该有2个参数。

例如,可以创建一个带有构造函数的类,该构造函数有2个参数,如下所示:

class Point {   constructor(x, y) {     this.x = x;     this.y = y;   } }const point = new Point(1, 2);

用其他方式定义它几乎是不可能的。

但是,我们必须要意识到,与使用较少参数的函数相比,二元函数需要更多的时间和精力。

三元函数

具有3个参数的函数要花费大量时间和精力才能理解具有2个参数的函数。

如果存在2个或更少的参数,则有更多的参数组合可供考虑。

将参数合并为对象

如果一个函数含有多个参数,应该考虑将它们合并为对象。

如果参数之间有关联,则更应该这样做。例如,以下函数含有许多参数:

const describeFruit = (color,name, size, price, numSeeds, type) => {     return `${fruitName} is ${fruitColor}.It's ${fruitSize}. It costs ${price}. It has ${numSeeds}. The type if ${type}`; }

6个参数可能太多,可以通过传入一个对象来清理它:

const describeFruit = (fruit)=> {   return `${fruit.name} is${fruit.color}. It's ${fruit.size}. It costs ${fruit.price}. It has${fruit.numSeeds}. The type if ${fruit.type}`; }

如我们所见,它更加整洁,且无需担心大量参数的传递。

由于函数较为短小,因此也更适合屏幕显示。

5个参数可能是一个函数应该包含的最大值。

JavaScript代码中的函数参数和副作用是什么

动词和关键词

将动词和关键字包含在函数名称中不失为一个好主意,因为它们会执行某些操作,这意味着名称中的动词是合理的。

另外,我们需要知道执行操作的对象。这意味着必须添加一些关键字才能做到这一点。

例如,符合这一点的优质函数定义类似于:

const copyArray = (array) =>[...array];

copyArray 名称让我们知道函数复制了一个数组。

它还让我们知道要传递给函数的内容,这显然是一个数组。

无副作用

副作用是函数中的代码会对函数外部的内容进行更改。

这是很糟糕的,因为它会对函数之外的内容进行隐藏更改。

我们应该尽可能避免这种情况,因为这会造成一些出乎意料的事情,并且要花更多的时间进行测试,因为除了接受参数,执行操作并返回结果外,它还对必须考虑的函数之外的内容进行了更改。

这意味着我们必须测试函数返回结果之外的内容。

例如,如果有:

let numFruits = 1;  const addFruit = () => {    numFruits++;  }const removeFruit = () => {    numFruits--;  }

那么我们有2个具有副作用的函数,因为它们都更改了各自函数外部的 numFruits变量。

编写这些函数的更好方法是将它们编写为纯函数。纯函数是在传入相同参数的情况下返回相同内容的函数。而且,它没有副作用。

因此,纯函数更易于测试,并且它们的行为也是可以预测的。

重写上面的代码,如下所示:

let numFruits = 1; const addFruit = (numberOfFruits) => numberOfFruits + 1; const removeFruit = (numberOfFruits) => numberOfFruits - 1;numFruits = addFruit(numFruits); numFruits = removeFruit(numFruits);

现在,有2个函数来接收numFruits 参数,并分别返回一个更大或更小的数字。

然后可以使用它们来更改函数外部的numFruits变量。

如我们所见,它们对 numFruits 不执行任何操作,而是分别返回numberOfFruits参数加1或减1。

如果为它们编写测试,则可以通过传入输入和检查输出是否是我们想要的内容来轻松测试它们。这比将副作用赋予可能适用于测试代码的变量要好得多。

JavaScript代码中的函数参数和副作用是什么

标志参数应最小化。他们告诉我们,该函数不仅完成一件事情,而且是函数签名中的另一个参数。

使用较少参数的函数要优于使用较多参数的函数。如果需要很多参数,请考虑将它们合并成一个对象。

最后,若条件允许,应尽量避免副作用。具有副作用的函数会执行隐藏操作,并且很难对它进行测试。纯函数不会产生副作用,因此更具可测试性和可预测性。

关于JavaScript代码之函数参数和副作用是什么就分享到这里了,希望以上内容可以对大家有一定的帮助,可以学到更多知识。如果觉得文章不错,可以把它分享出去让更多的人看到。

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI