Załaduj lokalny plik JSON do zmiennej

Załaduj lokalny plik JSON do zmiennej
Podczas programowania w JavaScript mogą istnieć pewne przypadki, w których programista musi zintegrować wiele funkcji, aby dodać im znaczenia. Pomaga to w powiązaniu zaimplementowanych funkcji lub przechowywaniu danych masowych. W takich scenariuszach załadowanie lokalnego pliku JSON do zmiennej jest bardzo pomocne w wyróżnianiu witryny.

Ten blog omówi podejścia do załadowania lokalnego pliku JSON do zmiennej.

Jak załadować lokalny plik JSON do zmiennej?

Aby załadować lokalny plik JSON do zmiennej, zastosuj następujące podejścia:

  • "aportować()" I "Następnie()”Metody.
  • "wymagać”Moduł.

Załaduj lokalny plik JSON do zmiennej przy użyciu metod „Fetch” i „następnie ()”

„„aportować()„Metoda pobiera zasób z serwera i„Następnie()„Metoda zwraca obietnicę, biorąc dwa argumenty, tj.mi., Funkcja wywołania zwrotnego w przypadku sukcesu i niepowodzenia obiecującego obietnicy. Te podejścia można zastosować do pobierania pliku JSON, dostępu do jego danych i zwrócenia go.

Składnia

Następnie (spełnione, odrzucone)

W powyższej składni:

  • "spełniony”Odnosi się do spełnionej obietnicy.
  • "odrzucony”Odpowiada odrzuconej obietnicy.
Fetch (zasób)

W powyższej składni „ratunek”Wskazuje na konkretny zasób, aby pobrać.

Przykład

Przejrzyjmy następujące dane pliku JSON:

"Pracownicy":[

„Nazwa”: „XYZ”, „Month”: „Grudzień”, „Target”: „45”, „Osiągnięte”: „36”, „oczekujące”: „9”
,

„Nazwa”: „ABC”, „Month”: „Grudzień”, „Target”: „45”, „osiągnięty”: „54”, „oczekujący”: „0”

]

W powyższym pliku przechowuj podane dane w formie „kluczowa wartość”Pary.

Przejdźmy teraz do podanego poniżej kodu JS-SNIPPET:

Zgodnie z powyższym kodem:

  • Po pierwsze, zastosuj „aportować()„Metoda pobierania omawianych”JSON" plik.
  • W następnym kroku skojarz „Następnie()„Metoda obietnicy obietnicy odnoszącej się do funkcji wywołania zwrotnego dla„powodzenie", I.mi., odpowiedź.
  • Teraz zwróć odpowiedni obiekt obietnicy.
  • Na koniec patrz zawarte dane w pobieranym pliku i wyświetl je na konsoli.

Wyjście

W powyższym wyjściu można zaobserwować, że plik JSON został pomyślnie pobrany, a dodane dane są wyświetlane.

Tę samą funkcjonalność można również osiągnąć, po prostu wprowadzając następujące wiersze kodu za pomocą „wymagać”Moduł:

const data = wymaga ('./pracownik.JSON ');
konsola.log (dane);

Chodziło o załadowanie pliku JSON do zmiennej za pomocą JavaScript.

Wniosek

Aby załadować lokalny plik JSON do zmiennej, zastosuj połączony „aportować()" I "Następnie()”Metody lub„wymagać”Moduł. Podejścia te można wykorzystać do po prostu załadowania utworzonego pliku JSON, patrz spełniona obietnica i zwrócenie zawartych danych na podstawie tego. W tym artykule zilustrowano podejścia do załadowania lokalnego pliku JSON do zmiennej.