文章详情

短信预约-IT技能 免费直播动态提醒

请输入下面的图形验证码

提交验证

短信预约提醒成功

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

2024-04-02 19:55

关注


这篇文章给大家介绍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代码之函数参数和副作用是什么就分享到这里了,希望以上内容可以对大家有一定的帮助,可以学到更多知识。如果觉得文章不错,可以把它分享出去让更多的人看到。

阅读原文内容投诉

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

软考中级精品资料免费领

  • 历年真题答案解析
  • 备考技巧名师总结
  • 高频考点精准押题
  • 2024年上半年信息系统项目管理师第二批次真题及答案解析(完整版)

    难度     813人已做
    查看
  • 【考后总结】2024年5月26日信息系统项目管理师第2批次考情分析

    难度     354人已做
    查看
  • 【考后总结】2024年5月25日信息系统项目管理师第1批次考情分析

    难度     318人已做
    查看
  • 2024年上半年软考高项第一、二批次真题考点汇总(完整版)

    难度     435人已做
    查看
  • 2024年上半年系统架构设计师考试综合知识真题

    难度     224人已做
    查看

相关文章

发现更多好内容

猜你喜欢

AI推送时光机
位置:首页-资讯-后端开发
咦!没有更多了?去看看其它编程学习网 内容吧
首页课程
资料下载
问答资讯