accessor-pairs

在物件和類別中強制執行 getter 和 setter 配對

在 JavaScript 中，常見的錯誤是建立一個物件，其中只有屬性的 setter，但從未定義對應的 getter。沒有 getter，您就無法讀取屬性，因此最終未使用它。

以下是一些範例

// Bad
const o = {
    set a(value) {
        this.val = value;
    }
};


// Good
const p = {
    set a(value) {
        this.val = value;
    },
    get a() {
        return this.val;
    }
};

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

如果定義了 setter 但沒有 getter，此規則會發出警告。使用選項 getWithoutSet，如果 getter 沒有 setter，它也會發出警告。

規則詳細資訊

此規則強制執行一種樣式，要求每個定義了 setter 的屬性都必須有一個 getter。

透過啟用選項 getWithoutSet，它會強制要求每個定義了 getter 的屬性都必須存在 setter。

此規則始終檢查物件實字和屬性描述符。預設情況下，它還會檢查類別宣告和類別表達式。

選項

• setWithoutGet 設定為 true 將警告 setter 沒有 getter（預設為 true）。
• getWithoutSet 設定為 true 將警告 getter 沒有 setter（預設為 false）。
• enforceForClassMembers 設定為 true 會額外將此規則應用於類別 getter/setter（預設為 true）。如果您希望此規則忽略類別宣告和類別表達式，請將 enforceForClassMembers 設定為 false。

setWithoutGet

針對預設 { "setWithoutGet": true } 選項的不正確程式碼範例

/*eslint accessor-pairs: "error"*/

const q = {
    set a(value) {
        this.val = value;
    }
};


const r = {d: 1};
Object.defineProperty(r, 'c', {
    set: function(value) {
        this.val = value;
    }
});
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

針對預設 { "setWithoutGet": true } 選項的正確程式碼範例

/*eslint accessor-pairs: "error"*/

const s = {
    set a(value) {
        this.val = value;
    },
    get a() {
        return this.val;
    }
};

const t = {d: 1};
Object.defineProperty(t, 'c', {
    set: function(value) {
        this.val = value;
    },
    get: function() {
        return this.val;
    }
});

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

getWithoutSet

針對 { "getWithoutSet": true } 選項的不正確程式碼範例

/*eslint accessor-pairs: ["error", { "getWithoutSet": true }]*/

const u = {
    set a(value) {
        this.val = value;
    }
};

const v = {
    get a() {
        return this.val;
    }
};

const w = {d: 1};
Object.defineProperty(w, 'c', {
    set: function(value) {
        this.val = value;
    }
});

const x = {d: 1};
Object.defineProperty(x, 'c', {
    get: function() {
        return this.val;
    }
});
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27

針對 { "getWithoutSet": true } 選項的正確程式碼範例

/*eslint accessor-pairs: ["error", { "getWithoutSet": true }]*/
const y = {
    set a(value) {
        this.val = value;
    },
    get a() {
        return this.val;
    }
};

const z = {d: 1};
Object.defineProperty(z, 'c', {
    set: function(value) {
        this.val = value;
    },
    get: function() {
        return this.val;
    }
});

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

enforceForClassMembers

當 enforceForClassMembers 設定為 true（預設）時

• "getWithoutSet": true 也會警告類別中 getter 沒有 setter。
• "setWithoutGet": true 也會警告類別中 setter 沒有 getter。

針對 { "getWithoutSet": true, "enforceForClassMembers": true } 的不正確程式碼範例

/*eslint accessor-pairs: ["error", { "getWithoutSet": true, "enforceForClassMembers": true }]*/

class Foo {
    get a() {
        return this.val;
    }
}

class Bar {
    static get a() {
        return this.val;
    }
}

const Baz = class {
    get a() {
        return this.val;
    }
    static set a(value) {
        this.val = value;
    }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

針對 { "setWithoutGet": true, "enforceForClassMembers": true } 的不正確程式碼範例

/*eslint accessor-pairs: ["error", { "setWithoutGet": true, "enforceForClassMembers": true }]*/

class Foo {
    set a(value) {
        this.val = value;
    }
}

const Bar = class {
    static set a(value) {
        this.val = value;
    }
}
1
2
3
4
5
6
7
8
9
10
11
12
13

當 enforceForClassMembers 設定為 false 時，此規則會忽略類別。

針對 { "getWithoutSet": true, "setWithoutGet": true, "enforceForClassMembers": false } 的正確程式碼範例

/*eslint accessor-pairs: ["error", {
    "getWithoutSet": true, "setWithoutGet": true, "enforceForClassMembers": false
}]*/

class Foo {
    get a() {
        return this.val;
    }
}

class Bar {
    static set a(value) {
        this.val = value;
    }
}

const Baz = class {
    static get a() {
        return this.val;
    }
}

const Quux = class {
    set a(value) {
        this.val = value;
    }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27

已知限制

由於靜態分析的限制，此規則不考慮可能的副作用，並且在某些情況下，對於具有計算鍵的 getter/setter 可能不會報告缺少配對，如下例所示

/*eslint accessor-pairs: "error"*/

const z = 1;

// no warnings
const a = {
    get [z++]() {
        return this.val;
    },
    set [z++](value) {
        this.val = value;
    }
};
1
2
3
4
5
6
7
8
9
10
11
12
13

此外，此規則不禁止物件實字和類別定義中的重複鍵，並且在某些具有重複鍵的情況下，對於 getter/setter 可能不會報告缺少配對，如下例所示

/*eslint accessor-pairs: "error"*/

// no warnings
const b = {
    get a() {
        return this.val;
    },
    a: 1,
    set a(value) {
        this.val = value;
    }
};
1
2
3
4
5
6
7
8
9
10
11
12

上面的程式碼建立了一個物件，其中只有屬性 "a" 的 setter。

如果您也想禁止物件實字中的重複鍵，請參閱 no-dupe-keys。

如果您也想禁止類別定義中的重複名稱，請參閱 no-dupe-class-members。

何時不該使用

如果您不關心物件上 setter 和 getter 的同時存在，則可以關閉此規則。

相關規則

• no-dupe-keys
• no-dupe-class-members

版本

此規則在 ESLint v0.22.0 中引入。

延伸閱讀

setter - JavaScript | MDN
developer.mozilla.org

getter - JavaScript | MDN
developer.mozilla.org

使用物件 - JavaScript | MDN
developer.mozilla.org

資源

• 規則來源
• 測試來源