Inovações ECMAScript
Olá leitores Habr. Trago à sua atenção uma coisa interessante que aparecerá em breve já apareceu no padrão ECMAScript. Já está disponível. quase em todos os navegadores e em todas as funcionalidades também. Essa inovação é apenas um invólucro de açúcar e pode ser resolvida por seus próprios meios, e eu também mostrarei isso. Mas esse açúcar nos permitirá escrever menos código, porque nós o amamos muito. Portanto, funções básicas são adicionadas à matriz, neste caso, existem duas delas, o que nos permitirá expandir matrizes de vários níveis em um ou mais níveis de aninhamento. Sim, sim, e tudo isso como eles dizem fora da caixa
Proposta ECMAScript: Array.prototype. {Flat, flatMap}
Esta proposta já foi conhecida como Array.prototype.flat {ten, Map} . Tem status de estágio . 3 4 do TC39, isto é, já Candidato Terminado Acho que vale a pena se distrair e falar sobre esse TC39 e sobre os padrões que estão familiarizados com podem pular esse retiro. então:
Padrões JavaScript e como é preparado.
ECMAScript
O ECMAScript é um padrão desenvolvido e mantido pela ECMA International . Foi adotado pela Assembléia Geral da Ecma em junho de 1997. Mais especificamente, o ECMAScript é um padrão ECMA-262 chamado de Especificação da Linguagem ECMAScript. O padrão foi criado com base na versão JavaScript original de Brendan Aich, da Netscape e do intérprete Microsoft JScript, mas desde então se desenvolveu significativamente.
JavaScript é uma implementação da especificação ECMAScript . Isso significa que, como a especificação tem novos rascunhos ou edições publicadas, os desenvolvedores de navegadores e estruturas como o Node.js. devem implementar consistentemente novas funcionalidades. Para fazer isso, são feitas alterações nos mecanismos que esses navegadores e estruturas usam para interpretar e executar o código JavaScript.
Por que você precisa de uma especificação? Navegadores diferentes usam diferentes mecanismos JavaScript, por exemplo, V8 no Chrome, SpiderMonkey no Firefox e assim por diante. Ao escrever em JavaScript, você espera que todos os mecanismos em todos os ambientes analisem e executem seu código exatamente da mesma maneira. Sem uma especificação padronizada, qualquer um desses mecanismos seria livre para executar JavaScript como quisesse, obviamente isso não é muito bom.
TC39
O Comitê Técnico Internacional da Ecma 39 (também conhecido como TC39) é um comitê de pessoas muito inteligentes, e também está conectado a um grupo de participantes pela maneira inteligente. Todos eles se reúnem nas reuniões do comitê aproximadamente a cada dois meses e discutem listas de questões pré-preparadas.
O objetivo do TC39 é manter e atualizar a especificação ECMAScript mencionada anteriormente, após discussão e consenso. Isso inclui sintaxe de idioma, semântica, bibliotecas e tecnologias relacionadas nas quais o idioma se baseia.
Este processo é definido pelo TC39. Tudo começa com um rascunho de uma funcionalidade que estende ou altera a especificação. Esses rascunhos geralmente vêm de comunidades de desenvolvedores ou dos próprios membros do TC39. Se a proposta é válida, o rascunho obtém o status de uma proposta oficial.
Então, no caminho da idéia para a publicação, a proposta passa por várias etapas específicas. Eles são numerados de zero a quatro programadores masculinos :
[“Strawman”, “Proposal”, “Draft”, “Candidat”, “Finished”]
Mover para qualquer próxima etapa requer a aprovação do TC39. Se a proposta atingir o estágio 4, pode-se esperar que ela seja incluída na próxima edição oficialmente publicada da especificação do padrão ECMA-262 e, eventualmente, aparecerá em um ambiente que execute JavaScript. Você pode aprender mais sobre esse processo no próprio documento .
Todas as propostas existentes para introdução ao padrão podem ser encontradas aqui no github
Bem, agora vamos mais longe ...
Array.prototype.flat
O método flat () retorna uma nova matriz,
var newArray = arr.flat(depth);
em que todos os elementos aninhados em matrizes foram recursivamente "elevados" para o nível de profundidade especificado.
Um exemplo:
const arr1 = [1, 2, [3, 4]]; arr1.flat();
Há também um efeito colateral: ele remove elementos indefinidos da matriz
Um exemplo:
const arr4 = [1, 2, , 4, 5]; arr4.flat();
Título faça você mesmo
Usamos reduzir e concat
Um exemplo:
const arr1 = [1,2,3,[1,2,3,4, [2,3,4]]]; function flattenDeep(arr1) { return arr1.reduce((acc, val) => Array.isArray(val) ? acc.concat(flattenDeep(val)) : acc.concat(val), []); } flattenDeep(arr1);
Array.prototype.flatMap
O método flatMap () primeiro aplica uma função a cada elemento e, em seguida, converte o resultado em uma estrutura plana e o coloca em uma nova matriz. Isso é idêntico à função map, seguida pelo uso da função flat com um parâmetro de profundidade 1, mas o flatMap geralmente é útil porque funciona um pouco mais eficientemente.
var new_array = arr.flatMap(function callback(currentValue[, index[, array]]) {
callback - Uma função que produz os elementos de uma nova matriz leva três argumentos:
currentValue - O elemento atual da matriz a ser processada.index (opcional) - o índice do item a ser processado na matriz.array (opcional) - a matriz a percorrer.
thisArg (opcional) - o valor usado como este ao chamar a função de retorno de chamada.
Valor de retorno - uma nova matriz, cada elemento resultante da função de retorno de chamada e "elevado" ao nível 1.
exemplo:
[ { x: 1, y: 2 }, { x: 3, y: 4 }, { x: 5, y: 6 } ].flatMap(c => [cx, cy])
Faça você mesmo
var arr1 = [1, 2, 3, 4]; arr1.reduce((acc, x) => acc.concat([x * 2]), []);
Conclusão
Lembre-se de que essa funcionalidade é adicionada ao idioma por um motivo. As razões pelas quais as pessoas inteligentes do TC39 fazem isso estão melhorando a qualidade, abstração, usabilidade e outros idiomas. Aprenda essas inovações com antecedência e, quando forem publicadas e suportadas oficialmente em todos os lugares, você poderá trabalhar imediatamente sem perder tempo. Você também pode se posicionar como um especialista em JavaScript em sua organização, capaz de oferecer novos recursos de idioma que podem melhorar o código e o próprio produto.
ps: enquanto o artigo estava sendo escrito :), a proposta passou para o estágio 4
Array.prototype.{flat,flatMap} até o estágio 4, de 2019.01.29 TC39