Categoria Java Script

porDiego

Declarações (Statements) Java Script

Declarações (Statements) JS

Sabendo disso, quero que saiba que JavaScript é uma linguagem de programação client-side. Ela é utilizada para controlar o HTML e o CSS para manipular comportamentos na página.

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:

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

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

  1. var x = 11;
  2. if (x > 10) {
  3. console.log(‘x é maior do que dez, corram para as colinas!’);
  4. }

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

  1. var x = 9;
  2. if (x > 10) {
  3. console.log(‘x é maior do que dez, corram para as colinas!’);
  4. }
  5. 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.

  1. var x = 9;
  2. if (x > 10) {
  3. console.log(‘x é maior do que dez, corram para as colinas!’);
  4. } else {
  5. console.log(‘Está tudo bem, podemos ficar tranquilos.’);
  6. }

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.

  1. var tinta = ‘azul’;
  2. switch (tinta) {
  3. case ‘azul’:
  4. console.log(‘Irei pintar o carro de azul’);
  5. break;
  6. case ‘amarela’:
  7. console.log(‘Vou pintar a casa de amarelo’);
  8. break;
  9. case ‘verde’:
  10. console.log(‘Vou pintar o chão da garagem de verde’);
  11. break;
  12. default:
  13. console.log(‘Não vou pintar nada’);
  14. break;
  15. }

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:

  1. var tinta = ‘azul’;
  2.  
  3. if (tinta === ‘azul’) {
  4. console.log(‘Irei pintar o carro de azul’);
  5. } else if(tinta === ‘amarela’) {
  6. console.log(‘Vou pintar a casa de amarelo’);
  7. } else if (tinta === ‘verde’) {
  8. console.log(‘Vou pintar o chão da garagem de verde’);
  9. } else {
  10. console.log(‘Não vou pintar nada’);
  11. }

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 é:

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

FOR IN

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

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

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.

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

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).

  1. var x = true;
  2. while(x) {
  3. console.log(‘Jane Doe’);
  4. x = false;
  5. }

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:

  1. var i = 1,
  2. x = 2;
  3.  
  4. while(x < 20) {
  5. x = x + (x * i);
  6.  
  7. console.log(‘O valor atual de x é: ‘ + x);
  8. i++;
  9. }

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.

  1. do {
  2. console.log(‘Jane Doe’);
  3. } while(false);

Nossos Clientes