Dikdörtgenin alan ve çevresini hesaplamak için Javascript ile basit bir fonksiyon oluşturabiliriz. Bu hesaplamalar, özellikle geometrik şekillerle çalışırken veya grafiksel uygulamalarda oldukça önemlidir.

Dikdörtgenin Alan ve Çevre Hesaplama Mantığı

Bir dikdörtgenin alanını ve çevresini hesaplamak için basit formüller kullanılır:

• Alan: Uzun Kenar x Kısa Kenar
• Çevre: 2 x (Uzun Kenar + Kısa Kenar)

Aşağıda, Javascript kullanarak bu işlemleri gerçekleştiren bir örnek kod görebilirsiniz.

HTML

<label for="uzunKenar">Uzun Kenar:</label>
<input type="number" id="uzunKenar" placeholder="Uzun kenarı girin">

<label for="kisaKenar">Kısa Kenar:</label>
<input type="number" id="kisaKenar" placeholder="Kısa kenarı girin">

<button onclick="hesapla()">Hesapla</button>

<h2>Sonuçlar</h2>
<p id="alanSonucu">Dikdörtgenin Alanı: </p>
<p id="cevreSonucu">Dikdörtgenin Çevresi: </p>

JavaScript

function dikdortgenAlan(uzunKenar, kisaKenar) {
	return uzunKenar * kisaKenar;
}

function dikdortgenCevre(uzunKenar, kisaKenar) {
	return 2 * (uzunKenar + kisaKenar);
}

function hesapla() {
	const uzunKenar = parseFloat(document.getElementById('uzunKenar').value);
	const kisaKenar = parseFloat(document.getElementById('kisaKenar').value);

	if (isNaN(uzunKenar) || isNaN(kisaKenar)) {
		alert("Lütfen her iki kenar uzunluğunu da girin.");
		return;
	}

	const alan = dikdortgenAlan(uzunKenar, kisaKenar);
	const cevre = dikdortgenCevre(uzunKenar, kisaKenar);

	document.getElementById('alanSonucu').innerText = "Dikdörtgenin Alanı: " + alan;
	document.getElementById('cevreSonucu').innerText = "Dikdörtgenin Çevresi: " + cevre;
}

Yukarıda paylaştığım kodların çalışan bir örneğini aşağıda ki bağlantıdan inceleyebilirsiniz.
https://codepen.io/Serdar-Karaca/pen/mdNKWVN

Yukarıda ki kodların açıklaması ;
HTML :

• input elemanları ile kullanıcıdan uzun ve kısa kenar bilgileri alınır.
• button ile “Hesapla” butonuna basıldığında Javascript ile hesaplama yapılır.

Javascript :

hesapla: Bu fonksiyon, input değerlerini alır, dikdortgenAlan ve dikdortgenCevre fonksiyonlarını çağırarak sonuçları ekranda gösterir.
dikdortgenAlan: Uzun ve kısa kenarı çarparak alanı döndürür.
dikdortgenCevre: 2 ile (uzunKenar + kisaKenar) toplamını çarparak çevreyi döndürür.