Imenuj anonimne funkcije
Imenovanje anonimnih funkcija je važan korak kako bismo izbegli zloglasni callback pakao. Evo jednog primera zbrkanog koda, kojim se iz browsera šalje http
zahtev serveru:
document.querySelector('form').onsubmit = function (submitEvent) {
var name = document.querySelector('input').value
request({
uri: 'http://example.com/upload',
body: name,
method: 'POST'
}, function (err, response, body) {
var statusMessage = document.querySelector('.status')
if (err) return statusMessage.value = err
statusMessage.value = body
})
}
U gornjem kodu postoje dve anonimne funkcije. Hajde da ih nazovemo formSubmit
i postResponse
:
document.querySelector('form').onsubmit = function formSubmit (submitEvent) {
var name = document.querySelector('input').value
request({
uri: 'http://example.com/upload',
body: name,
method: 'POST'
}, function postResponse (err, response, body) {
var statusMessage = document.querySelector('.status')
if (err) return statusMessage.value = err
statusMessage.value = body
})
}
Kao što vidite, imenovanje funkcija je lako i ima jasne prednosti:
- čini kod čitljivijim zahvaljujući opisnom nazivu funkcija
- omogućuje nam da pomerimo funkciju gde želimo
- ako dođe do greške prijaviće nam aktuelnu funkciju, umesto anonimne
Nakon imenovanja funkcija, možemo ih pomeriti. Sada naša skripta za slanje formulara izgleda ovako:
document.querySelector('form').onsubmit = formSubmit
function formSubmit (e) {
var name = document.querySelector('input').value
request({
uri: 'http://example.com/upload',
body: name,
method: 'POST'
}, postResponse)
}
function postResponse (err, response, body) {
var statusMessage = document.querySelector('.status')
if (err) return statusMessage.value = err
statusMessage.value = body
}
Imenovanje anonimnih funkcija je često korisno, ali ne uvek. Funkcije nekada treba da ostanu anonimne, a onda ih možemo prevesti u streličaste funkcije.
Gornji kod možemo dodatno refaktorisati imenovanjem anonimnog objekta, o čemu u narednom odeljku.