JavaScript'te Değişken Çakışmaları

Bizim bir index.html HTML sayfamız olduğunu varsayalım, burada script etiketinin içinde str değişkenini oluşturuyor ve ekrana yazdırıyorsunuz:

<html>
	<head>
		<script>
			let str = 'script metni';
			alert(str); // 'script metni' yazacak
		</script>
	</head>
	<body>
		...
	</body>
</html>

Ayrıca script.js dosyamız olduğunu varsayalım, içinde ayrıca bir str değişkeni tanımlanmış:

let str = 'dosya metni';

Şimdi script.js dosyamızın index.html sayfasına şu şekilde bağlandığını varsayalım:

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

str değişkeni hem index.html dosyasında hem de script.js dosyasında olduğu için, bir çakışma olacak ve bu çakışmada aşağıda yazılan değişken, yani script.js dosyasındaki değişken kazanacaktır. Yani kodumuz beklediğimiz gibi 'script metni' yerine 'dosya metni' yazacaktır.

Aslında sorun çok ciddi. Gerçek bir sitede çoğu zaman kendi komut dosyalarınızla birlikte birkaç dosyanız olacak, ayrıca bazı üçüncü taraf eklentileri de bağlayacaksınız. Bu durumda, bir dosyanın değişkenleri ve fonksiyonları başka bir dosyanın değişken ve fonksiyonlarıyla çakışabilir.