7 Truques úteis de JavaScript

Assim como qualquer outra linguagem de programação, o JavaScript tem dezenas de truques para realizar tarefas fáceis e difíceis. Alguns truques são amplamente conhecidos, enquanto outros são suficientes para impressionar o senhor. Vamos dar uma olhada em sete truques de JavaScript que o senhor pode começar a usar hoje mesmo!

Obter valores exclusivos de uma matriz

Obtendo um matriz de valores exclusivos provavelmente é mais fácil do que o senhor pensa:

var j = [...new Set([1, 2, 3, 3])]
>> [1, 2, 3]

Adoro a mistura de expressão de descanso e Set!

Matriz e booleano

Já precisou filtrar valores falsos (0, undefined, null, false, etc.) de uma matriz? Talvez o senhor não conheça esse truque:

myArray
    .map(item => {
        // ...
    })
    // Get rid of bad values
    .filter(Boolean);

Basta passar Boolean e todos esses valores falsos desaparecerão!

Criar objetos vazios

É claro que o senhor pode criar um objeto que parece vazio com {}, mas esse objeto ainda tem um __proto__ e o habitual hasOwnProperty e outros métodos de objeto. No entanto, há uma maneira de criar um objeto “dicionário” puro:

let dict = Object.create(null);

// dict.__proto__ === "undefined"
// No object properties exist until you add them

Não há absolutamente nenhuma chave ou método nesse objeto que o senhor não tenha colocado lá!

Mesclar objetos

A necessidade de mesclar vários objetos em JavaScript existe desde sempre, especialmente quando começamos a criar classes e widgets com opções:

const person = { name: 'David Walsh', gender: 'Male' };
const tools = { computer: 'Mac', editor: 'Atom' };
const attributes = { handsomeness: 'Extreme', hair: 'Brown', eyes: 'Blue' };

const summary = {...person, ...tools, ...attributes};
/*
Object {
  "computer": "Mac",
  "editor": "Atom",
  "eyes": "Blue",
  "gender": "Male",
  "hair": "Brown",
  "handsomeness": "Extreme",
  "name": "David Walsh",
}
*/

Esses três pontos tornaram a tarefa muito mais fácil!

Parâmetros de função obrigatórios

A possibilidade de definir valores padrão para argumentos de função foi uma adição incrível ao JavaScript, mas veja este truque para exigir valores sejam passados para um determinado argumento:

const isRequired = () => { throw new Error('param is required'); };

const hello = (name = isRequired()) => { console.log(`hello ${name}`) };

// This will throw an error because no name is provided
hello();

// This will also throw an error
hello(undefined);

// These are good!
hello(null);
hello('David');

Essa é uma validação de próximo nível e uso de JavaScript!

Desestruturação de aliases

Desestruturação é um acréscimo muito bem-vindo ao JavaScript, mas, às vezes, preferimos nos referir a essas propriedades por outro nome, de modo que podemos tirar proveito dos aliases:

const obj = { x: 1 };

// Grabs obj.x as { x }
const { x } = obj;

// Grabs obj.x as { otherName }
const { x: otherName } = obj;

Útil para evitar conflitos de nomes com variáveis existentes!

Obter parâmetros da string de consulta

Durante anos, escrevemos expressões regulares grosseiras para obter os valores das strings de consulta, mas esses dias acabaram. URLSearchParams API:

// Assuming "?post=1234&action=edit"

var urlParams = new URLSearchParams(window.location.search);

console.log(urlParams.has('post')); // true
console.log(urlParams.get('action')); // "edit"
console.log(urlParams.getAll('action')); // ["edit"]
console.log(urlParams.toString()); // "?post=1234&action=edit"
console.log(urlParams.append('active', '1')); // "?post=1234&action=edit&active=1"

É muito mais fácil do que costumávamos lutar!

O JavaScript mudou muito ao longo dos anos, mas minha parte favorita do JavaScript atualmente é a velocidade dos aprimoramentos de linguagem que estamos vendo. Apesar da dinâmica de mudança do JavaScript, ainda precisamos empregar alguns truques decentes; mantenha esses truques em sua caixa de ferramentas para quando precisar deles!

Quais são seus truques favoritos de JavaScript?