定义JavaScript函数

Question

在我的项目中（仅限浏览器上下文）我想使用JS代码质量工具。我已经尝试了jslint和eslint。我希望linter帮助我使我的代码干净，清晰，错误并提高其整体质量。我不想做的是我不想写一些肮脏的黑客或使用不良做法只是为了让傻瓜高兴。

我只关心一个问题。他们都报告了我在定义之前使用函数的问题。显然，在以下代码片段bar在其定义之前不会被调用。

function foo() {
    bar();
}

function bar() {

}

foo();

在这个最简单的场景中，我可以在bar之前移动foo。但有些情况下，这是不可能的。第一个函数使用第二个函数，第二个函数使用第三个函数，第三个函数使用第一个函数。

似乎我可以通过在他们的定义之前声明所有功能来使快乐变得快乐。

var foo;

var bar;

foo = function() {
    bar();
};

bar = function() {

};

foo();

问题是：

• 第一个代码段是否已损坏？我想 - 不是。
• 第一个代码段是否容易出错？我猜 - 也许吧。
• 组织代码就像第二个片段（在定义函数之前声明函数）一样，这是一个好习惯吗？
• 如果yes我应该坚持这种做法，那不是吗？
• 如果no有关此问题的良好做法是什么？
• 这个linter错误值得关注还是我应该禁用它？

Answer 1

不，这些片段没有被破坏，但也没有最佳实践。

var foo = function(){

}

var bar = function(){
  foo();
}

bar();

实际上会成为：

var foo, bar;

foo = function(){

}

bar = function(){
  foo();
}

bar();

因此，您应该在范围的开头定义所有变量和函数。 JavaScript使用Hoisting  它有效地将变量和函数的所有声明移动到范围的顶部。

自己做这件事被认为是最佳做法，并提高了可读性。

Eslint将检查已定义并记录的{strong> vars-on-top 规则here

https://www.reddit.com/r/learnjavascript/comments/3cq24a/crockford_says_hoisted_variable_declarations_are/ https://www.sitepoint.com/demystifying-javascript-variable-scope-hoisting/

Answer 2

1. 第一个代码段是否已损坏？不，它没有被打破。
2. 第一个代码段是否容易出错？否。
3. 组织代码如第二个片段（在定义函数之前声明函数）是一个好习惯吗？没有很多其他好方法
4. 如果是，我应该坚持这种做法，不是吗？是
5. 如果不是这个问题的良好做法是什么？你可以遵循很多好的模式
6. 这个linter错误值得关注还是我应该禁用它？注意保持代码清洁是件好事

始终使用严格模式。 "use strict"

让你在像IIFE这样的范围内运行，因为没有全局变量

read more about IIFE

function foo() {
    bar();
};

function bar() {

};