içinde

JavaScript Nasıl Çalışır? Nasıl Basit Bir Hesap Makinesi Yapabiliriz?

JavaScript Nasıl Çalışır ve Basit Bir Hesap Makinesi Yapacağınızı Öğretiyorum

javascript
javascript

JavaScript bir yazılım dilidir. JavaScript, istemci taraflı bir kod yazma dilidir. Bunun meali ise, yazdığınız kodların internet tarayacısı içinde çalıştığı anlamına gelir. JacaScript’in çalışma mantığı biraz gariptir. Bir Web sayfasında JavaScript kodları kullanırsanız, tarayıcı sayfayı yüklediğinde, tarayıcının sayfada bulduğu JavaScript kodlarını okuyan ve çalıştıran yerleşik yorumlayıcılar bulunur.

Javascript

Web sayfası tasarlayan insanlar JavaScript’i çok fazla amaçla kullanır. En yaygın olanlardan biri, bir formda alan doğrulaması yapmaktır. Girdiğimiz çoğu web sitesinde formlar görürüz. Bunlar kullanıcılardan bilgi toplanmasını sağlar. JavaScript bu girilen bilgilerin doğrulanmasında yardımcı olabilir. Örnek verecek olursak bir site sizden yaşınızı istediğinde ve siz öylesine bir sayı girmeye çalıştığınızda “örnek olarak:18621” JavaScript burada girilecek yaş aralığını kısıtlayabilir.

Web tasarımcılarının JavaScript ile yapabileceği bir başka şey ise hesap makinesidir. İşte size birkaç hesap makinesi örneği:

  • RPN calculator
  • MegaConverter – Hesap makinelerinin yapabileceği işlevlerin tamamı burada.
  • Personal Finance calculators

İşte size internet sitesi yaparken kullanabileceğiniz Fahrenheit’dan Santigrat’a dönüştürmenizi sağlayan basit bir JavaScript kodu:

<html>

<head>

<script language=”JavaScript”>

<!– hide this script from old browsers

function temp(form)

{

var f = parseFloat(form.DegF.value, 10);

var c = 0;

c = (f – 32.0) * 5.0 / 9.0;

form.DegC.value = c;

}

// done hiding from old browsers –>

</script>

</head>

<body>

<FORM>

<h2>Fahrenheit to Celsius Converter</h2>

Enter a temperature in degrees F:

<INPUT NAME=”DegF” VALUE=”0″ MAXLENGTH=”15″ SIZE=15>

<p>

Click this button to calculate the temperature

in degrees C:

<INPUT NAME=”calc” VALUE=”Calculate” TYPE=BUTTON

onClick=temp(this.form)>

<p>

Temperature in degrees C is:

<INPUT NAME=”DegC” READONLY SIZE=15>

</FORM>

</body>

</html>

Eğer daha önce html öğrenmeye çalıştıysanız bu kodlar size tanıdık gelir. Fakat bilmeyenler için açıklama yapmak gerekirse web sitelerinin en temel yapıları aşağıya yazacağım kodlardır. Biz bu kodlar arasında işlem yaparız. En azından HTML’de.

<html>

<head>

</head>

<body>

</body>

</html>

Başlıkta bahsettiğim gibi dönüştürücü olan kodu ise buraya atıyorum:

<head>

<script>

<!– hide this script from old browsers

function temp(form)

{

var f = parseFloat(form.DegF.value, 10);

var c = 0;

c = (f – 32.0) * 5.0 / 9.0;

form.DegC.value = c;

}

<!– done hiding from old browsers –>

</script>

</head>

Tabii ki de böyle kodları atıp işin içinden sıyrılmayacağın. Dilimin döndüğünce neyin ne olduğunu açıklayacağım.

Javascript

Buradaki kullandığım temp fonksiyonu, celcius sıcaklığını hesaplamak için gerekli JavaScript kodlarını içerir. Web sitesini açtığımız zaman karşımıza çıkan işlemleri gösteren sayfanın –bir diğer deyişle front-end-kodları ise şöyledir:

<FORM>

<h2>Fahrenheit to Celsius Converter</h2>

Enter a temperature in degrees F:

<INPUT NAME=”DegF” VALUE=”0″ MAXLENGTH=”15″ SIZE=15>

<p>

Click this button to calculate the temperature

in degrees C:

<INPUT NAME=”calc” VALUE=”Calculate” TYPE=BUTTON

onClick=temp(this.form)>

<p>

Temperature in degrees C is:

<INPUT NAME=”DegC” READONLY SIZE=15>

</FORM>

Buradaki kilit nokta şu kod:

<INPUT NAME=”calc” VALUE=”Calculate” TYPE=BUTTON

onClick=temp(this.form)>

Bu bir düğme yaratmanızı sağlar. Kullanıcı bu düğmeye bastığında sayfanın başındaki fonksiyonu çağırır.

Programlama dillerinde biraz mesafe kat ettiyseniz JavaScript öğrenmeye çalışmanızda sıkıntı yoktur. JavaScript ortalama zorlukta bir dildir. Eğer zaten programlamadan anlıyorsanız kodları nasıl yazacağınızı öğrenmek çok da zor bir şey değildir. Programlamada yeniyseniz JavaScript başlamak için çok uygun bir değildir. Eğer kendinizi geliştirmek isterseniz ise bu örnek kodu değiştirmek ve başka hesap makineleri yapmak olabilir.

Daha detaylı bilgi için buralara bakabilirsiniz:

Meriç ÇAPAR


Bunlar da ilginizi çekebilir

C Programlama Dili Öğrenmek Size Nasıl Fayda Sağlayacak?

Her Web Geliştiricisinin 2021’de Sahip Olması Gereken 15 VSCode Uzantısı

Hayatımızdan Çıkmayacak 5 Programlama Dili

Python Nedir, Ne Değildir? Python Nasıl Çalışır?

Bir cevap yazın

E-posta hesabınız yayımlanmayacak.

GIPHY App Key not set. Please check settings

Bir gelgit cüce gökada (mavi) ve bir sarmal gökada (gri tonlamalı). Samanyolu, sarmal bir galaksi örneğidir.

Yeni Galaksi Yıldızların Nasıl Oluştuğuna Işık Tutuyor

Anaximander

Anaximander Kimdir? Bilime Katkıları