#javascript #refactoring
Вопрос:
Как преломить код в javascript
const handleClick1 = () => {
axios.get("someurl.com")
.then((res) => {
console.log(JSON.stringify(res, null, 2));
----- execute something different
})
.catch((err) => console.log(err))
};
const handleClick2 = () => {
axios.get("someurl.com")
.then((res) => {
console.log(JSON.stringify(res, null, 2));
----- execute something different
})
.catch((err) => console.log(err))
};
const handleClick3 = () => {
axios.get("someurl.com")
.then((res) => {
console.log(JSON.stringify(res, null, 2));
----- execute something different
})
.catch((err) => console.log(err))
};
Я хочу создать функцию
const axios_related = (----- execute something different) => {
axios.get("someurl.com")
.then((res) => {
console.log(JSON.stringify(res, null, 2));
----- execute something different
})
.catch((err) => console.log(err))
};
}
и заменить как
const handleClick1 = () => {
----- execute something different {
-- step1
-- step2
-- step3
---
-- stepn
}
axios_related(----- execute something different );
};
const handleClick2 = () => {
----- execute something different {
-- step1
-- step2
-- step3
---
-- stepn
}
axios_related(----- execute something different );
};
const handleClick3 = () => {
----- execute something different {
-- step1
-- step2
-- step3
---
-- stepn
}
axios_related(----- execute something different );
};
Ответ №1:
Создайте функцию более высокого порядка, которая принимает обратный вызов и вызывает ее внутри .then
.
const makeHandleClick = (callback) => {
axios.get("someurl.com")
.then((res) => {
console.log(JSON.stringify(res, null, 2));
callback(res);
})
.catch((err) => console.log(err))
};
const handleClick1 = makeHandleClick(callback1);
const handleClick2 = makeHandleClick(callback2);
const handleClick3 = makeHandleClick(callback3);
Комментарии:
1. так что это похоже на три слоя, например. 1 — щелчок по кнопке более высокого порядка, 2 — обратный вызов1, 3 — Щелчок по кнопке1