Heim >Web-Frontend >js-Tutorial >Lodash – ein Javascript-Power-Tool

Lodash – ein Javascript-Power-Tool

Barbara Streisand
Barbara StreisandOriginal
2024-11-18 04:54:02257Durchsuche

Lodash - a javascript power tool

Lodash, ein leichter Ersatz für Underscore.js, ist eine beliebte JavaScript-Dienstprogrammbibliothek, die häufige Programmieraufgaben vereinfacht. Entdecken Sie unten die 20 wichtigsten Lodash-Funktionen, um Ihre JavaScript-Kenntnisse zu verbessern:


1. _.get

  • Ruft eine verschachtelte Eigenschaft sicher von einem Objekt ab und vermeidet Fehler, wenn die Eigenschaft nicht vorhanden ist.
const obj = { a: { b: { c: 42 } } }; _.get(obj, 'a.b.c', 'default'); // 42

2. _.set

  • Legt den Wert einer verschachtelten Eigenschaft in einem Objekt fest und erstellt Zwischeneigenschaften, wenn diese nicht vorhanden sind.
const obj = {}; _.set(obj, 'a.b.c', 42); console.log(obj); // { a: { b: { c: 42 } } }

3. _.cloneDeep

  • Erstellt eine tiefe Kopie eines Objekts oder Arrays.
const arr = [{ a: 1 }]; const deepClone = _.cloneDeep(arr);

4. _.debounce

  • Verzögert die Ausführung einer Funktion, bis eine bestimmte Zeit seit ihrem letzten Aufruf vergangen ist.
const log = _.debounce(() => console.log('Debounced!'), 300); window.addEventListener('resize', log);

5. _.throttle

  • Stellt sicher, dass eine Funktion höchstens einmal in einem bestimmten Zeitintervall ausgeführt wird.
const log = _.throttle(() => console.log('Throttled!'), 1000); window.addEventListener('scroll', log);

6. _.isEmpty

  • Prüft, ob ein Wert ein leeres Objekt, Array oder ein falscher Wert ist.
_.isEmpty([]); // true _.isEmpty({}); // true _.isEmpty(''); // true

7. _.merge

  • Führt zwei oder mehr Objekte tief zusammen und kombiniert ihre Eigenschaften.
const obj1 = { a: { b: 1 } }; const obj2 = { a: { c: 2 } }; _.merge(obj1, obj2); // { a: { b: 1, c: 2 } }

8. _.pick

  • Erstellt ein Objekt, das aus den ausgewählten Eigenschaften besteht.
const obj = { a: 1, b: 2, c: 3 }; _.pick(obj, ['a', 'c']); // { a: 1, c: 3 }

9. _.omit

  • Erstellt ein Objekt ohne die angegebenen Eigenschaften.
const obj = { a: 1, b: 2, c: 3 }; _.omit(obj, ['b']); // { a: 1, c: 3 }

10. _.uniq

  • Entfernt doppelte Werte aus einem Array.
_.uniq([1, 2, 2, 3]); // [1, 2, 3]

11. _.groupBy

  • Gruppiert die Elemente eines Arrays basierend auf einem bereitgestellten Kriterium.
_.groupBy([6.1, 4.2, 6.3], Math.floor); // { '4': [4.2], '6': [6.1, 6.3] }

12. _.sortBy

  • Sortiert ein Array von Objekten basierend auf bestimmten Eigenschaften oder Kriterien.
const users = [{ name: 'Tom', age: 30 }, { name: 'Jerry', age: 20 }]; _.sortBy(users, 'age'); // [{ name: 'Jerry', age: 20 }, { name: 'Tom', age: 30 }]

13. _.map

  • Erstellt ein neues Array, indem jedes Element in einer Sammlung transformiert wird.
_.map([1, 2, 3], n => n * 2); // [2, 4, 6]

14. _.filter

  • Erstellt ein Array mit Elementen, die die bereitgestellte Bedingung erfüllen.
_.filter([1, 2, 3, 4], n => n % 2 === 0); // [2, 4]

15. _.find

  • Findet das erste Element, das eine Bedingung erfüllt.
_.find([1, 2, 3, 4], n => n > 2); // 3

16. _.flatten

  • Reduziert ein verschachteltes Array in ein einstufiges Array.
_.flatten([1, [2, [3, [4]]]]); // [1, 2, [3, [4]]]

17. _.flattenDeep

  • Reduziert ein verschachteltes Array in ein vollständig einstufiges Array.
_.flattenDeep([1, [2, [3, [4]]]]); // [1, 2, 3, 4]

18. _.difference

  • Gibt die Werte aus dem ersten Array zurück, die nicht im zweiten Array enthalten sind.
const obj = { a: { b: { c: 42 } } }; _.get(obj, 'a.b.c', 'default'); // 42

19. _.chunk

  • Teilt ein Array in Gruppen der angegebenen Größe.
const obj = {}; _.set(obj, 'a.b.c', 42); console.log(obj); // { a: { b: { c: 42 } } }

20. _.isEqual

  • Führt einen umfassenden Vergleich durch, um festzustellen, ob zwei Werte äquivalent sind.
const arr = [{ a: 1 }]; const deepClone = _.cloneDeep(arr);

Lernen Sie weiter und haben Sie Spaß!

Das obige ist der detaillierte Inhalt vonLodash – ein Javascript-Power-Tool. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn