Wprowadzenie do Lodash i jego korzyści dla programistów JavaScript

Wprowadzenie do Lodash i jego korzyści dla programistów JavaScript

Lodash to biblioteka JavaScript oferująca funkcje użytkowe do typowych zadań programistycznych z wykorzystaniem funkcjonalnego modelu programowania.

Biblioteka, która współpracuje z przeglądarkami internetowymi i Node.js, może modyfikować i konwertować dane, wykonywać operacje asynchroniczne i nie tylko.

Dowiedz się, jak używać lodash do manipulowania tablicami, ciągami znaków i obiektami oraz poznaj jego zaawansowane funkcje, takie jak składanie funkcji.

Pierwsze kroki z Lodashem

Możesz dodać lodash do swojej aplikacji na jeden z dwóch sposobów: używając Content Delivery Network (CDN) lub instalując go za pomocą npm lub przędzy.

Aby używać lodash bezpośrednio w przeglądarce, skopiuj poniższy link do lodash CDN i umieść go w sekcji head swojego pliku HTML:

<script src="https://cdn.jsdelivr.net/npm/lodash@4.17.21/lodash.min.js"
  type="text/javascript"></script>

Korzystając z tego podejścia, możesz uruchamiać skrypty za pomocą lodash w treści kodu HTML.

Aby używać lodash w projekcie Node.js, powinieneś zainstalować go w swoim katalogu projektu. Aby to zrobić, możesz użyć npm lub przędzy:

npm install --save lodash
# or
yarn add lodash

Możesz teraz używać lodash, wymagając go w swoim pliku JavaScript:

// Requiring the lodash library
const _ = require("lodash");

// Using the _.sum method
const numbers = [10, 20, 30, 40, 50];
const sum = _.sum(numbers);
console.log(sum);

Aby uruchomić plik JavaScript, wprowadź polecenie węzła:

node [Your script name]

Manipulacja tablicami w Lodash

Lodash zawiera zestaw metod manipulacji tablicami, które zapewniają funkcjonalność wykraczającą poza wbudowaną w JavaScript klasę Array.

.kawałek

Ta metoda dzieli tablicę na grupy mniejszych tablic o danym rozmiarze. Ostateczna porcja może być mniejsza niż żądany rozmiar.

Oto przykład:

const array = [ 'a', 'b', 'c', 'd', 'e', 'f', 'g' ];
const newArray = _.chunk(array, 2)
console.log(newArray)

// Output:
// [ [ 'a', 'b' ], [ 'c', 'd' ], [ 'e', 'f' ], [ 'g' ] ]

.kontakt

Ta metoda generuje nową tablicę przez łączenie wartości na końcu istniejącej tablicy.

Na przykład:

const array = [ 1, 2, 'a' ];
const newArray = _.concat(array, 5, 'b', [ 8 ], [ [ 9 ] ]);
console.log(newArray);

// Output:
// [ 1, 2, 'a', 5, 'b', 8, [ 9 ] ]

.Przystąp

Ta metoda zwraca ciąg, łącząc elementy tablicy. Łączy je za pomocą ogranicznika, który przekazujesz jako parametr podczas wywoływania metody. Domyślnym ogranicznikiem, którego używa, jest przecinek:

const array = [ "l", "o", "d", "a", "s", "h" ];
const newArray = _.join(array);
console.log(newArray);

// Output:
// l,o,d,a,s,h

const newArray = _.join(array, "-");
console.log(newArray);

// Output:
// l-o-d-a-s-h

Manipulacja strunami w Lodash

W przypadku samego JavaScript formatowanie ciągów jest prostym procesem. Ale lodash sprawia, że ​​jest to jeszcze łatwiejsze.

Niektóre z najczęstszych operacji manipulacji łańcuchami, które można wykonać za pomocą lodash, obejmują:

.zaczyna się od i. kończy sięZ

Te dwie metody sprawdzają, czy łańcuch rozpoczyna się, czy kończy odpowiednio podłańcuchem. Obie metody zwracają wartość logiczną true lub false.

Na przykład:

const string = "lodash";

console.log(_.startsWith(string, "l"));
// Output: true

console.log(_.startsWith(string, "o"));
// Output: false

console.log(_.endsWith(string, "m"));
// Output: false

console.log(_.endsWith(string, "h"));
// Output: true

.powtarzać

Ta metoda wielokrotnie drukuje ciąg określoną liczbę razy. Przyjmuje łańcuch jako pierwszy argument, a liczbę powtórzeń jako drugi:

const string = "lodash"
const newString = _.repeat(string, 3);
console.log(newString);
// Output: lodashlodashlodash

.przycinać

Ta metoda usuwa początkowe i końcowe białe znaki. Możesz go również użyć do usunięcia określonych znaków na początku i na końcu łańcucha.

Na przykład:

// Removing leading & trailing whitespace
const string = "bar "
const newString = _.trim(string)
console.log(newString);
// Output: bar

// Removing specified characters
const string = ",bar,"
const newString = _.trim(string, ",")
console.log(newString);
// Output: bar

Manipulacja obiektami w Lodash

Poniżej znajduje się kilka przykładów manipulacji łańcuchami, które można wykonać za pomocą lodash:

.łączyć

Metoda _.merge() tworzy nowy obiekt poprzez połączenie właściwości obiektów wejściowych. Wartość właściwości z późniejszego obiektu zastąpi wartość z wcześniejszego obiektu, jeśli właściwość jest obecna w więcej niż jednym obiekcie.

Na przykład:

const books = {
    'Mathematics': 4,
    'Science': 7
};

const notes = {
    'Science': 3,
    'Chemistry': 5
};

_.merge(books, notes);
console.log(books);
// Output:
// { Mathematics: 4, Science: 3, Chemistry: 5 }

W tym przykładzie metoda dodaje właściwość „Chemia” z drugiego obiektu i zastępuje wartość właściwości „Nauka” pierwszego obiektu.

.ma

Ta metoda zwraca wartość true, jeśli w obiekcie istnieje dana seria właściwości, w przeciwnym razie zwraca wartość false.

Na przykład:

const books = {
    'Mathematics': 4,
    'Science': 7
};

console.log(_.has(books, "Mathematics"));
// Output: true

.pomijać

Ta metoda zwraca nowy obiekt, usuwając określone właściwości z podanego.

Na przykład:

var books = {
    'Mathematics': 4,
    'Science': 3,
    'Chemistry': 5
};

console.log(_.omit(books, "Science"));
// Output: { Mathematics: 4, Chemistry: 5 }

Kompozycja funkcji w Lodash

Kompozycja funkcji to technika, której można użyć w funkcjonalnym języku programowania. Polega na połączeniu dwóch lub więcej funkcji w nową funkcję poprzez wywołanie każdej funkcji w określonej kolejności. Ta funkcja umożliwia tworzenie bardziej złożonej logiki z prostszych funkcji.

Aby zastosować tę technikę, lodash dostarcza funkcje _.flow i _.flowRight . Funkcja _.flow() przyjmuje listę funkcji jako argumenty i zwraca nową funkcję, która stosuje funkcje w takiej samej kolejności, w jakiej zostały przekazane. Funkcja _.flowRight() robi to samo, ale wywołuje funkcje w odwracać.

Na przykład:

function addFive(number) {
    return number + 5
}

function timesTwo(number) {
    return number * 2
}

const addFiveAndTimesTwo = _.flow([addFive, timesTwo]);

const addFiveAndTimesTwoReverse = _.flowRight([addFive, timesTwo]);

console.log(addFiveAndTimesTwo(3));
// Output: 16

console.log(addFiveAndTimesTwoReverse(3));
// Output: 11

Powyższy kod definiuje funkcje addFive i timesTwo . Funkcja addFive zwraca wynik dodania 5 do podanej liczby. Funkcja timesTwo mnoży liczbę wejściową przez 2 i zwraca wynik.

Następnie kod używa funkcji _.flow() do połączenia dwóch pozostałych i utworzenia nowej funkcji, addFiveAndTimesTwo . Ta nowa funkcja najpierw wykona operację addFive na swoim argumencie, zanim wykona operację timesTwo na wyniku końcowym.

Funkcja _.flowRight() tworzy nową funkcję, która działa tak samo jak flow, ale w odwrotnej kolejności.

Na koniec ten kod wywołuje dwie nowe funkcje, przekazując 3 jako argument i rejestruje wyniki w konsoli.

Korzyści z pracy z Lodash

Możesz użyć lodash, aby uprościć swój kod i uczynić swoje projekty bardziej elastycznymi i łatwiejszymi w utrzymaniu. Jego szeroki zakres funkcji użytkowych, szerokie zastosowanie i regularne aktualizacje pomogą Ci pisać elegancki, efektywny kod. Możesz użyć lodash, aby zagwarantować, że Twój kod jest zawsze aktualny i kompatybilny ze współczesnymi przeglądarkami.

Dodaj komentarz

Twój adres e-mail nie zostanie opublikowany. Wymagane pola są oznaczone *