JavaScript - İşlevler

Bir işlev, programınızın herhangi bir yerinde çağrılabilen yeniden kullanılabilir bir kod grubudur. Bu, aynı kodu tekrar tekrar yazma ihtiyacını ortadan kaldırır. Programcılara modüler kodlar yazmada yardımcı olur. İşlevler, bir programcının büyük bir programı birkaç küçük ve yönetilebilir işleve bölmesine izin verir.

Diğer gelişmiş programlama dilleri gibi, JavaScript de işlevleri kullanarak modüler kod yazmak için gerekli tüm özellikleri destekler. Gibi işlevleri görmüş olmalısınalert() ve write()önceki bölümlerde. Bu işlevleri defalarca kullanıyorduk, ancak bunlar çekirdek JavaScript'te yalnızca bir kez yazılmıştır.

JavaScript, kendi işlevlerimizi de yazmamıza izin verir. Bu bölümde kendi işlevlerinizi JavaScript'te nasıl yazacağınız açıklanmaktadır.

İşlev Tanımı

Bir işlevi kullanmadan önce onu tanımlamamız gerekir. JavaScript'te bir işlevi tanımlamanın en yaygın yolu,function anahtar sözcük, ardından benzersiz bir işlev adı, bir parametre listesi (boş olabilir) ve küme parantezleri ile çevrili bir ifade bloğu gelir.

Sözdizimi

Temel sözdizimi burada gösterilmektedir.

<script type = "text/javascript">
   <!--
      function functionname(parameter-list) {
         statements
      }
   //-->
</script>

Misal

Aşağıdaki örneği deneyin. SayHello adında parametre almayan bir işlevi tanımlar -

<script type = "text/javascript">
   <!--
      function sayHello() {
         alert("Hello there");
      }
   //-->
</script>

Bir Fonksiyon Çağırma

Komut dosyasında daha sonra bir yerde bir işlevi çağırmak için, aşağıdaki kodda gösterildiği gibi bu işlevin adını yazmanız yeterlidir.

<html>
   <head>   
      <script type = "text/javascript">
         function sayHello() {
            document.write ("Hello there!");
         }
      </script>
      
   </head>
   
   <body>
      <p>Click the following button to call the function</p>      
      <form>
         <input type = "button" onclick = "sayHello()" value = "Say Hello">
      </form>      
      <p>Use different text in write method and then try...</p>
   </body>
</html>

Çıktı

Fonksiyon Parametreleri

Şimdiye kadar parametresiz fonksiyonlar gördük. Ancak bir işlevi çağırırken farklı parametreleri iletme olanağı vardır. Aktarılan bu parametreler işlevin içinde yakalanabilir ve bu parametreler üzerinde herhangi bir işlem yapılabilir. Bir işlev, virgülle ayrılmış birden çok parametre alabilir.

Misal

Aşağıdaki örneği deneyin. Biz değiştirdiksayHelloburada işlev. Şimdi iki parametre alıyor.

<html>
   <head>   
      <script type = "text/javascript">
         function sayHello(name, age) {
            document.write (name + " is " + age + " years old.");
         }
      </script>      
   </head>
   
   <body>
      <p>Click the following button to call the function</p>      
      <form>
         <input type = "button" onclick = "sayHello('Zara', 7)" value = "Say Hello">
      </form>      
      <p>Use different parameters inside the function and then try...</p>
   </body>
</html>

Çıktı

Dönüş Bildirimi

Bir JavaScript işlevi isteğe bağlı olabilir returnBeyan. Bir işlevden bir değer döndürmek istiyorsanız bu gereklidir. Bu ifade, bir fonksiyondaki son ifade olmalıdır.

Örneğin, bir işlevde iki sayı iletebilir ve ardından işlevin çağıran programınızda bunların çarpımını döndürmesini bekleyebilirsiniz.

Misal

Aşağıdaki örneği deneyin. Çağıran programda sonucu döndürmeden önce iki parametre alan ve bunları birleştiren bir işlevi tanımlar.

<html>
   <head>  
      <script type = "text/javascript">
         function concatenate(first, last) {
            var full;
            full = first + last;
            return full;
         }
         function secondFunction() {
            var result;
            result = concatenate('Zara', 'Ali');
            document.write (result );
         }
      </script>      
   </head>
   
   <body>
      <p>Click the following button to call the function</p>      
      <form>
         <input type = "button" onclick = "secondFunction()" value = "Call Function">
      </form>      
      <p>Use different parameters inside the function and then try...</p>  
  </body>
</html>

Çıktı

JavaScript işlevleri hakkında öğrenilecek çok şey var, ancak bu eğitimde en önemli kavramları ele aldık.

JavaScript İç İçe İşlevler
JavaScript Fonksiyonu () Yapıcı
JavaScript İşlev Değişmezleri