コンテンツへスキップ

@stylistic/js/

padding-line-between-statements

このルールは、指定された2種類のステートメント間に空行を必須または禁止します。適切な空行は、開発者がコードを理解するのに役立ちます。

例えば、次の設定では、変数宣言とreturnステートメントの間に空行が必要です。

js
/*eslint @stylistic/js/padding-line-between-statements: [
    "error",
    { blankLine: "always", prev: "var", next: "return" }
]*/

function foo() {
    var a = 1;

    return a;
}

ルールの詳細

設定が提供されていない場合、このルールは何もしません。

設定は、blankLineprev、およびnextの3つのプロパティを持つオブジェクトです。例えば、{ blankLine: "always", prev: "var", next: "return" }は、「変数宣言とreturnステートメントの間に1つ以上の空行が必要」という意味です。任意の数の設定を指定できます。ステートメントのペアが複数の設定に一致する場合、最後に一致した設定が使用されます。

json
{
    "padding-line-between-statements": [
        "error",
        { "blankLine": LINEBREAK_TYPE, "prev": STATEMENT_TYPE, "next": STATEMENT_TYPE },
        { "blankLine": LINEBREAK_TYPE, "prev": STATEMENT_TYPE, "next": STATEMENT_TYPE },
        { "blankLine": LINEBREAK_TYPE, "prev": STATEMENT_TYPE, "next": STATEMENT_TYPE },
        { "blankLine": LINEBREAK_TYPE, "prev": STATEMENT_TYPE, "next": STATEMENT_TYPE },
        ...
    ]
}
  • LINEBREAK_TYPEは、次のいずれかです。

    • "any"は、ステートメントのペアを無視します。
    • "never"は、空行を禁止します。
    • "always"は、1つ以上の空行を必須とします。コメントが存在する行は空行としてカウントしないことに注意してください。
  • STATEMENT_TYPEは、次のいずれか、または次の配列です。

    • "*"はワイルドカードです。これはすべてのステートメントに一致します。
    • "block"は、単独のブロックです。
    • "block-like"は、ブロックのようなステートメントです。これは、最後のトークンがブロックの閉じ中括弧であるステートメントに一致します。例:{ }if (a) { }、およびwhile (a) { }。即時実行関数式ステートメントにも一致します。
    • "break"は、breakステートメントです。
    • "case"は、switchステートメント内のcase句です。
    • "cjs-export"は、CommonJSのexportステートメントです。例:module.exports = 0module.exports.foo = 1、およびexports.foo = 2。これは代入の特殊なケースです。
    • "cjs-import"は、CommonJSのimportステートメントです。例:const foo = require("foo")。これは変数宣言の特殊なケースです。
    • "class"は、class宣言です。
    • "const"は、単一行と複数行の両方のconst変数宣言です。
    • "continue"は、continueステートメントです。
    • "debugger"は、debuggerステートメントです。
    • "default"は、switchステートメント内のdefault句です。
    • "directive"は、ディレクティブプロローグです。これは、ディレクティブに一致します。例:"use strict"
    • "do"は、do-whileステートメントです。これは、最初のトークンがdoキーワードであるすべてのステートメントに一致します。
    • "empty"は、空のステートメントです。
    • "export"は、export宣言です。
    • "expression"は、式ステートメントです。
    • "for"は、forループファミリーです。これは、最初のトークンがforキーワードであるすべてのステートメントに一致します。
    • "function"は、関数宣言です。
    • "if"は、ifステートメントです。
    • "iife"は、即時実行関数式ステートメントです。これは、関数式への呼び出しに一致します(オプションで単項演算子が前に付いています)。
    • "import"は、import宣言です。
    • "let"は、単一行と複数行の両方のlet変数宣言です。
    • "multiline-block-like"は、ブロックのようなステートメントです。これは、block-likeタイプと同じですが、ブロックが複数行の場合のみです。
    • "multiline-const"は、複数行のconst変数宣言です。
    • "multiline-expression"は、式ステートメントです。これは、expressionタイプと同じですが、ステートメントが複数行の場合のみです。
    • "multiline-let"は、複数行のlet変数宣言です。
    • "multiline-var"は、複数行のvar変数宣言です。
    • "return"は、returnステートメントです。
    • "singleline-const"は、単一行のconst変数宣言です。
    • "singleline-let"は、単一行のlet変数宣言です。
    • "singleline-var"は、単一行のvar変数宣言です。
    • "switch"は、switchステートメントです。
    • "throw"は、throwステートメントです。
    • "try"は、tryステートメントです。
    • "var"は、単一行と複数行の両方のvar変数宣言です。
    • "while"は、whileループステートメントです。
    • "with"は、withステートメントです。

この設定では、newline-before-returnルールのように、すべてのreturnステートメントの前に空行が必要です。

[{ blankLine: "always", prev: "*", next: "return" }]設定の不正なコードの例

js
/*eslint @stylistic/js/padding-line-between-statements: [
    "error",
    { blankLine: "always", prev: "*", next: "return" }
]*/

function foo() {
    bar();
        
return;
}
不正

[{ blankLine: "always", prev: "*", next: "return" }]設定の正しいコードの例

js
/*eslint @stylistic/js/padding-line-between-statements: [
    "error",
    { blankLine: "always", prev: "*", next: "return" }
]*/

function foo1() {
    bar();

    return;
}

function foo2() {
    return;
}
正しい

この設定では、newline-after-varルールのように、変数宣言のすべてのシーケンスの後に空行が必要です。

[{ blankLine: "always", prev: ["const", "let", "var"], next: "*"}, { blankLine: "any", prev: ["const", "let", "var"], next: ["const", "let", "var"]}]設定の不正なコードの例

js
/*eslint @stylistic/js/padding-line-between-statements: [
    "error",
    { blankLine: "always", prev: ["const", "let", "var"], next: "*"},
    { blankLine: "any",    prev: ["const", "let", "var"], next: ["const", "let", "var"]}
]*/

function foo1() {
    var a = 0;
        
bar();
} function foo2() { let a = 0;
bar();
} function foo3() { const a = 0;
bar();
} class C { static { let a = 0;
bar();
} }
不正

[{ blankLine: "always", prev: ["const", "let", "var"], next: "*"}, { blankLine: "any", prev: ["const", "let", "var"], next: ["const", "let", "var"]}]設定の正しいコードの例

js
/*eslint @stylistic/js/padding-line-between-statements: [
    "error",
    { blankLine: "always", prev: ["const", "let", "var"], next: "*"},
    { blankLine: "any",    prev: ["const", "let", "var"], next: ["const", "let", "var"]}
]*/

function foo1() {
    var a = 0;
    var b = 0;

    bar();
}

function foo2() {
    let a = 0;
    const b = 0;

    bar();
}

function foo3() {
    const a = 0;
    const b = 0;

    bar();
}

class C {
    static {
        let a = 0;
        let b = 0;

        bar();
    }
}
正しい

この設定では、lines-around-directiveルールのように、すべてのディレクティブプロローグの後に空行が必要です。

[{ blankLine: "always", prev: "directive", next: "*" }, { blankLine: "any", prev: "directive", next: "directive" }]設定の不正なコードの例

js
/*eslint @stylistic/js/padding-line-between-statements: [
    "error",
    { blankLine: "always", prev: "directive", next: "*" },
    { blankLine: "any",    prev: "directive", next: "directive" }
]*/

"use strict";
foo();
不正

[{ blankLine: "always", prev: "directive", next: "*" }, { blankLine: "any", prev: "directive", next: "directive" }]設定の正しいコードの例

js
/*eslint @stylistic/js/padding-line-between-statements: [
    "error",
    { blankLine: "always", prev: "directive", next: "*" },
    { blankLine: "any",    prev: "directive", next: "directive" }
]*/

"use strict";
"use asm";

foo();
正しい

この設定では、switchステートメント内の句の間に空行が必要です。

[{ blankLine: "always", prev: ["case", "default"], next: "*" }]設定の不正なコードの例

js
/*eslint @stylistic/js/padding-line-between-statements: [
    "error",
    { blankLine: "always", prev: ["case", "default"], next: "*" }
]*/

switch (foo) {
    case 1:
        bar();
        break;
        
case 2:
case 3:
baz(); break;
default:
quux(); }
不正

[{ blankLine: "always", prev: ["case", "default"], next: "*" }]設定の正しいコードの例

js
/*eslint @stylistic/js/padding-line-between-statements: [
    "error",
    { blankLine: "always", prev: ["case", "default"], next: "*" }
]*/

switch (foo) {
    case 1:
        bar();
        break;

    case 2:

    case 3:
        baz();
        break;

    default:
        quux();
}
正しい

使用しない場合

改行に関する警告を通知したくない場合は、このルールを無効にしても安全です。

互換性

MITライセンスの下でリリースされています。