Declarações (Statements)

Entendendo Controles de Fluxo e Controles de Repetição

Controles de Fluxo

São comandos da linguagem que permitem desviar o fluxo do programa, dependendo de um teste.

IF

A sintaxe do if é a seguinte:

if (<teste>) {
  <código a ser executado caso o teste seja verdadeiro>
}

Podemos, por exemplo, executar um trecho do código unicamente se uma variavel nossa for maior do que dez.

var x = 11;
if (x > 10) {
  console.log('x é maior do que dez, corram para as colinas!');
}

Note, que o console.log não apareceria caso o valor de x fosse 10, 9, 8...

var x = 9;
if (x > 10) {
  console.log('x é maior do que dez, corram para as colinas!');
}
console.log('Serei executado independente do if ser true ou false');

ELSE

o else não existe sem o if, pois ele não testa nada. Só é executado caso o teste do if retorne falso.

var x = 9;
if (x > 10) {
  console.log('x é maior do que dez, corram para as colinas!');
} else {
  console.log('Está tudo bem, podemos ficar tranquilos.');
}

SWITCH

O switch é uma estrutura para testes simples, muito usado quando temos que testar uma mesma condição diversas vezes, pois é mais legível do que uma cadeia de else if.

var tinta = 'azul';
switch (tinta) {
  case 'azul':
    console.log('Irei pintar o carro de azul');
    break;
  case 'amarela':
    console.log('Vou pintar a casa de amarelo');
    break;
  case 'verde':
    console.log('Vou pintar o chão da garagem de verde');
    break;
  default:
    console.log('Não vou pintar nada');
    break;
}

Note que para cada uma das cores, eu farei uma coisa completamente diferente da outra. Caso a tinta seja verde, eu vou pintar o chão da garagem, mas se a tinha for amarela, irei pintar a casa.

Se fossemos reescrever esses testes com elseif, ficaria assim:

var tinta = 'azul';

if (tinta === 'azul') {
  console.log('Irei pintar o carro de azul');
} else if(tinta === 'amarela') {
  console.log('Vou pintar a casa de amarelo');
} else if (tinta === 'verde') {
  console.log('Vou pintar o chão da garagem de verde');
} else {
  console.log('Não vou pintar nada');
}

Fica melhor com o switch, ne?!

Laços de repetição (loops)

Se existe uma coisa que os computadores são muito bons é em executar algo várias vezes. Desde que saibamos o que queremos que o computador faça. Felizmente, para não precisamos repetir inúmeras vezes a invocação de uma função ou certo código, existe os loops (laços de repetição).

FOR

Formado por três partes: inicialização, condição e incremento. A sintaxe é:

for (var i = 0; i <= 10; i++) {
  //código a ser executado até a condição se tornar falsa
}

FOR IN

É utilizado quando não sabemos quantas vezes temos que interar sobre um array ou objeto.

var arr = [1,2,3];
for(var n in arr) {
  console.log(n);
}

FOREACH

Utilizamos o foreach quando queremos percorrer as propriedades de um objeto ou os itens de um array, sem precisamos nos preocupar em contar quantos são.

var arr = [1,2,3];
arr.forEach(function(each){
  console.log(each);
});

WHILE

Funciona basicamente igual ao for, e é possível sempre trocar o for() por um while(). Escolhemos um ou outro pela clareza do que estamos fazendo. Geralmente preferimos utilizar o loop for() para interar com contadores e loops while() até que alguma condição mude (de true para false, por exemplo).

var x = true;
while(x) {
  console.log('Jane Doe');
  x = false;
}

Nesse caso acima, o console.log será executado uma única vez, pois eu altero para false a variavel x, logo na primeira interação do laço. Mas eu poderia ter feito algo assim:

var i = 1,
    x = 2;

while(x < 20) {
  x = x + (x * i);

  console.log('O valor atual de x é: ' + x);
  i++;
}

DO WHILE

Segue o mesmo princípio do while, mas o corpo é sempre executado pelo menos uma vez, independente da condição, pois primeiro ele faz do e depois testa a condição.

do {
  console.log('Jane Doe');
} while(false);

Apesar da condição já começar como falsa, veremos a string "Jane Doe" uma vez no console do browser.