千家信息网

JavaScript常规函数和箭头函数怎么写

发表于:2024-11-24 作者:千家信息网编辑
千家信息网最后更新 2024年11月24日,这篇文章主要介绍"JavaScript常规函数和箭头函数怎么写"的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇"JavaScript常规函数和箭头函数怎么写"文章
千家信息网最后更新 2024年11月24日JavaScript常规函数和箭头函数怎么写

这篇文章主要介绍"JavaScript常规函数和箭头函数怎么写"的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇"JavaScript常规函数和箭头函数怎么写"文章能帮助大家解决问题。

1- 函数声明

这是我们所知道的类型,类似于其他编程语言的功能。函数声明有两种类型:

a.传统函数:传统(常规)函数具有以下模式:

function functionName ( optionalParameter/s ){}例如:

function print(){console.log("hello world");}

并带有参数:

function add(number1,number2){return number1 + number2}

b.简写函数

简写函数是一个常规函数,但对于一个类..模式的不同之处在于我们不写函数关键字,所以它是:
functionName (optionalParameter/s ){}

让我们在一个带有速记函数的示例中看到它,我们将其称为 login:

class user: constructor(name,email){   this.userName = name;   this.userEmail = email;} login(){ console.log(`Hello ${this.name} you have login successfully`);}

2- 函数表达式

函数表达式就像一个函数声明,但我们将它分配给一个对象(变量)让我们讨论它的 4 种类型:

a.正则函数表达式

让我们谈谈这意味着什么:

如果我们有这个函数:

function print(){console.log("hello world");}

然后当我们想要调用它时,我们输入:

print()

但是在正则函数表达式中,我们会将函数保存在变量中"将函数分配给变量",例如:

let myPrint = function print(){console.log("hello world");}

现在如果我们尝试调用 print 会发生什么? 这将导致一个错误,告诉我们没有定义 print 那么我们如何才能到达该函数呢? 我们可以使用分配给函数的变量名 (myPrint)。 在我们的例子中,我们直接为变量分配了一个函数,这意味着我们的变量来自函数类型,所以让我们尝试调用它,结果显然是有效的。

b. 立即调用函数表达式 (Immediately Invoked Function Expression)

从它的名字来看,IIFE 会被立即调用,你可以把它想象成函数调用了自己并且会被执行。语法很简单 .. 我们有一个函数:functionfunctionName(){动作,}

你可以将在括号或"圆括号" (functionfunctionName(){动作之间包含函数,})并以这种方式以另一个括号结束函数:(functionfunctionName(){动作})();

所以你现在的预计是:这个函数将在文件执行开始时立即调用

让我们写一个例子:

(function print(){console.log("hello world");})();

让我们开始: 让我们执行它:

但是等等.. 我们说过我们要将函数分配给一个变量!然后让我们这样做:

let myPrint = (function print(){console.log("hello world");})();

现在会发生什么?让我们使用它:

简单的答案是因为 IIFE 调用了自己 .. 这意味着当我们将函数分配给变量时,该函数立即被调用并且保存的内容"分配给"我们的 myPrint 变量是结果..所以首先我们必须删除调用括号并重试: 所以现在它可以工作并且变量的类型未定义

让我们更改函数以给变量 myPrint 一个字符串类型:

C. 匿名函数这是一个匿名函数,仅此而已!只是一个没有名字的函数 ..

语法如下:[var|let|const] variableName = function(){actions}

注意这里的函数要赋值给一个变量,否则会报错

额外的例子:让我们尝试结合匿名函数和 IIFE :

d. 箭头函数

我们终于来了..让我们分步骤编写箭头函数语法:

首先:让我们从上面窃取匿名函数语法[var|let|const] variableName = function(){actions}

下一个:删除function关键字:[var|let|const] variableName = (){actions}

最后:在括号后添加 (=>) 符号:[var|let|const] variableName = ()=>{actions}

完成了..这是我们的语法,所以让我们现在试试:我们的例子:

let myPrint = ()=> {    return "hello world";    }

关于"JavaScript常规函数和箭头函数怎么写"的内容就介绍到这里了,感谢大家的阅读。如果想了解更多行业相关的知识,可以关注行业资讯频道,小编每天都会为大家更新不同的知识点。

0