Underscore.JS - Kurzanleitung
Underscore.JS ist eine beliebte Javascript-basierte Bibliothek, die über 100 Funktionen zur Erleichterung der Webentwicklung bietet. Es bietet Hilfsfunktionen wie Map, Filter, Aufruf sowie Funktionsbindung, Javascript-Template, Deep Equality Checks, Erstellen von Indizes und so weiter. Underscore.JS kann direkt in einem Browser und auch mit Node.js verwendet werden.
Das Arbeiten mit Objekten mit JavaScript kann eine große Herausforderung sein, insbesondere wenn Sie viele Manipulationen vornehmen müssen. Der Unterstrich enthält viele Funktionen, die Ihnen die Arbeit mit Objekten erleichtern.
Underscore.JS ist ein Open-Source-Projekt. Sie können problemlos einen Beitrag zur Bibliothek leisten und Funktionen in Form von Plugins hinzufügen und auf GitHub und in Node.js verfügbar machen.
Eigenschaften
Lassen Sie uns alle wichtigen Funktionen von Underscore im Detail verstehen -
Sammlungen
Underscore.JS bietet verschiedene Funktionen für Sammlungen wie "Map" und "Reduce", mit denen eine Operation auf jedes Element einer Sammlung angewendet wird. Es bietet Methoden wie groupBy, countBy, max, min, die Sammlungen verarbeiten und viele Aufgaben vereinfachen.
Arrays
Underscore.JS bietet verschiedene Funktionen für Arrays, die Arrays wie first, initial, lastIndexOf, Schnittpunkt, Differenz usw. iterieren und verarbeiten möchten.
Funktionen
Underscore.JS bietet Funktionen wie Binden, Verzögern, Vorher, Nachher usw.
Objekte
Underscore.JS bietet Funktionen zum Bearbeiten von Objekten, zum Zuordnen von Objekten und zum Vergleichen von Objekten. Zum Beispiel Schlüssel, Werte, Erweitert, ErweitertOwn, isEqual, isEmpty usw.
Dienstprogramme
Underscore.JS bietet verschiedene Dienstprogrammmethoden wie noConflict, random, iteratee, Escape usw.
Verkettung
Underscore.JS bietet Verkettungsmethoden wie Chain, Value.
In den folgenden Kapiteln werden wichtige Funktionen von Underscore.JS behandelt
In diesem Kapitel erfahren Sie ausführlich, wie Sie die Arbeitsumgebung von Underscore.JS auf Ihrem lokalen Computer einrichten. Bevor Sie mit der Arbeit an Underscore.JS beginnen, müssen Sie Zugriff auf die Bibliothek haben. Sie können mit einer der folgenden Methoden auf die Dateien zugreifen:
Methode 1: Verwenden der Datei Underscore.JS im Browser
Bei dieser Methode benötigen wir die Datei Underscore.JS von der offiziellen Website und verwenden sie direkt im Browser.
Schritt 1
Besuchen Sie als ersten Schritt die offizielle Website von Underscore.JS https://underscorejs.org/.
Beachten Sie, dass eine Download-Option verfügbar ist, mit der Sie die neueste verfügbare Unterstrich-min.js-Datei UMD (Production) erhalten. Klicken Sie mit der rechten Maustaste auf den Link und wählen Sie Speichern unter. Beachten Sie, dass die Datei mit und ohne Minimierung verfügbar ist.
Schritt 2
Schließen Sie jetzt ein underscore-min.js in der scripttaggen und mit Underscore.JS arbeiten. Hierfür können Sie den unten angegebenen Code verwenden -
<script type = "text/JavaScript" src = "https://underscorejs.org/underscore-min.js"></script>Hier ist ein Arbeitsbeispiel und seine Ausgabe zum besseren Verständnis angegeben -
Beispiel
<html>
<head>
<title>Underscore.JS - Working Example</title>
<script type = "text/JavaScript" src = "https://underscorejs.org/underscore-min.js"></script>
<style>
div {
border: solid 1px #ccc;
padding:10px;
font-family: "Segoe UI",Arial,sans-serif;
width: 50%;
}
</style>
</head>
<body>
<div style = "font-size:25px" id = "list">
</div>
<script type = "text/JavaScript">
var numbers = [1, 2, 3, 4];
var listOfNumbers = '';
_.each(numbers, function(x) { listOfNumbers += x + ' ' });
document.getElementById("list").innerHTML = listOfNumbers;
</script>
</body>
</html>Ausgabe
Methode 2: Verwenden von Node.js.
Wenn Sie sich für diese Methode entscheiden, stellen Sie sicher, dass Sie haben Node.js und npmauf Ihrem System installiert. Mit dem folgenden Befehl können Sie Underscore.JS installieren -
npm install underscoreSie können die folgende Ausgabe beobachten, sobald Underscore.JS erfolgreich installiert wurde -
+ [email protected]
added 1 package from 1 contributor and audited 1 package in 6.331s
found 0 vulnerabilitiesUm zu testen, ob Underscore.JS mit Node.js einwandfrei funktioniert, erstellen Sie die Datei tester.js und fügen Sie den folgenden Code hinzu:
var _ = require('underscore');
var numbers = [1, 2, 3, 4];
var listOfNumbers = '';
_.each(numbers, function(x) { listOfNumbers += x + ' ' });
console.log(listOfNumbers);Speichern Sie das obige Programm in tester.js. Die folgenden Befehle werden zum Kompilieren und Ausführen dieses Programms verwendet.
Befehl
\>node tester.jsAusgabe
1 2 3 4Underscore.JS verfügt über viele benutzerfreundliche Methoden, die beim Iterieren von Sammlungen hilfreich sind. In diesem Kapitel werden sie ausführlich erläutert.
Underscore.JS bietet verschiedene Methoden zum Iterieren der Sammlungen, wie unten aufgeführt -
| Sr.Nr. | Methode & Syntax |
|---|---|
| 1 | jeder _.each (Liste, Iteration, [Kontext]) |
| 2 | Karte _.map (Liste, Iteration, [Kontext]) |
| 3 | reduzieren _.reduce (Liste, Iteration, [Memo], [Kontext]) |
| 4 | reductRight _.reduceRight (Liste, Iteration, [Memo], [Kontext]) |
| 5 | finden _.find (Liste, Prädikat, [Kontext]) |
| 6 | Filter _.filter (Liste, Prädikat, [Kontext]) |
| 7 | wo _.where (Liste, Eigenschaften) |
| 8 | findWhere _.findWhere (Liste, Eigenschaften) |
| 9 | ablehnen _.reject (Liste, Prädikat, [Kontext]) |
| 10 | jeder _.jeder (Liste, [Prädikat], [Kontext]) |
| 11 | etwas _.some (Liste, [Prädikat], [Kontext]) |
Underscore.JS verfügt über viele benutzerfreundliche Methoden, die bei der Verarbeitung von Sammlungen hilfreich sind. In diesem Kapitel werden sie ausführlich erläutert.
Underscore.JS bietet verschiedene Methoden zum Verarbeiten der Sammlungen, wie unten aufgeführt -
| Sr.Nr. | Methode & Syntax |
|---|---|
| 1 | enthält _.contains (Liste, Wert, [fromIndex]) |
| 2 | aufrufen _.invoke (Liste, Methodenname, * Argumente) |
| 3 | zupfen _.pluck (Liste, Eigenschaftsname) |
| 4 | max _.max (Liste, [iteratee], [context]) |
| 5 | Mindest _.min (Liste, [iteratee], [context]) |
| 6 | Sortieren nach _.sortBy (Liste, Iteration, [Kontext]) |
| 7 | gruppiere nach _.groupBy (Liste, Iteration, [Kontext]) |
| 8 | indexBy _.indexBy (Liste, Iteration, [Kontext]) |
| 9 | countBy _.countBy (Liste, Iteration, [Kontext]) |
| 10 | Mischen _.shuffle (Liste) |
| 11 | Stichprobe _.sample (Liste, [n]) |
| 12 | toArray _.toArray (Liste) |
| 13 | Größe _.size (Liste) |
| 14 | Partition _.partition (Liste, Prädikat) |
| 15 | kompakt _.compact (Liste) |
Underscore.JS verfügt über viele benutzerfreundliche Methoden, die beim Iterieren von Arrays helfen. In diesem Kapitel werden sie ausführlich erläutert.
Underscore.JS bietet verschiedene Methoden zum Iterieren der Arrays, wie unten aufgeführt -
| Sr.Nr. | Methode & Syntax |
|---|---|
| 1 | zuerst _.first (Array, [n]) |
| 2 | Initiale _.initial (Array, [n]) |
| 3 | zuletzt _.last (Array, [n]) |
| 4 | sich ausruhen _.rest (Array, [Index]) |
| 5 | Index von _.indexOf (Array, Wert, [isSorted]) |
| 6 | lastIndexOf _.lastIndexOf (Array, Wert, [fromIndex]) |
| 7 | sortiertIndex _.sortedIndex (Array, Wert, [iteratee], [context]) |
| 8 | findIndex _.findIndex (Array, Prädikat, [Kontext]) |
| 9 | findLastIndex _.findLastIndex (Array, Prädikat, [Kontext]) |
Underscore.JS verfügt über viele benutzerfreundliche Methoden, die bei der Verarbeitung von Arrays hilfreich sind. In diesem Kapitel werden sie ausführlich erläutert.
Underscore.JS bietet verschiedene Methoden zum Verarbeiten der Arrays, wie unten aufgeführt -
| Sr.Nr. | Methode & Syntax |
|---|---|
| 1 | ebnen _.flatten (Array, [flach]) |
| 2 | ohne _.ohne (Array, * Werte) |
| 3 | Union _.union (* Arrays) |
| 4 | Überschneidung _.intersection (* Arrays) |
| 5 | Unterschied _.difference (Array, * andere) |
| 6 | uniq _.uniq (Array, [isSorted], [iteratee]) |
| 7 | Postleitzahl _.zip (* Arrays) |
| 8 | entpacken _.unzip (Array) |
| 9 | Objekt _.Objekt (Liste, [Werte]) |
| 10 | Stück _.chunk (Array, Länge) |
| 11 | Angebot _.range ([Start], Stopp, [Schritt]) |
Underscore.JS verfügt über viele benutzerfreundliche Methoden, die bei der Handhabung von Funktionen helfen. In diesem Kapitel werden sie ausführlich erläutert.
Underscore.JS bietet verschiedene Methoden zur Handhabung der unten aufgeführten Funktionen -
| Sr.Nr. | Methode & Syntax |
|---|---|
| 1 | binden _.bind (Funktion, Objekt, * Argumente) |
| 2 | teilweise _.partial (Funktion, * Argumente) |
| 3 | auswendig lernen _.memoize (Funktion, [hashFunction]) |
| 4 | verzögern _.delay (Funktion, Wartezeit, * Argumente) |
| 5 | Einmal _.once (Funktion) |
| 6 | Vor _.vor (Anzahl, Funktion) |
| 7 | wickeln _.wrap (Funktion, Wrapper) |
| 8 | negieren _.negate (Prädikat) |
| 9 | komponieren _.compose (* Funktionen) |
Underscore.JS verfügt über viele benutzerfreundliche Methoden, die beim Zuordnen von Objekten helfen. In diesem Kapitel werden sie ausführlich erläutert.
Underscore.JS bietet verschiedene Methoden zur Handhabung der Objektzuordnung, wie unten aufgeführt -
| Sr.Nr. | Methode & Syntax |
|---|---|
| 1 | Schlüssel _.keys (Objekt) |
| 2 | allKeys _.allKeys (Objekt) |
| 3 | Werte _.Werte (Objekt) |
| 4 | mapObject _.mapObject (Objekt, Iterat, [Kontext]) |
| 5 | Paare Paare (Objekt) |
| 6 | umkehren _.invert (Objekt) |
| 7 | erstellen _.create (Prototyp, Requisiten) |
| 8 | Funktionen _.Funktionen (Objekt) |
| 9 | findKey _.findKey (Objekt, Prädikat, [Kontext]) |
Underscore.JS verfügt über viele benutzerfreundliche Methoden, mit denen Objekte aktualisiert werden können. In diesem Kapitel werden sie ausführlich erläutert.
Underscore.JS bietet verschiedene Methoden zum Behandeln von Objektaktualisierungen, wie unten aufgeführt -
| Sr.Nr. | Methode & Syntax |
|---|---|
| 1 | erweitern _.extend (Ziel, * Quellen) |
| 2 | wählen _.pick (Objekt, * Schlüssel) |
| 3 | auslassen _.omit (Objekt, * Schlüssel) |
| 4 | Standardeinstellungen _.defaults (Objekt, * Standard) |
| 5 | Klon _.clone (Objekt) |
| 6 | Zapfhahn _.tap (Objekt, Abfangjäger) |
| 7 | hat _.hat (Objekt, Schlüssel) |
| 8 | Eigentum Eigentum (Pfad) |
| 9 | Eigentum von _.propertyOf (Objekt) |
Underscore.JS verfügt über viele benutzerfreundliche Methoden, mit denen Objekte verglichen werden können. In diesem Kapitel werden sie ausführlich erläutert.
Underscore.JS bietet verschiedene Methoden für den Objektvergleich, wie unten aufgeführt -
| Sr.Nr. | Methode & Syntax |
|---|---|
| 1 | Matcher _.matcher (attrs) |
| 2 | ist gleich _.isEqual (Objekt, andere) |
| 3 | isMatch _.isMatch (Objekt, Eigenschaften) |
| 4 | ist leer _.isEmpty (Objekt) |
| 5 | isArray _.isArray (Objekt) |
| 6 | isObject _.isObject (Wert) |
| 7 | isArguments _.isArguments (Objekt) |
| 8 | isFunction _.isFunction (Objekt) |
| 9 | isString _.isString (Objekt) |
| 10 | ist Nummer _.isNumber (Objekt) |
| 11 | isFinite _.isFinite (Objekt) |
| 12 | isBoolean _.isBoolean (Objekt) |
| 13 | isDate _.isDate (Objekt) |
| 14 | isRegExp _.isRegExp (Objekt) |
| 15 | isError _.isError (Objekt) |
| 16 | isSymbol _.isSymbol (Objekt) |
| 17 | isMap _.isMap (Objekt) |
| 18 | isWeakMap _.isWeakMap (Objekt) |
| 19 | isSet _.isSet (Objekt) |
| 20 | isWeakSet _.isWeakSet (Objekt) |
| 21 | isNaN _.isNaN (Objekt) |
| 22 | ist Null _.isNull (Objekt) |
| 23 | ist nicht definiert _.isUndefined (Wert) |
Underscore.JS bietet viele benutzerfreundliche Dienstprogrammmethoden. In diesem Kapitel werden sie ausführlich erläutert.
Underscore.JS bietet verschiedene Dienstprogrammmethoden, wie unten aufgeführt -
| Sr.Nr. | Methode & Syntax |
|---|---|
| 1 | Identität Identität (Wert) |
| 2 | Konstante _.konstanter Wert) |
| 3 | noop _.noop () |
| 4 | mal _.times (n, iteratee, [context]) |
| 5 | zufällig zufällig (min, max) |
| 6 | mischen _.mixin (Objekt) |
| 7 | iterieren _.iteratee (Wert, [Kontext]) |
| 8 | Eindeutige ID _.uniqueId ([Präfix]) |
| 9 | Flucht _.escape (Zeichenfolge) |
| 10 | entkommen _.unescape (Zeichenfolge) |
| 11 | Ergebnis _.result (Objekt, Eigenschaft, [defaultValue]) |
| 12 | jetzt _.jetzt() |
| 13 | Vorlage _.template (templateString, [Einstellungen]) |
Underscore.JS verfügt über Methoden, mit denen eine Methodenkette erstellt und das effektive Ergebnis abgerufen werden kann. In diesem Kapitel werden sie ausführlich erläutert.
Underscore.JS bietet verschiedene Dienstprogrammmethoden, wie unten aufgeführt -
| Sr.Nr. | Methode & Syntax |
|---|---|
| 1 | Kette _.chain (Objekt) |
| 2 | Wert _.chain (obj) .value () |