9 dicas muito úteis sobre JavaScript

Saudações, Habr! Apresento a você a tradução do artigo “9 Hacks JavaScript extremamente poderosos” de Klaus .

Nota tradutor: nesta nova postagem (10 de dezembro), truques interessantes para JavaScript que eu gosto como iniciante, mas também há um anúncio óbvio para o aplicativo de teste. Mas preciso traduzir todo o material, para ocultar a parte da publicidade em um spoiler, embora não seja inútil, a propósito.

Nativo do artigo traduzido
Eu amo otimizar.

Mas os usuários não dão a mínima para o meu código otimizado se o site não funcionar no Internet Explorer 11.

Uso o Endtest para criar testes automatizados e executá-los em uma nuvem entre navegadores.


A propósito, a Netflix usa a mesma plataforma para testar seus aplicativos da web. Além disso, ele é listado como uma habilidade necessária em algumas vagas .

O Endtest realmente possui alguns recursos interessantes, como:

  • Malha entre navegadores em execução em computadores Windows e MacOS
  • Editor sem código para testes automatizados
  • Suporte a aplicativos da Web
  • Suporte para aplicativos nativos e híbridos para Android e iOS
  • Vídeos ilimitados para sua execução de teste
  • Comparação de capturas de tela
  • Geolocalização
  • Se declaração
  • Ciclos
  • Carregar arquivos para seus testes
  • API Endtest, para fácil integração com seu sistema de CI / CD
  • Instruções estendidas
  • Testes móveis em dispositivos móveis reais
  • Testando e-mail com a Endtest Mailbox

Você pode visualizar documentos nesta ferramenta.

E agora existem 9 dicas muito úteis sobre JavaScript.

  1. Substitua tudo


    Sabemos que a função string.replace () substitui apenas a primeira ocorrência. Você pode substituir todas as ocorrências adicionando / g no final da expressão regular.

    var example = "potato potato"; console.log(example.replace(/pot/, "tom")); // "tomato potato" console.log(example.replace(/pot/g, "tom")); // "tomato tomato" 
  2. Recuperando valores exclusivos


    Podemos criar uma nova matriz com apenas valores exclusivos usando o objeto Set e o operador Spread.

     var entries = [1, 2, 2, 3, 4, 5, 6, 6, 7, 7, 8, 4, 2, 1] var unique_entries = [...new Set(entries)]; console.log(unique_entries); // [1, 2, 3, 4, 5, 6, 7, 8] 
  3. Converter número em string


    Nós apenas temos que usar o operador de concatenação com um conjunto vazio de aspas.

     var converted_number = 5 + ""; console.log(converted_number); // 5 console.log(typeof converted_number); // string 
  4. Converter string em número


    Tudo o que precisamos é de um operador +.

    Cuidado com isso, pois ele só funciona com números de string.

     the_string = "123"; console.log(+the_string); // 123 the_string = "hello"; console.log(+the_string); // NaN 
  5. Aleatório de itens de uma matriz


    Todos os dias eu sou shufflin ':-)

     var my_list = [1, 2, 3, 4, 5, 6, 7, 8, 9]; console.log(my_list.sort(function() { return Math.random() - 0.5 })); // [4, 8, 2, 9, 1, 3, 6, 5, 7] 
  6. Suavizar uma matriz multidimensional


    Apenas usando a instrução Spread.

     var entries = [1, [2, 5], [6, 7], 9]; var flat_entries = [].concat(...entries); // [1, 2, 5, 6, 7, 9] 
  7. Condições de atalho


    Vamos pegar este exemplo:

     if (available) { addToCart(); } 

    E você pode reduzi-lo simplesmente usando uma variável junto com a função:

     available && addToCart() 
  8. Nomes de propriedades dinâmicas


    Sempre achei que precisava declarar um objeto antes de poder atribuir uma propriedade dinâmica.

     const dynamic = 'flavour'; var item = { name: 'Coke', [dynamic]: 'Cherry' } console.log(item); // { name: "Coke", flavour: "Cherry" } 
  9. Use o comprimento para redimensionar / limpar a matriz


    Basicamente, reescrevemos o comprimento da matriz.

    Se quisermos redimensionar a matriz:

     var entries = [1, 2, 3, 4, 5, 6, 7]; console.log(entries.length); // 7 entries.length = 4; console.log(entries.length); // 4 console.log(entries); // [1, 2, 3, 4] 

    Se quisermos limpar a matriz:

     var entries = [1, 2, 3, 4, 5, 6, 7]; console.log(entries.length); // 7 entries.length = 0; console.log(entries.length); // 0 console.log(entries); // [] 

As dicas de JavaScript são legais, mas verifique se o aplicativo da Web é executado corretamente em todos os navegadores e dispositivos. Certifique-se de cuidar disso.

Source: https://habr.com/ru/post/pt480398/


All Articles