accessor-pairs

在物件和類別中強制使用 getter 和 setter 配對

在 JavaScript 中，一個常見的錯誤是建立一個物件，其中僅為屬性定義了 setter，但從未定義對應的 getter。如果沒有 getter，您將無法讀取該屬性，因此最終不會被使用。

以下是一些範例

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


// Good
var o = {
    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 會針對沒有 getter 的 setter 發出警告（預設值為 true）。
• getWithoutSet 設定為 true 會針對沒有 setter 的 getter 發出警告（預設值為 false）。
• enforceForClassMembers 設定為 true 會額外將此規則應用於類別的 getter/setter（預設值為 true）。如果您希望此規則忽略類別宣告和類別表達式，請將 enforceForClassMembers 設定為 false。

setWithoutGet

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

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

var o = {
    set a(value) {
        this.val = value;
    }
};


var o = {d: 1};
Object.defineProperty(o, '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"*/

var o = {
    set a(value) {
        this.val = value;
    },
    get a() {
        return this.val;
    }
};

var o = {d: 1};
Object.defineProperty(o, '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 }]*/

var o = {
    set a(value) {
        this.val = value;
    }
};

var o = {
    get a() {
        return this.val;
    }
};

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

var o = {d: 1};
Object.defineProperty(o, '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 }]*/
var o = {
    set a(value) {
        this.val = value;
    },
    get a() {
        return this.val;
    }
};

var o = {d: 1};
Object.defineProperty(o, '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 也會針對類別中沒有 setter 的 getter 發出警告。
• "setWithoutGet": true 也會針對類別中沒有 getter 的 setter 發出警告。

針對 { "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"*/

var a = 1;

// no warnings
var o = {
    get [a++]() {
        return this.val;
    },
    set [a++](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
var o = {
    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

資源

• 規則來源
• 測試來源