Javascript Dersleri

Javascript’te Anlık Toplama İşlemi Yapma

Anlık işlem yapmadaki kastım aslında setInterval(); ile belirlenen fonksiyonu ya da ifadeyi belirli aralıklar ile çalıştırılmasını kastediyorum. Belirlenen aralıklar ile çalıştırılan fonksiyonlar, o fonksiyonunu özelliğine göre işlemlerin tekrarlanmasını sağlayacaktır. Böylelikle anlık bir işlem söz konusu olacaktır.

Bu anlık işlem döngüsünü basit bir yoldan anlatabilmek amacı ile bir matematiksel işlem yaparak sonucun nasıl döndüğünü göreceğiz. Bunun için öncelikle 2 adet verinin geldiği input alanı oluşturuyoruz. Bu inputlardan alınan değeri ise; 3. Bir input oluşturarak onun value değerine işliyoruz.

Sayı 1 : <input id="sayi1" name="sayi1" type="text" />
Sayı 2 : <input id="sayi2" name="sayi2" type="text" />
Sonuç : <input id="sonuc" name="sonuc" type="text" />

Burada dikkat edilmesi gerekilen nokta ise inputlarda yer alan id etiketidir. Bu etiketi kullanarak input içinde yer alan değeri javascript ile almamızı sağlayacaktır. Böylelikle işlemlerimizi gerçekleştirmiş olacağız.

Şimdi gel gelelim javascript kodlarının nasıl olacağına. İlk önce sayı1 ve sayı2 idlerinde yer alan değerleri alalım.

var sayi1 = document.getElementById("sayi1").value; // 1. Sayıyı Aldım
var sayi2 = document.getElementById("sayi2").value; // 2. Sayıyı Aldım

Burada yer alan getElementById ifadesi içerisinde yer alan id değeriyle bir işlem yapılmasını sağlamaktadır. Burada oluşturduğumuz inputların id değerlerini yazıyoruz. Sonrasında yer alan value ile inputların içerisinde yer alan değerleri alıyoruz.

İnputlardan gelen değerleri aldıktan sonra önceden küçük bir if else yapısı ile boş veri ve dolu veri algılamasını yaparak duruma göre işlem yapmayı sağlıyoruz. Koşuldan gelen durumda eğer input değerleri boş ise şu işlemi yap dedik;

document.getElementById("sonuc").value= parseInt(sayi1) + parseInt(sayi2);

Bu kodda ise dikkat edilmesi gerekilen nokta parseInt(); tir. Buradaki belirtme gelen verilerin integer(tam sayı) olduğunu belirtiyoruz. Böylelikle toplama işleminin yapılmasını sağlıyoruz.

Yukarıdaki işlemleri yaptıktan sonra fonksiyonumuz hazır bir hal alacaktır. Burada oluşturulan fonksiyonun çalışması ve anlık olarak işlem yapılmasını sağlamak için makalenin başında da belirttiğim gibi setInterval(); ifadesini kullanacağız.

setInterval("toplam()", 100);

setInterval(); içerisine 2 adet argüman almaktadır. İlki çalıştırılacak/işlem görecek olan fonksiyonun belirlendiği alandır. İkincisi ise hangi aralıklar ile çalıştırılacağının tanımlandığı alandır. Burada yer alan aralık tanımlaması 1 saniye = 1000 değeri üzerinden bir işlem görmektedir. Örnekte 100 değeri kullanılmaktadır. Buda saniyenin 10 katı kadar hızlı çalıştığını anlatmaktadır. Yani 1 saniyede toplam(); fonksiyonu 10 kez çalışmaktadır.

Sonuç Olarak

Bu ders aslında temel olarak setInterval(); üzerine kuruludur. setInterval(); Kullanarak fonksiyonların nasıl yönetildiğini anlatmaya çalıştım. Bunu anlatırken de getElementById ve value ‘nin nasıl kullanıldığını da görmüş oluyoruz.

Daha Fazla Göster

İlgili Makaleler

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Kapalı