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 файлидаги ўзгарма ютadi. Яъни бизнинг код 'script text' эмас, балки 'file text' ни чиқаради, биз кутганимиздек бўлмайди.

Муаммо аслда жуда ҳалокатлидир. Реал веб-сайтда сизда, кўп ҳолларда, сизнинг скрипт файлларингиз бир нечта бўлади, бундан ташқари, сиз бирор томон плагинларни уларсиз. Бунда бир файлнинг ўзгарма ва функциялари бошқа файлнинг ўзгарма ва функциялари билан конфликтлаши мумкин.