TypeScript: Jak stworzyć pustą liczbę?

Opublikowano: - tagi:

Czym jest pusta liczba?

Ostatnio stanąłem przed zadaniem napisania testu jednostkowego, który sprawdzał przypadek: przekazany do funkcji model danych jest niepoprawny, więc walidacja powinna to wykryć i nie stworzyć rekordu w bazie danych. Jedno z wymaganych pól jest liczbą. Na przykład:

interface Model {
    name: string;
    value: number;
};

test('should not allow empty number', () => {
    // given
    const model: Model = {
        name: 'Test',
    };

    // when
    const result: boolean = validate(model);

    // given
    expect(result).toBeFalsy();
});

W tym teście symuluję przypadek, gdy do modelu nie jest przekazana wartość dla pola value. Problem w tym, że taki zapis nie zadziała, ponieważ TypeScript wyrzuci błąd:

error TS2741: Property 'value' is missing in type '{ name: string; }' but required in type 'Model'

Ten problem można rozwiązać poprzez małą zmianę w definicji modelu:

interface Model {
    name: string;
    value?: number;
};

Za pomocą operatora: ? informujemy TypeScript, że pole value jest opcjonalne, ale... to nie prawda, bo powinno być wymagane!

Jak to rozwiązać?

Pusta liczba przykład

Żeby stworzyć "pustą" liczbę można jej przypisać wartość NaN:

interface Model {
    name: string;
    value: number;
};

test('should not allow empty number', () => {
    // given
    const model: Model = {
        name: 'Test',
        value: NaN
    };

    // when
    const result: boolean = validate(model);

    // given
    expect(result).toBeFalsy();
});

Wartość NaN jest typu number i dlatego TypeScript nie sygnalizuje błędu.


React: Do czego służy useState?

Opublikowano: - tagi:

Czym jest useState?

useState w React jest to hook, który służy do zarządzania stanem komponentu. Może on zostać wykorzystany tylko w komponencie stworzonym za pomocą funkcji.

Przykład użycia useState

Poniżej prosty przykład użycia useState:

import React, { useState } from 'react';

const Counter = () => {
    const [counter, setCounter] = useState(0);


    const onIncrement = () => {
        setCounter(counter + 1);
    }

    const onDecrement = () => {
        setCounter(counter - 1);
    }

    return (
        <div>
            <button onClick={onDecrement}>-</button>
            <h2>{counter}</h2>
            <button onClick={onIncrement}>+</button>
        </div>
    )
}

Linijka:

const [counter, setCounter] = useState(0);

jest odpowiedzialna za stworzenie stanu naszego komponentu. Tutaj chcemy stworzyć stan do zarządzania wartością licznika.

useState przyjmuje jeden argument: wartość początkową, gdy komponent jest tworzony.

useState zwraca: zmienną, która przechowuje aktualny stan. W tym przypadku stała counter. Zwraca także funkcję, która pozwala zmienić stan na nowy: setCounter.

Jeśli potrzebujemy stworzyć stan dla różnych danych wystarczy wywołać jeszcze raz useState na przykład:

const [counter, setCounter] = useState(0);
const [list, setList] = useState([]);

Comics: Code smells

Opublikowano: - tagi:
Code smells

6 sposobów na lepszą koncentrację

Opublikowano: - tagi:

Skup się!

Moim zdaniem umiejętność skupienia się na tym, czym się aktualnie zajmuję to jedna z najważniejszych umiejętności, w jakich czasach żyjemy. Dlaczego? Przede wszystkim pozwala Ci to szybciej skończyć zadanie, które masz do zrobienia. Kiedy jesteś skoncentrowany na jednej rzeczy, poświęcasz cały swój czas i energię właśnie na tym. Właściwy poziom skupienia pozwala zaoszczędzić czas i energię. Te zasoby są ograniczone, więc warto nimi mądrze zarządzać.

Dlaczego tak trudno się skupić?

Problem polega na tym, że znacznie łatwiej stracić koncentrację niż się skupić. Wszystko przez różnego rodzaju rozpraszacze. Rozpraszając się, pozwalasz na to, żeby Twoja uwaga była podzielona w kilku miejscach. Tracisz przez to czas i energię. Działając w ten sposób, często zmieniasz kontekst, co powoduje zmęczenie psychiczne.

Nie raz miałem sytuację, że po dniu pracy zastanawiałem się, co ja właściwie dzisiaj zrobiłem? Jestem zmęczony, a właściwie nic konkretnego nie udało mi się zrobić. Wpadamy w taki stan, kiedy często pozwalamy się rozpraszać.

Dlatego mając świadomość o sile, jaką daje skupienie, warto zbudować dobry nawyk koncentracji.

Poniżej znajdziesz listę kilku ćwiczeń na lepsze skupienie.

Ćwiczenia na skupienie

Czytanie książek

Poświęć co najmniej 30 minut na czytanie. Jest to idealne ćwiczenie na koncentrację. W dziale książki znajdziesz kilka pozycji, które mogą Cię zainteresować.

Medytacja

Wystarczy sesja 10 minut dziennie. Ja poświęcam na medytację 2 × 10 minut: rano i wieczorem. Jest wiele rodzajów medytacji. Ja medytuję, w taki sposób, że skupiam się na swoim oddechu.

Na przykład:

Wciągam powietrze. Trzymam powietrze w płucach na jakieś 5 sekund i następnie wypuszczam je powoli.

Rób jedną rzecz na raz

Wielozadaniowość to zły nawyk! Skacząc po zadaniach, będziesz bardziej zmęczony. Znacznie lepiej skupić się na jednym zadaniu i przejść do kolejnego.

Wyrób w sobie nawyk koncentracji na jednym zadaniu.

Skupienie poprzez dźwięk

Żeby lepiej się skupić, możesz wykorzystać narzędzie, jakim jest dźwięk. Zakładasz słuchawki, włączasz odpowiedni dźwięk i koncentrujesz się na swoim celu.

Dźwięk pomaga w walce z rozpraszaczami. Jeśli jesteś zainteresowany tym ćwiczeniem, polecam dwa linki: Endel świetna aplikacja! Tylko że jest płatna.

Są też darmowe sposoby na skupienie poprzez dźwięk

Unikaj rozpraszaczy

Ten punkt powinien być pierwszy na liście, ale jest to trudne. W tym ćwiczeniu chodzi o zbudowanie dobrego nawyku: kiedy coś robię, zajmuję się tylko tym. Kuszące jest na przykład pisanie kodu + słuchanie audiobook'a, ale na dłuższą metę nie da to dobrych efektów. Szczególnie gdy zadanie wymaga dużej koncentracji.

Technika Pomodoro

Tecznika Pomodoro to jedno z pierwszych narzędzi, które pozwoliły mi zbudować dobry nawyk koncentracji. Polega na interwałowym trybie pracy. Więcej informacji znajdziesz tutaj


Podsumowanie: Grudzień 2022

Opublikowano: - tagi:

W grudniu opublikowałem 8 wpisów:


JavaScript:

  1. Jak iterować n-razy?

RxJS:

  1. Operator forkJoin
  2. Operator combineLatest

React:

  1. Czym jest JSX?
  2. Komponenty podstawy
  3. Jak przekazać komponent do innego komponentu?

NodeJS:

  1. Mongoose jak zapobiegać dodawania identyfikatora do zagnieżdżonego dokumentu?

Inne:

  1. Podsumowanie 2022 roku

Przeczytałem dwie książki:

  1. Szczypta nienawiści - Joe Abercrombie
  2. Kłopotliwy pokój - Joe Abercrombie

Przesłuchałem trzy audiobooki:

  1. Morfina - Szczepan Twardoch
  2. Blaze - Stephen King
  3. Sprzedawczyk - Paul Beatty