在 ES6 中声明一个函数？

Question

我想将我的 javascript 代码“更新”到新的 ES6 标准，所以我查看了函数现在是如何编写的，并在我的全局函数上进行了尝试，它在“旧”es5 中看起来像这样

function logMessage(message) {
    document.getElementById("logs").innerHTML = document.getElementById("logs").innerHTML + `<li  class="item-padding">  ${message} </li>`
}

如果我没记错的话，正确的“转换”到 ES6 应该是这样的：

logMessage = message => {
    etc
}

但是我的 ESLint 告诉我我的 logMessage 没有定义，我在控制台中收到错误，我错过了什么吗？我是否必须在 logMessage 之前声明 var、let 或 const？

我不知道它是否重要，但我也想将这个函数从文件一导出到文件二，并在文件二的另一个函数中使用函数 logMessage，这样做时我需要记住什么?

感谢您的帮助！

编辑：感谢大家的回答对我帮助很大，解决了我的问题！

Answer 1

如果我没记错的话，到 es6 的正确“转换”应该是这样的

你错了。

Arrow functions 是一种具有不同行为的新语法。它们不是直接替代函数声明和函数表达式（两者在 ES6 中仍然存在）。

但是我的 ESLint 告诉我我的 logMessage 没有定义，我在控制台中收到错误，我错过了什么吗？我必须在 logMessage 之前声明 var、let 或 const 吗？

是的。您正在将某些内容分配给变量。 You must declare the variable first。

我也想把这个函数从文件一导出到文件二

如何定义函数与导出它的能力无关。

Answer 2

function logMessage(message) {
    // etc...
}

... 是在 es6 中仍然完全有效的函数声明。您正在将函数声明转换为函数表达式，在 es5 中看起来像这样...

logMessage = function(message) {
    // etc...
}

...然后进入es6 ...

logMessage = message => {
    // etc
}

...所以 linting 问题不是由 es6 语法引入的，而是使用函数表达式，分配给没有 var/let/const 的变量是全局变量。原来的函数声明会被提升也有区别，但函数表达式形式必须在调用之前声明。还有一个区别是 es6 箭头函数从父作用域中保留了 this 的上下文，所以值得注意的是它们不是 100% 直接的 1 对 1 的相互映射。

简短的回答，是的，变量需要用var/let/const 声明，以避免成为全局变量，无论它是否是函数。

let logMessage = message => {
    // etc
}