JavaScript හි විචල්ය ගැටුම්

අප සතුව index.html යන HTML පිටුවක් ඇති බව සිතමු, එහි script ටැගය තුළ ඔබ str යන විචල්යය නිර්මාණය කර එය තිරය මත ප්‍රදර්ශනය කරයි:

<html>
	<head>
		<script>
			let str = 'script text';
			alert(str); // 'script text' ප්‍රදර්ශනය කරයි
		</script>
	</head>
	<body>
		...
	</body>
</html>

අප සතුව script.js යන ගොනුවක් ද ඇති බව සිතමු, එහි ද str යන විචල්යය අර්ථ දක්වා ඇත:

let str = 'file text';

දැන් අපගේ script.js ගොනුව index.html පිටුවට පහත පරිදි සම්බන්ධ කර ඇති බව සිතමු:

<html>
	<head>
		<script>
			let str = 'script text';
		</script>
		<script src="script.js"></script>
		<script>
			alert(str);
		</script>
	</head>
	<body>
		...
	</body>
</html>

str යන විචල්යය index.html ගොනුවේත්, script.js ගොනුවේත් ඇති බැවින්, ගැටුමක් ඇති වනු ඇත, එහිදී පහළින් ලියා ඇති විචල්යය, එනම් script.js ගොනුවේ ඇති විචල්යය ජයග්‍රහණය කරයි. එනම් අපේ කේතය අප අපේක්ෂා කරන පරිදි 'script text' නොව 'file text' ප්‍රදර්ශනය කරයි.

ප්‍රශ්නය ඇත්ත වශයෙන්ම ඉතා බරපතල ය. සැබෑ වෙබ් අඩවියක ඔබට බොහෝ විට ඔබේම ස්ක්‍රිප්ට් සමඟ ගොනු කිහිපයක් ඇත, ඊට අමතරව, ඔබ යම් තෙවන පාර්ශ්ව ප්ලගින යම් ආකාරයකින් සම්බන්ධ කරනු ඇත. මෙම අවස්ථාවේ දී එක් ගොනුවක විචල්ය හා ශ්‍රිත වෙනත් ගොනුවක විචල්ය හා ශ්‍රිත සමඟ ගැටෙනු ඇත.