JavaScript ile Exel dosyası nasıl okunur?

JavaScript ile Exel dosyası okumanın birden çok yöntemi olabilir. Fakat bilinmelidir ki JavaScript bu yazının yazıldığı tarihte maalesef ki doğrudan Exel dosyasını okuyamamaktadır. Exel dosyasını okumak için farklı bazı kütüphalere ihtiyaç duymaktayız. Bunlar `xlsx` ve `exceljs` gibi oldukça popüler olan bazı Exel okuma kütüphanleridir.

Biz bugünkü yazımızda `xlsx` kütüphanesini kullanarak nasıl tarayıcı ortamında Exel dosyasını okuyabiliriz bunu nasıl JSON veya JS nesnesi formatına dönüştürebiliriz sorusuna cevap arayacağız.

İlk olarak projemizin içerisine CDN linki üzerinden XLSX paketini alıyoruz.

<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.18.3/xlsx.full.min.js"></script>

Gerekli olan kütüphanemizi dahil ettiğimize göre artık işlemlere başlıyabiliriz. İlk olarak erişim sağlamak istediğimiz Exel dosyasına erişim sağlıyoruz.

   form.addEventListener('submit', (event) => {
      event.preventDefault();
      const formData = new FormData(event.target)
      let file = formData.get('file')
      console.log(file)
   })
/* Dosyayı nasıl seçtiğinizin bir önemi yok. 
İster aşağıdaki gibi form yapısının submit olayı ile isterse farklı bir şekilde erişim sağlayın. 
Eğer tarayıcının "console" alanında çıktı olarak şu yazım tarzını görebiliyorsanız 
"File {name: 'fdsafdsa.xlsx', lastModified: 1715168935544, lastModifiedDate: Wed May 08 2024 14:48:55 GMT+0300 (GMT+03:00), webkitRelativePath: '', size: 8472, …}" 
herhangi bir sıkıntı yok demektedir */

Dosyanızı binbir farklı şekilde erişim sağlayabilirsiniz. Önemli olan çıktının yukarıdaki gibi console.log() yapıldığında yukarıdaki şekilde çıktı vermesidir. Daha sonrasında ise işlemlerimize dosyayı "Binary" şeklinde okuyoruz. Dosya okunduğunda ise onload olayı gerçekleşmiş oluyor ve içerisindeki olayı "event" parametresi ile yakalıyoruz.

   form.addEventListener('submit', (event) => {
      event.preventDefault();
      const formData = new FormData(event.target)
      let file = formData.get('file')

      // JS'in dosya okuma yapısı
      let fileReader = new FileReader();
      fileReader.readAsBinaryString(data)

      // Dosya yüklendiğinde olayı yakalıyoruz.
      fileReader.onload = (event)=>{

         // Okunan değeri event.target.result içerisinden alıyoruz.
         let newData = event.target.result;

         // XLSX ile binary okuma işlemi yapıyoruz.
         let workbook = XLSX.read(newData, {type:"binary"});

         // Okunan değeri döngü ile istediğimiz formata getiriyoruz.
         workbook.SheetNames.forEach(sheet=>{
            let rowObject = XLSX.utils.sheet_to_row_object_array(workbook.Sheets[sheet]);
            console.log(rowObject)
            console.log(JSON.stringify(rowObject))
         })
      }

   })

Ve çıktı olarak ekrana basılan rowObject nesnesi bir bir JS nesnesi, bir altındaki JSON.stringify(rowObject) değeri ise bir JSON nesnesi olmuş olacaktır. Karmaşık gibi görüldüğüne bakmayın aslında oldukça basittir. Sadece yukarıdaki adımları dikkati bir şekilde gerçeleştirin.

JavaScript'te setInterval ve setTimeout Nedir?

JavaScript'te zamanlayıcı fonksiyonlar, belirli bir süre sonra bir işlevin yürütülmesini planlamak için kullanılır. İki temel zamanlayıcı fonksiyon vardır: setTimeout ve setInterval. Bu makalede, bu iki fonksiyonun ne işe yaradığını ve nasıl kullanıldığını öğreneceğiz.

- setTimeout fonksiyonu, belirli bir süre sonra bir işlevin bir kez çalıştırılmasını sağlar. Temel sözdizimi şu şekildedir:

setTimeout(function, gecikme);

Örnek Kullanım:

setTimeout(function() {
  console.log("3 saniye sonra bu mesaj görüntülenecek");
}, 3000);

- setInterval fonksiyonu, belirli aralıklarla bir i...

JavaScript'te filter()

JavaScript'te filter() yöntemi, bir dizinin belirli bir koşulu sağlayan öğelerini seçip yeni bir dizi oluşturmak için kullanılır. Bu yöntem, orijinal diziyi değiştirmeden bir alt dizi döndürür. Özellikle büyük veri setleriyle çalışırken, belirli kriterlere göre verileri ayıklamak için oldukça faydalıdır.

filter() Yönteminin Kullanımı:

filter() yöntemi, bir fonksiyon alır ve bu fonksiyon, dizinin her bir öğesi için çalıştırılır. Bu fonksiyonun döndürdüğü değer true ise, o öğe yeni diziye eklenir; false ise eklenmez. Örnek:

const numbers = [1, 2, 3, 4, 5, 6];

// Çift sayıları filtreleyelim
const evenNumbers = numbers.filter(function(number) {
    return number % 2 === 0;
});

cons...