@stylistic/js/

object-property-newline

このルールは、オブジェクトリテラルのプロパティ指定の位置を制限することができます。任意のプロパティ指定の一部が、他のプロパティ指定の一部と同じ行に表示されることを禁止できます。この禁止を絶対的に行うことも、オブジェクトオプションを呼び出すことで例外を許可し、オブジェクトリテラルのすべてのプロパティ指定のすべてのパーツを1行に記述できるようにすることもできます。

ルールの詳細

動機

このルールにより、一部のスタイルガイドで要求されているように、読みやすさを向上させるためにプロパティ指定を別々の行に表示することを保証できます。たとえば、次のすべてを禁止できます。

const newObject = {a: 1, b: [2, {a: 3, b: 4}]};
const newObject = {
    a: 1, b: [2, {a: 3, b: 4}]
};
const newObject = {
    a: 1,
    b: [2, {a: 3, b: 4}]
};
const newObject = {
    a: 1,
    b: [
        2,
        {a: 3, b: 4}
    ]
};

これらの代わりに、次のように記述することでルールに準拠できます。

const newObject = {
    a: 1,
    b: [2, {
        a: 3,
        b: 4
    }]
};

または

const newObject = {
    a: 1,
    b: [
        2,
        {
            a: 3,
            b: 4
        }
    ]
};

このルールのもう1つの利点は、プロパティが変更されたときの差分の特異性です。

// More specific
 var obj = {
     foo: "foo",
-    bar: "bar",
+    bar: "bazz",
     baz: "baz"
 };

// Less specific
-var obj = { foo: "foo", bar: "bar", baz: "baz" };
+var obj = { foo: "foo", bar: "bazz", baz: "baz" };

オプションの例外

このルールは、1つのオブジェクトオプション `allowAllPropertiesOnSameLine`（非推奨の同義語は `allowMultiplePropertiesPerLine`）を提供します。これを `true` に設定すると、上記の最初の2つのような、すべてのプロパティ指定が同じ行にあるオブジェクトリテラルが許可されますが、次のようなオブジェクトリテラルは許可されません。

const newObject = {
    a: 'a.m.', b: 'p.m.',
    c: 'daylight saving time'
};

これは、2つのプロパティが同じ行に表示されますが、すべてのプロパティが表示されるわけではないため、禁止されます。

表記

このルールは、次のような表記に関係なく、すべてのプロパティ指定に等しく適用されます。

• `a: 1` (ES5)
• `a` (ES2015 省略記法プロパティ)
• ``[`prop${a}`]`` (ES2015 算出プロパティ名)

したがって、ルール（オプションの例外なし）は、次の両方を禁止します。

const newObject = {
    a: 1, [
        process.argv[4]
    ]: '01'
};
const newObject = {
    a: 1, [process.argv[4]]: '01'
};

（この動作は、以下に引用されているJSCSルールの動作とは異なります。JSCSルールは、算出プロパティ名の先頭の `[` をそのプロパティ指定の一部として扱いません。JSCSルールは、これらの形式の2番目を禁止しますが、1番目を許可します。）

複数行のプロパティ

このルールは、1つのプロパティ指定の少なくとも1文字と、他のプロパティ指定の少なくとも1文字が同じ行に配置されることを禁止します。たとえば、このルールは次を禁止します。

const newObject = {a: [
    'Officiële website van de Europese Unie',
    'Официален уебсайт на Европейския съюз'
], b: 2};

これは、`a` の指定の1文字（つまり、その値の末尾の `]`）が `b` の指定と同じ行にあるためです。

オプションの例外は、このケースを許容しません。プロパティ指定のコレクション全体が1行ではなく4行にまたがっているためです。

プロパティ間の区切り文字

プロパティ指定を区切るカンマと空白は、それらの一部とは見なされません。したがって、このルールは次の両方の形式を許可します。

const newFunction = multiplier => ({
    a: 2 * multiplier,
    b: 4 * multiplier,
    c: 8 * multiplier
});
const newFunction = multiplier => ({
    a: 2 * multiplier
    , b: 4 * multiplier
    , c: 8 * multiplier
});

（この動作は、以下に引用されているJSCSルールの動作とは異なります。JSCSルールは、最初の形式を許可しますが、2番目の形式を禁止します。）

--fix

このルールがコマンドラインの `--fix` オプションで呼び出された場合、ルールに違反するオブジェクトリテラルは、一般にルールに準拠するように変更されます。それぞれの場合の変更は、前のプロパティ指定の一部または全部が同じ行にある場合は常に、プロパティ指定を次の行に移動することです。たとえば、

const newObject = {
    a: 'a.m.', b: 'p.m.',
    c: 'daylight saving time'
};

は次のように変換されます。

const newObject = {
    a: 'a.m.',
b: 'p.m.',
    c: 'daylight saving time'
};

変更は、オブジェクトオプションが `true` に設定されているかどうかに依存しません。言い換えれば、ESLintは、オブジェクトオプションで許可されている場合でも、すべてのプロパティ指定を1行にまとめることはありません。

ESLintは、コメントが2番目以降のプロパティ指定の直前にある場合、このルールの違反を修正しません。ESLintは、コメントをどの行に配置するかを判断できないためです。

上記のように、このルールに適用される `--fix` オプションは、`indent` などの他のルールには準拠していませんが、それらの他のルールも有効になっている場合は、オプションはそれらにも適用されます。

例

オブジェクトオプションがない場合、または `allowAllPropertiesOnSameLine` が `false` に設定されている場合の、このルールの**誤った**コードの例

/*eslint @stylistic/js/object-property-newline: "error"*/

const obj0 = { foo: "foo", 
bar
: "bar", 
baz
: "baz" };

const obj1 = {
    foo: "foo", 
bar
: "bar", 
baz
: "baz"
};

const obj2 = {
    foo: "foo", 
bar
: "bar",
    baz: "baz"
};

const obj3 = {
    [process.argv[3] ? "foo" : "bar"]: 0, 
baz
: [
        1,
        2,
        4,
        8
    ]
};

const a = "antidisestablishmentarianistically";
const b = "yugoslavyalılaştırabildiklerimizdenmişsiniz";
const obj4 = {a, 
b
};

const domain = process.argv[4];
const obj5 = {
    foo: "foo", 
[
    domain.includes(":") ? "complexdomain" : "simpledomain"
]: true};

誤り

オブジェクトオプションがない場合、または `allowAllPropertiesOnSameLine` が `false` に設定されている場合の、このルールの**正しい**コードの例

/*eslint @stylistic/js/object-property-newline: "error"*/

const obj1 = {
    foo: "foo",
    bar: "bar",
    baz: "baz"
};

const obj2 = {
    foo: "foo"
    , bar: "bar"
    , baz: "baz"
};

const user = process.argv[2];
const obj3 = {
    user,
    [process.argv[3] ? "foo" : "bar"]: 0,
    baz: [
        1,
        2,
        4,
        8
    ]
};

正しい

`{ "allowAllPropertiesOnSameLine": true }` オプションを使用した、このルールの追加の**正しい**コードの例

/*eslint @stylistic/js/object-property-newline: ["error", { "allowAllPropertiesOnSameLine": true }]*/

const obj = { foo: "foo", bar: "bar", baz: "baz" };

const obj2 = {
    foo: "foo", bar: "bar", baz: "baz"
};
const user = process.argv[2];
const obj3 = {
    user, [process.argv[3] ? "foo" : "bar"]: 0, baz: [1, 2, 4, 8]
};

正しい

使用しない場合

プロパティ指定を別々の行に配置するかどうかをケースバイケースで決定する場合は、このルールを無効にすることができます。

互換性

• **JSCS**: このルールは、requireObjectKeysOnNewLine と部分的に互換性があります。