Array comprehensions

A sintaxe de array comprehension trata-se de uma expressão JavaScript que lhe permite rapidamente montar um novo array com base em outro já existente. As comprehensions já existem em várias outras linguagens e estarão então presentes no padrão ECMAScript 7.

Veja abaixo as diferenças para a antiga implementação no SpiderMOnkey, baseado nas propostas para o ECMAScript 4.

[for (x of iterable) x]
[for (x of iterable) if (condition) x]
[for (x of iterable) for (y of iterable) x + y]

Dentro de array comprehensions dois tipos de components são permitidos: 

• for...of e
• if

A iteração por for-of deve sempre, ser a primeira componente. Multiplos for-of ou ifs podem  também ser permitidos.

[for (i of [ 1, 2, 3 ]) i*i ];
// [ 1, 4, 9 ]

var abc = [ "A", "B", "C" ];
[for (letters of abc) letters.toLowerCase()];
// [ "a", "b", "c" ]

var years = [ 1954, 1974, 1990, 2006, 2010, 2014 ];
[for (year of years) if (year > 2000) year];
// [ 2006, 2010, 2014 ]
[for (year of years) if (year > 2000) if(year < 2010) year];
// [ 2006], the same as below:
[for (year of years) if (year > 2000 && year < 2010) year];
// [ 2006]

Um modo fácil de entender a sintaxe de array comprehension é comparar com os métodos map e filter:

var numbers = [ 1, 2, 3 ];

numbers.map(function (i) { return i * i });
[for (i of numbers) i*i ];
// both is [ 1, 4, 9 ]

numbers.filter(function (i) { return i < 3 });
[for (i of numbers) if (i < 3) i];
// both is [ 1, 2 ]

Utilizando dois iteradores for-of, com dois arrays:

var numbers = [ 1, 2, 3 ];
var letters = [ "a", "b", "c" ];

var cross = [for (i of numbers) for (j of letters) i+j];
// [ "1a", "1b", "1c", "2a", "2b", "2c", "3a", "3b", "3c" ]

var grid = [for (i of numbers) [for (j of letters) i+j]];
// [
//  ["1a", "1b", "1c"],
//  ["2a", "2b", "2c"],
//  ["3a", "3b", "3c"]
// ]

[for (i of numbers) if (i > 1) for (j of letters) if(j > "a") i+j]
// ["2b", "2c", "3b", "3c"], the same as below:

[for (i of numbers) for (j of letters) if (i > 1) if(j > "a") i+j]
// ["2b", "2c", "3b", "3c"]

[for (i of numbers) if (i > 1) [for (j of letters) if(j > "a") i+j]]
// [["2b", "2c"], ["3b", "3c"]], not the same as below:

[for (i of numbers) [for (j of letters) if (i > 1) if(j > "a") i+j]]
// [[], ["2b", "2c"], ["3b", "3c"]]

• let como um idenficador não é suportado, assim let está recentemente disponível somente para JS versão 1.7 e tags de scripts XUL.
• Destruturação em comprehensions ainda não é suportado (bug 980828).

• Comprehensions no ES7 criam um escopo para cada nó de for ao invés da comprehension toda
  • Antigo: [()=>x for (x of [0, 1, 2])][1]() // 2
  • Novo: [for (x of [0, 1, 2]) ()=>x][1]() // 1, cada iteração cria uma nova binding para o x.
• Comprehensions no ES7 iniciam com for ao invés de expressão de assinalamento.
  • Antigo: [i * 2 for (i of numbers)]
  • Novo: [for (i of numbers) i * 2]
• Comprehensions no ES7 podem ter multiplos if e for.
• Comprehensions no ES7 funcionam apenas com for...of e não com iterações for...in.

• for...of
• Generator comprehensions