10 Nisan 2020 Cuma

Javascript Export Import Problemi

Bu yazıda çok basit bir hatadan bahsedeceğim, ilk gördüğünüzde eh bunu da yapmaz bir insan diyebiliriz fakat böyle hatalar başımıza gelebiliyor.

Yapılan hatayı direkt göstererek başlayalım:



helper altındaki javascript dosyasında model import ediliyor, model altındaki javascript dosyasında da helper import ediliyor. Runtime kaynaklı bir define problemi ortaya çıkıyor. Kodları da şöyle göstereyim:



Soldaki kodlar helper altındaki js dosyamız, sağdaki de model altında js dosyamız. Koddaki amaç helperda genel bir functionım olsun myPrint() ve her yerde kullanayım. myPrint() console.log'dan farkı da benim modellerıma göre davranış sergilesin. O yüzden de User Model'ını import ediyor. Buraya kadar bir sıkıntı yok aslında böyle düşünebiliriz. Asıl sorun model içerisine helperdan herhangi bir şey import etme düşüncesi.

Burada tabi birazcık tembel bir düşünce var fakat probleme örnek olması açısından böyle bir şey aklıma geldi. Classa ait function olan showUserValues() functionında bir daha print yazmayayım, zaten helperda buna uygun kod var direkt onu çağırayım düşüncesi var.

Bu görünen yapı birbirinden herhangi bir şeyi import etme durumu kesinlikle hatalı bir şey.



Model altındaki dosyamızı çalıştırdığımızda böyle bir hata ortaya çıkıyor. Tabi öncesinde helper/index.js 11. satırı yorum haline getirdim new User() kodundan patlamasın diye.

Hataya bakacak olursak console.log()'lardan anlayacağımız gibi ilk başta import edilen dosya çalışıyor. Yani helper, çalıştıktan sonra helper'ın export edilen myPrint function'ını alabiliyoruz. Helper altındaki javascript dosyamızın ilk satırı da yine bir import işlemi, ve import edilmesi için model'ın tamamen çalışması gerek ama çalışırsa ne olur ? Bu sefer de modelın ilk satırında helper'ın import edilişi var onun da tamamen çalışması gerekecek, tekrar helper tamamen çalışması gerekirken, ilk satırda model'dan bir import olacak ve bu şekilde bir sonsuz döngü oluşacak. Muhtemelen bu sonsuz döngü oluşmaması için böyle bir yapı düşünmüşler. Yani base dosyadan import edilen module dosyasında import edilen base dosyası varsa base dosyasını tekrardan çalıştırmıyorlar. Onun yerine boş object atanmış görüldüğü gibi User için. User'ın boş object olarak atanması da hataya neden oluyor.

Hatta simüle edersek aşağıdaki gibi:



myPrint içerisinde User kullanmasaydık evet böyle bir hata almayacaktık ve iki taraf da birbirini import ettiği için yolumuza bakabilecektik ama söz konusu hata er ya da geç başımıza gelecekti neden ? import edilen User elbet helper içinde bir yerde kullanılacaktı ve başka bir dosyada User kullanılan helper functionı ve model import edildiğinde User boş object olacaktı ya da import sırasına göre belki de modelda import edilen ne ise o boş object olacaktı. Bu hata er ya da geç karşımıza çıkardı.

Böyle basit bir hatayı nasıl yapabiliriz ???


Evet böyle bir hatayı yapmayız diye düşünebilriz ama proje yapısı büyüdüğünde ve ihtiyacımız olan functionların kompleks durumları o function için birden fazla moduleden import durumu oluşturabilir tek bir function olarak da düşünmeyelim, proje yapısı büyüdü helper içinde function kümeniz var ve genel bir function olarak düşündüğünüz ama bağımlı bir function bile sizi bu duruma sokabilir.

Bu hata umarım aklınızdan çıkmaz çok kolay bir şekilde karşılaşılabilecek bir durum ve bu durumun farkında bile olmayabiliriz. Javascriptte bazen hata çözmek zordur :V

Okuduğunuz için teşekkür ederim. Kalın sağlıcakla :)

Man is made for error; it enters his mind naturally, and he discovers a few truths only with the greatest effort.

- Frederick the Great

0 yorum:

Yorum Gönder