【JavaScript入门-12】Javascript中的声明函数的不同方式

大家好，我是半夏👴，一个刚刚开始写文的沙雕程序员.如果喜欢我的文章，可以关注➕ 点赞 👍 加我微信：frontendpicker，一起学习交流前端，成为更优秀的工程师～关注公众号：搞前端的半夏,了解更多前端知识！点我探索新世界！

在接触 JavaScript 时，您经常会听到一件事，那就是函数是*“一等公民”*。

JavaScript 函数本身就是值，它们可以存储在变量中并传递给其他函数。

JavaScript中的值是什么？下面的18就是值。

const age = 18;

这些是数字、字符串或布尔值。

JavaScript 最酷的地方在于函数可以是：

• 传递给其他函数。

• 存储在变量中，

对于其他所有编程语言来说，情况并非如此。

我们已经知道一种声明函数的方法，那就是使用 function 关键字，就像这样👇

function getUserName() {
  // 函数体
}

匿名函数

匿名函数，可以声明一个没有名称的函数。

可能有人就想了，我是不是把getUserName去掉就可以了。

function () {
  // 函数体
}

这条错误消息表示：SyntaxError：函数语句需要函数名

匿名函数仅在某些用例中有效，例如在回调（我们将在稍后了解更多）以及**IIFE（立即调用的函数表达式）**中使用它们

为什么你会想要一个匿名函数？

函数表达式

函数表达式可以用来声明匿名函数。是指将函数作为值存储在变量中。👇

let getUserName=function() {
  // 函数体
}

能够将函数存储在变量中是导致人们说函数是*“一等公民”的*原因。

函数声明和函数表达式有什么区别？

变量提升

真正的区别是它们如何在称为提升的东西中运行。后面我们会详细的说，这里我们将快速介绍这个概念。

let sayHello = function (name) {
 console.log("你好"+name)
};
function sayHello2 () {
 console.log("你好"+name)
}

假设在第一个sayHello函数之前，我们调用sayHello并传递了“搞前端的半夏”的值，如下图👇，你认为代码会运行吗？

let('搞前端的半夏')
const sayHello = function (name) {
 console.log("你好"+name)
};

会顺利执行嘛，并不会。

如果是sayHello2呢

可以正常运行。

为什么函数声明在定义之前调用它会起作用，但函数表达式却不起作用，尤其是当我们在两种情况下创建完全相同的函数时？

使用function关键字声明的函数称为提升的。

vaScript 将使用 function 关键字获取所有函数并将它们向上、向上、向上提升并说“你是一个函数，你属于文件的顶部”。这意味着可以在任何地方调用该函数。

JavaScript 不会提升变量函数。

箭头函数

声明函数的另一个方法是使用箭头函数。

箭头函数本身有几种不同的声明方式。它们是 JavaScript 的新成员，是在过去几年中添加的。

他们有几个好处：

• 语法简洁，往往更短。允许编写一行函数
• 没有自己的this关键字范围*

箭头函数也是匿名函数，这意味着无法像我们声明函数那样声明箭头函数function doctorize() {..}。您始终必须将其粘贴到变量中。

他的写法如下：

const sayHello = (name) => {
 console.log("你好"+name)
};

更多的我们会在后面接着说！

立即执行函数

IIFE（发音为iffy）也是声明函数的一种方法。

将该函数包装在括号中，（括号始终在 JavaScript 中首先运行），然后返回一个函数值，可以通过将括号放在末尾立即运行该函数，就像这样👇

(function () {
  console.log("立即执行函数");
})();