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>