定義JavaScript函數

Question

在我的項目中（僅限瀏覽器上下文）我想使用JS代碼質量工具。 我已經嘗試了jslint和eslint 。 我希望linter幫助我使我的代碼干凈，清晰，錯誤並提高其整體質量。 我不想做的是我不想寫一些骯臟的黑客或使用不好的做法只是為了讓傻瓜高興。

我只關心一個問題。 他們都報告了一個問題，我在定義之前使用了一個函數。 在下面的代碼片段顯然bar不會它的定義之前調用。

function foo() {
    bar();
}

function bar() {

}

foo();

在這個最簡單的場景中，我可以在foo之前移動bar 。 但有些情況下，這是不可能的。 第一個功能使用第二個，第二個使用第三個，第三個使用第一個。

看起來我可以通過在他們的定義之前聲明所有函數來使這些變得快樂。

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將檢查此處定義和記錄的規則vars-on-top

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那樣在沒有全局變量的范圍內運作

了解有關IIFE的更多信息

function foo() {
    bar();
};

function bar() {

};