如何在定义之前修复esint错误

Question

我使用的是Airbnb的风格指南，有几个函数相互引用，无论哪个函数高于另一个，都会触发此错误。除了禁用这个错误之外，还有什么最佳实践可以修复这个错误吗？

function foo() {
const ham = document.querySelector('#ham');
ham.onclick = () => {
bar();
};
}
function bar() {
const spam = document.querySelector('#spam');
spam.onclick = () => {
foo();
};
}

Answer 1

您可能只需要禁用第一个函数，因为您的用例也很流行：

function foo() {
const ham = document.querySelector('#ham');
ham.onclick = () => {
/* eslint-disable no-use-before-define */
bar();
};
}

或者，您可以将它们封装在一个文字对象中以解决问题：

const wrapper = {
foo() {
const ham = document.querySelector<HTMLDivElement>('#ham');
ham.onclick = () => {
wrapper.bar();
};
},
bar() {
const spam = document.querySelector<HTMLDivElement>('#spam');
spam.onclick = () => {
wrapper.foo();
};
}
};