JavaScript-те сілтемеге өтуге тыйым салу қатесі

Бізде сілтеме болсын:

<a href="">link</a>

Сілтемені айнымалыға алайық:

let link = document.querySelector('a');

Сілтемеге басу үшін оқшаулағышты байланыстырайық. Бетті қайта жүктеуден аулақ болу үшін сілтеме бойынша өтуді болдырмайық:

link.addEventListener('click', function(event) {
	console.log(this.textContent);
	event.preventDefault();
});

Біз өзімізді күтпеген әрекеттен толығымен қорғадық деп көрінеді. Шын мәнінде бұл олай емес. Синтаксистік қате пайда болған кезде JavaScript коды орындалмайды, сілтемені бұғаттау жұмыс істемейді және ол бойынша өту орындалады.

Бұл жағдайда біз кодты орындау нәтижесін де, консольдегі қатені де көрмейміз, өйткені бет қайта жүктеледі. Кодта қате жасап, іс жүзінде көз жеткізейік:

link.addEventListener('click', function(event) {
	thiss.textContent = 'text'; // синтаксистік қате
	event.preventDefault();
});

Мұндай мәселе ерекше белгіге ие: егер сілтемені басқан сәтте консольге қарасақ, біз бір сәтке консольдегі қызыл қатені көреміз, ол бірден жоғалып кетеді.

Әрине, біз қате мәтінін оқуға ұшырай алмаймыз, бұл оны іздеуді айтарлықтай қиындатады. Алайда, амал бар. href сілтемесіне решетка қою керек. Бұл жағдайда сілтеме бойынша өту болмайды және біз консольге шығарылған қатені көреміз:

<a href="#">link</a>