Underscore.JS - Guia rápido
Underscore.JS é uma biblioteca baseada em javascript popular que fornece mais de 100 funções para facilitar o desenvolvimento web. Ele fornece funções auxiliares como map, filter, invoke, bem como vinculação de funções, modelos de javascript, verificações de igualdade profundas, criação de índices e assim por diante. Underscore.JS pode ser usado diretamente dentro de um navegador e também com Node.js.
Trabalhar com objetos usando JavaScript pode ser bastante desafiador, especificamente se você tiver muita manipulação a ser feita com eles. O Underscore vem com muitos recursos que facilitam seu trabalho com objetos.
Underscore.JS é um projeto de código aberto e você pode contribuir facilmente com a biblioteca e adicionar recursos na forma de plug-ins e disponibilizá-los no GitHub e no Node.js.
Características
Vamos entender em detalhes todos os recursos importantes disponíveis com o Underscore -
Coleções
Underscore.JS fornece várias funções para coleções como cada, mapa, redução, que são usadas para aplicar uma operação em cada item de uma coleção. Ele fornece métodos como groupBy, countBy, max, min que processa coleções e facilita muitas tarefas.
Arrays
Underscore.JS fornece várias funções para matrizes, como iterar e processar matrizes como primeiro, inicial, últimoIndexOf, interseção, diferença etc.
Funções
Underscore.JS fornece funções como vincular, atrasar, antes, depois, etc.
Objetos
Underscore.JS fornece funções para manipular objetos, mapear objetos e comparar objetos. Por exemplo, keys, values, extends, extendsOwn, isEqual, isEmpty etc.
Serviços de utilidade pública
Underscore.JS fornece vários métodos utilitários como noConflict, random, iteratee, escape, etc.
Encadeamento
Underscore.JS fornece métodos de encadeamento, bem como cadeia, valor.
Nos capítulos subsequentes, cobriremos as funções importantes do Underscore.JS
Neste capítulo, você aprenderá em detalhes sobre como configurar o ambiente de trabalho do Underscore.JS em seu computador local. Antes de começar a trabalhar no Underscore.JS, você precisa ter acesso à biblioteca. Você pode acessar seus arquivos em qualquer um dos seguintes métodos -
Método 1: usando o arquivo Underscore.JS no navegador
Neste método, vamos precisar do arquivo Underscore.JS de seu site oficial e o usaremos diretamente no navegador.
Passo 1
Como primeiro passo, acesse o site oficial da Underscore.JS https://underscorejs.org/.
Observe que há uma opção de download disponível que fornece o último UMD (Produção) do arquivo underscore-min.js disponível. Clique com o botão direito no link e escolha salvar como. Observe que o arquivo está disponível com e sem minificação.
Passo 2
Agora, inclua underscore-min.js dentro de scripttag e comece a trabalhar com Underscore.JS. Para isso, você pode usar o código fornecido abaixo -
<script type = "text/JavaScript" src = "https://underscorejs.org/underscore-min.js"></script>Aqui está um exemplo de trabalho e sua saída para uma melhor compreensão -
Exemplo
<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>Resultado
Método 2: usando Node.js
Se você está optando por este método, certifique-se de ter Node.js e npminstalado em seu sistema. Você pode usar o seguinte comando para instalar o Underscore.JS -
npm install underscoreVocê pode observar a seguinte saída quando o Underscore.JS for instalado com sucesso -
+ [email protected]
added 1 package from 1 contributor and audited 1 package in 6.331s
found 0 vulnerabilitiesAgora, para testar se Underscore.JS funciona bem com Node.js, crie o arquivo tester.js e adicione o seguinte código a ele -
var _ = require('underscore');
var numbers = [1, 2, 3, 4];
var listOfNumbers = '';
_.each(numbers, function(x) { listOfNumbers += x + ' ' });
console.log(listOfNumbers);Salve o programa acima em tester.js. Os seguintes comandos são usados para compilar e executar este programa.
Comando
\>node tester.jsResultado
1 2 3 4Underscore.JS tem muitos métodos fáceis de usar que ajudam na iteração de coleções. Este capítulo os discute em detalhes.
Underscore.JS fornece vários métodos para iterar as coleções conforme listado abaixo
| Sr. Não. | Método e Sintaxe |
|---|---|
| 1 | cada _.each (lista, iteratário, [contexto]) |
| 2 | mapa _.map (lista, iteratário, [contexto]) |
| 3 | reduzir _.reduce (list, iteratee, [memo], [context]) |
| 4 | reduzir à direita _.reduceRight (list, iteratee, [memo], [context]) |
| 5 | encontrar _.find (lista, predicado, [contexto]) |
| 6 | filtro _.filter (lista, predicado, [contexto]) |
| 7 | Onde _.onde (lista, propriedades) |
| 8 | findWhere _.findWhere (lista, propriedades) |
| 9 | rejeitar _.rejeitar (lista, predicado, [contexto]) |
| 10 | cada _.every (lista, [predicado], [contexto]) |
| 11 | alguns _.algumas (lista, [predicado], [contexto]) |
Underscore.JS tem muitos métodos fáceis de usar que ajudam no processamento de coleções. Este capítulo os discute em detalhes.
Underscore.JS fornece vários métodos para processar as coleções conforme listado abaixo -
| Sr. Não. | Método e Sintaxe |
|---|---|
| 1 | contém _.contains (lista, valor, [fromIndex]) |
| 2 | invocar _.invoke (lista, nome do método, * argumentos) |
| 3 | arranca _.pluck (lista, propertyName) |
| 4 | max _.max (lista, [iteratee], [contexto]) |
| 5 | min _.min (lista, [iteratee], [contexto]) |
| 6 | ordenar por _.sortBy (lista, iteratário, [contexto]) |
| 7 | groupBy _.groupBy (lista, iteratário, [contexto]) |
| 8 | indexBy _.indexBy (lista, iteratário, [contexto]) |
| 9 | countBy _.countBy (lista, iteratário, [contexto]) |
| 10 | embaralhar _.shuffle (lista) |
| 11 | amostra _.sample (list, [n]) |
| 12 | toArray _.toArray (lista) |
| 13 | Tamanho _.size (lista) |
| 14 | partição _.partition (lista, predicado) |
| 15 | compactar _.compact (lista) |
Underscore.JS tem muitos métodos fáceis de usar que ajudam na iteração de Arrays. Este capítulo os discute em detalhes.
Underscore.JS fornece vários métodos para iterar os Arrays conforme listado abaixo -
| Sr. Não. | Método e Sintaxe |
|---|---|
| 1 | primeiro _.first (matriz, [n]) |
| 2 | inicial _.initial (array, [n]) |
| 3 | último _.last (array, [n]) |
| 4 | descansar _.rest (matriz, [índice]) |
| 5 | índice de _.indexOf (matriz, valor, [isSorted]) |
| 6 | lastIndexOf _.lastIndexOf (matriz, valor, [fromIndex]) |
| 7 | SortIndex _.sortedIndex (matriz, valor, [iteratee], [contexto]) |
| 8 | findIndex _.findIndex (matriz, predicado, [contexto]) |
| 9 | findLastIndex _.findLastIndex (matriz, predicado, [contexto]) |
Underscore.JS tem muitos métodos fáceis de usar que ajudam no processamento de Arrays. Este capítulo os discute em detalhes.
Underscore.JS fornece vários métodos para processar as matrizes conforme listado abaixo -
| Sr. Não. | Método e Sintaxe |
|---|---|
| 1 | achatar _.flatten (array, [raso]) |
| 2 | sem _.without (array, * valores) |
| 3 | União _.union (* matrizes) |
| 4 | interseção _.intersection (* matrizes) |
| 5 | diferença _.difference (array, * others) |
| 6 | uniq _.uniq (matriz, [isSorted], [iteratee]) |
| 7 | fecho eclair _.zip (* matrizes) |
| 8 | descompactar _.unzip (array) |
| 9 | objeto _.objeto (lista, [valores]) |
| 10 | pedaço _.chunk (matriz, comprimento) |
| 11 | alcance _.range ([iniciar], parar, [passo]) |
Underscore.JS tem muitos métodos fáceis de usar que ajudam no manuseio de funções. Este capítulo os discute em detalhes.
Underscore.JS fornece vários métodos para lidar com as funções listadas abaixo -
| Sr. Não. | Método e Sintaxe |
|---|---|
| 1 | ligar _.bind (função, objeto, * argumentos) |
| 2 | parcial _.partial (função, * argumentos) |
| 3 | memorizar _.memoize (função, [hashFunction]) |
| 4 | demora _.delay (função, espera, * argumentos) |
| 5 | uma vez _.uma vez (função) |
| 6 | antes _.before (contagem, função) |
| 7 | embrulho _.wrap (função, wrapper) |
| 8 | negar _.negate (predicado) |
| 9 | compor _.compose (* funções) |
Underscore.JS tem muitos métodos fáceis de usar que ajudam no mapeamento de objetos. Este capítulo os discute em detalhes.
Underscore.JS fornece vários métodos para lidar com o mapeamento de objetos, conforme listado abaixo -
| Sr. Não. | Método e Sintaxe |
|---|---|
| 1 | chaves _.keys (objeto) |
| 2 | allKeys _.allKeys (objeto) |
| 3 | valores _.values (objeto) |
| 4 | mapObject _.mapObject (objeto, iteratário, [contexto]) |
| 5 | pares _.pares (objeto) |
| 6 | invertido _.invert (objeto) |
| 7 | crio _.create (protótipo, adereços) |
| 8 | funções _.functions (objeto) |
| 9 | findKey _.findKey (objeto, predicado, [contexto]) |
Underscore.JS tem muitos métodos fáceis de usar que ajudam na atualização de objetos. Este capítulo os discute em detalhes.
Underscore.JS fornece vários métodos para lidar com atualizações de objetos, conforme listado abaixo -
| Sr. Não. | Método e Sintaxe |
|---|---|
| 1 | ampliar _.extend (destino, * fontes) |
| 2 | escolher _.pick (objeto, * chaves) |
| 3 | omitir _.omit (objeto, * keys) |
| 4 | padrões _.defaults (objeto, * defaults) |
| 5 | clone _.clone (objeto) |
| 6 | toque _.tap (objeto, interceptor) |
| 7 | tem _.has (objeto, chave) |
| 8 | propriedade _.property (caminho) |
| 9 | propriedade de _.propertyOf (objeto) |
Underscore.JS tem muitos métodos fáceis de usar que ajudam na comparação de objetos. Este capítulo os discute em detalhes.
Underscore.JS fornece vários métodos para lidar com a comparação de objetos conforme listado abaixo -
| Sr. Não. | Método e Sintaxe |
|---|---|
| 1 | combinador _.matcher (attrs) |
| 2 | é igual _.isEqual (objeto, outro) |
| 3 | isMatch _.isMatch (objeto, propriedades) |
| 4 | está vazia _.isEmpty (objeto) |
| 5 | isArray _.isArray (objeto) |
| 6 | isObject _.isObject (valor) |
| 7 | isArguments _.isArguments (objeto) |
| 8 | isFunction _.isFunction (objeto) |
| 9 | isString _.isString (objeto) |
| 10 | isNumber _.isNumber (objeto) |
| 11 | isFinite _.isFinite (objeto) |
| 12 | isBoolean _.isBoolean (objeto) |
| 13 | isDate _.isDate (objeto) |
| 14 | isRegExp _.isRegExp (objeto) |
| 15 | isError _.isError (objeto) |
| 16 | isSymbol _.isSymbol (objeto) |
| 17 | isMap _.isMap (objeto) |
| 18 | isWeakMap _.isWeakMap (objeto) |
| 19 | isSet _.isSet (objeto) |
| 20 | isWeakSet _.isWeakSet (objeto) |
| 21 | isNaN _.isNaN (objeto) |
| 22 | é nulo _.isNull (objeto) |
| 23 | isUndefined _.isUndefined (valor) |
Underscore.JS tem muitos métodos utilitários fáceis de usar. Este capítulo os discute em detalhes.
Underscore.JS fornece vários métodos utilitários, conforme listado abaixo -
| Sr. Não. | Método e Sintaxe |
|---|---|
| 1 | identidade _.identidade (valor) |
| 2 | constante _.valor constante) |
| 3 | noop _.noop () |
| 4 | vezes _.times (n, iteratee, [contexto]) |
| 5 | aleatória _.random (min, max) |
| 6 | mixin _.mixin (objeto) |
| 7 | iteratário _.iteratee (valor, [contexto]) |
| 8 | ID único _.uniqueId ([prefixo]) |
| 9 | escapar _.escape (string) |
| 10 | unescape _.unescape (string) |
| 11 | resultado _.result (objeto, propriedade, [defaultValue]) |
| 12 | agora _.agora() |
| 13 | modelo _.template (templateString, [configurações]) |
Underscore.JS possui métodos para criar uma cadeia de métodos e, em seguida, recuperar seu resultado efetivo. Este capítulo os discute em detalhes.
Underscore.JS fornece vários métodos utilitários, conforme listado abaixo -
| Sr. Não. | Método e Sintaxe |
|---|---|
| 1 | cadeia _.chain (objeto) |
| 2 | valor _.chain (obj) .value () |