JavaScript හි මූලද්රව්යයක් ලබා ගැනීමේ දෝෂය
සමහර විට ආරම්භක ක්රමලේඛකයින් වරදක් කරන්නේ,
තනි DOM මූලද්රව්යයක් ලබා ගැනීම සඳහා
querySelector ක්රමය වෙනුවට
querySelectorAll ක්රමය භාවිතා කිරීමයි.
මෙම දෝෂයේ ලක්ෂණාත්මක විශේෂාංග බලමු. යම් ඡේදයක් ඇතැයි සිතමු:
<p>text</p>
යම් ක්රමලේඛකයෙක් මෙම ඡේදයේ පෙළ ලබාගෙන වෙනස් කිරීමට තීරණය කළේය. මේ සඳහා ඔහු මෙම මූලද්රව්යයට යොමුවක් විචල්යයකට ලබා ගත්තේ, වැරදි ක්රමයක් භාවිතා කරමින්:
let elem = document.querySelectorAll('p');
ඉන්පසු ක්රමලේඛකයා ඡේදයේ පෙළ වෙනස් කිරීමට උත්සාහ කළේය. කෙසේ වෙතත්, ඡේදයේ පෙළ වෙනස් වුණේ නැත:
elem.textContent = '!!!'; // ක්රියාත්මක වූයේ නැත
මේ සමඟම කොන්සෝලයේ කිසිදු දෝෂයක් දිස් වුණේ නැත. හේතුව නම්, වලංගු මෙහෙයුමක් සිදු කරනු ලැබුවද එය තනි මූලද්රව්යයක් මත නොව කණ්ඩායමක් මත වීමයි. මූලද්රව්ය කණ්ඩායමක පෙළ කියවීම හෝ වෙනස් කිරීම සරලව කළ නොහැක - ඒවා ලූපයකින් පිරික්සා එක් එක් මූලද්රව්ය වෙන වෙනම වෙත යොමු විය යුතුය.
දෝෂය හඳුනා ගන්නේ කෙසේද
මෙම දෝෂය හඳුනා ගැනීමට ක්රමලේඛකයෙක් කෙසේ ක්රියා කළ යුතුදැයි බලමු. සත්යය වන්නේ, යම් අත්දැකීමක් ඇතිව, එය ලක්ෂණාත්මක සලකුණු මගින් හඳුනා ගැනීම පහසු බවයි.
කෙසේ වෙතත්, එය සිදු නොවූවා යැයි සිතමු.
දෝෂ සෙවීමේදී ක්රමලේඛකයාගේ පළමු ක්රියාව
විචල්යවල අගයන් කොන්සෝලයට ප්රතිදානය කිරීම විය යුතුය.
ඔහුගේ අවස්ථාවේ ඇත්තේ එක්
විචල්යයක් පමණි - elem.
මෙම විචල්යයේ අගය ප්රතිදානය කර
එහි ඇත්තේ කුමක්දැයි බැලීම අවශ්යය:
let elem = document.querySelectorAll('p');
console.log(elem); // තනි මූලද්රව්යයක් නොව අරාවක් ප්රතිදානය කරයි
කොන්සෝලයේ වහාම දැකගත හැකි වන්නේ, විචල්යයේ තනි මූලද්රව්යයක් නොව අරාවක් ඇති බවයි. මෙය වහාම පැහැදිලි ඉඟියක් ලබා දෙන්නේ මූලද්රව්යය ලබා ගැනීමේ ක්රමයේ දෝෂයක් සිදු වී ඇති බවයි.