7 Rad Jak Pisać Lepszy Kod Javascript

Jesteś początkującym programistą i chcesz nauczyć się pisać lepszy kod? W tym wpisie poruszymy takie tematy, jak najlepsze praktyki nazywania zmiennych i funkcji, używanie komentarzy do dokumentowania kodu oraz sposoby na poprawę czytelności i organizacji.

Niezależnie od tego, czy jesteś początkującym programistą, czy chcesz tylko podszlifować swoje umiejętności, czytaj dalej, aby poznać kilka pomocnych wskazówek dotyczących pisania lepszego kodu!

1. Używaj jasnych nazw zmiennych i funkcji

Nazywanie zmiennych to jedna z najistotniejszych i najbardziej czasochłonnych (o ironio) rzeczy podczas pisania kodu.

Nazwy te powinny być opisowe i łatwe do zrozumienia. Jasne nazwy pomogą Ci lepiej orientować się w swoim kodzie oraz ułatwią innym jego czytanie i debugowanie.

Oto kilka zasad, jakimi kieruję się przy nadawaniu nazw zmiennych:

  • użyj więcej niż jednego słowa do nazwania swojej zmiennej (w większości wypadków)
  • łączenie słów za pomocą camelCase - firstSecondThird
  • zawsze umieszczaj przymiotnik po lewej stronie - premiumUsers, filteredPosts
  • is/are/has przy zmiennych true/false - isDarkMode, isPopupOpen, hasDashboardAccess
  • nazwa zmiennej powinna prawidłowo ją opisywać - firstName zamiast, np. inputValue
  • stałe zapisujemy wielkimi literami, oraz łączymy słowa za pomocą znaku podkreślenia - SECONDS = 60, LOGIN_ATTEMPTS = 3

2. Używaj komentarzy do objaśniania bloków kodu

Komentarze są ważnym elementem dobrego kodu. Pomagają wyjaśnić, co robi dany blok kodu i dlaczego został napisany w taki, a nie inny sposób.

Warto pamiętać, aby komentować każdy istotny fragment kodu, a nie tylko linijki lub sekcje kodu, które mogą być trudne do zrozumienia.

Jeśli masz jakiś wątpliwości, czy dany komentarz jest potrzebny, zawsze możesz go dodać - dobrych komentarzy nigdy za wiele.

Pamiętaj też, że komentarze powinny być łatwe do zrozumienia dla innych programistów.

3. Używaj narzędzi do formatowania kodu

Jeden z ważnych aspektów pisania dobrego kodu to utrzymanie jak najlepszej czytelności.

Dlatego tak ważne jest prawidłowe formatowanie kodu za pomocą narzędzi takich jak ESlint i Prettier.

ESlint to narzędzie, które pomaga zidentyfikować i naprawić błędy w kodzie, natomiast Prettier to narzędzie, które formatuje kod tak, aby był czytelny.

Oba te narzędzia są niezbędne do utrzymania czystości i czytelności kodu. Używając ich, można upewnić się, że kod jest jasny i zwięzły, co ułatwia jego zrozumienie przez innych programistów.

Przykładowa konfiguracja ESlint w jednym z moich projektów React.js - link.

4. Przechowuj liczby w zmiennych

Tak zwane "magiczne liczby" jest to wartość liczbowa zakodowana na sztywno:

for (let i = 0; i < 7; i++) {
  // code
}

Jak myślisz, czym jest liczba 7? Jest to szczęśliwa liczba, dzień w którym się urodziłem (serio xd), czy coś innego?

Właśnie tak będzie czuł się każdy programista, gdy zobaczy w taki sposób zapisaną liczbę.

Pewnie zajmie mu kilka, jak nie kilkanaście minut, żeby zrozumieć czym jest ta liczba i co ma na celu.

Właśnie z tego powodu powinniśmy zapisywać liczby jako zmienne i prawidłowo je opisać (co już wiesz z punktu 1).

const DAYS_OF_THE_WEEK = 7;

for (let i = 0; i < DAYS_OF_THE_WEEK; i++) {
  // code
}

Od razu lepiej, prawda? 🚀

5. Pisz modularny i reużywalny kod

Jednym z najlepszych sposobów na pisanie lepszego kodu jest jego modularyzacja, czyli podzielenie go na funkcje wielokrotnego użytku.

Dzięki temu kod staje się bardziej niezawodny, łatwiejszy do odczytania i utrzymania.

Modularyzacja kodu zapobiega również kopiowaniu kodu - jeśli zaprojektujemy funkcję, aby była uniwersalna i reużywalna śmiało będziesz mógł użyć jej w całym projekcie.

Ułatwia to także testowanie, ponieważ można w łatwy sposób wyizolować poszczególne funkcje i przetestować je.

6. Pisz testy jednostkowe

Testy jednostkowe są ważną częścią pisania dobrego kodu. Pisząc testy jednostkowe, możesz zweryfikować funkcjonalność swojego kodu i upewnić się, że działa on zgodnie z oczekiwaniami.

Testy jednostkowe mogą również pomóc w wychwyceniu problemów i błędów w kodzie.

Podczas pisania testów jednostkowych ważne jest, aby być dokładnym i skrupulatnym. Należy przetestować każdy możliwy scenariusz i użyć różnych danych wejściowych, aby zweryfikować funkcjonalność kodu.

Dodatkowo, tak jak wcześniej, tutaj również należy pamiętać o pisaniu łatwych do zrozumienia testów jednostkowych. Pomoże to Tobie i innym programistom, którzy będą musieli w przyszłości debugować lub modyfikować Twój kod.

7. Korzystaj z bibliotek i frameworków

Wraz ze wzrostem popularności frameworków i bibliotek JavaScript, programiści nie są już obciążeni tworzeniem całego kodu od podstaw.

Frameworki takie jak React i Angular pozwalają na bardziej efektywny przepływ pracy, zapewniając funkcje takie jak routing, które w przeciwnym razie musiałyby być kodowane od zera.

Ponadto frameworki te mogą pomóc w skróceniu czasu pisania aplikacji poprzez dostarczanie standardowych komponentów, które mogą być ponownie wykorzystane w wielu aplikacjach.

W rezultacie, użycie frameworków i bibliotek może znacznie poprawić Twoją wydajność jako programisty.

Podsumowanie

Pisanie lepszego kodu to proces, który wymaga czasu i praktyki. Kod, który piszesz powinien być czytelny oraz łatwy do zrozumienia przez pozostałych programistów.

Przestrzeganie tych podstawowych zasad pozwoli uniknąć popełniania błędów oraz zaoszczędzi sporo czasu.

Mam nadzieję, że te wskazówki pomogą Ci w Twojej pracy.

Jeśli szukasz więcej rad sprawdź 6 rzeczy, na które zwróciłbym uwagę, gdybym uczył się Frontendu od nowa.