Sábado, 20 de Abril de 2024

 Home
 Links
 Soluções
 Utilitários
 Publicações
 Curiosidades
 Produtos
 Notícias
 Diversões
 Contato
 Mapa do Site
 Sobre Nós

©2024 CJDinfo®
 Dicas JavaScript

O Texto abaixo contém várias dicas que visam facilitar a depuração e testes do código em JavaScript. Este texto tem como premissa que o leitor já conheça a linguagem de programação.


O Ponto e Vírgula

A linguagem JavaScript é um pouco mais flexível do que a linguagem-mãe que lhe deu origem, que foi o "C". Tanto que ela permite a construção de códigos sem a necessidade da utilização do Ponto-e-Vírgula (";") no final das linhas de comando.

Porém, em certas ocasiões, a não utilização dele deixa o código incerto, pois não se sabe exatamente o que máquina irá executar.

Dessa forma, o conselho aqui é SEMPRE UTILIZAR O PONTO-E-VIRGULA no final de cada linha de comando, obedecendo as regras de sintaxe da linguagem.

Não estão incluídas as linhas de comando que foram agrupadas em mais de uma linha com as Chaves ("{" e "} ").

Dessa forma são válidas as sequências abaixo:

    if (s != "") Valide(s);
Ou:
    if (s != ""){
      Valide(s);
    }

Note que o "if" executa o primeiro comando após a comparação. Pode ser apenas um comando terminado com o ";" ou um bloco de vários comandos dentro de chaves. Repare que cada comando individual dentro das chaves requer um ";", mas o final da chaves não requer.

A utilização de comandos de "if" com "else" onde são executados apenas um comando no "if" e no "else" podem dar problemas de interpretação de sintaxe, dependendo do caso. Para não correr riscos, prefira a utilização das chaves, mesmo que seja para alojar apenas um comando, como no segundo exemplo acima.


Casos Perigosos

A utilização em excesso do ponto-e-vírgula pode provocar danos da mesma forma que a não utilização. Analise os casos abaixo:

A)
    if (i == 10);
      {
      i = 0;
      }
B)
    for(i=1; i<=10; i++);
      {
      alert("Teste");
      }
C)
    i = 1;
    while(i<=10);
      {
      alert("Teste");
      i++;
      }

Comentários:

A) Ao contrário do que se possa analisar a primeira vista, a variável "i" será sempre zerada, pois o comando "if" terminou no ponto-e-vírgula. O bloco de comandos entre as chaves se tornou "apenas um bloco de comandos", algo perfeitamente possível pela linguagem "C"/Java.

B) Da mesma forma o alert "Teste" só será executado apenas uma vez, pois o comando "for" terminou no ponto-e-vírgula.

C) Este é um caso muito pior! O Comando while também terminou no ponto-e-vírgula. Porém, como o incremento da variável de comparação não está sendo executado, este código se tornou um "Loop Infinito"!


Endentação

Pode parecer algo simples demais, mas a endentação correta facilita, e MUITO, a depuração do código. Principalmente se este tiver vários "if" com "else".

O primeiro fator a observar é a largura do dente. Ela deve ser a mesma em todo o código. Uma largura boa de dente para a linguagem "C"/Java é de 2 a 4 caracteres (Dois a quatro espaços em branco).

O segundo fator é a maneira de se alinhar o código. Da mesma forma que a largura do dente, deve ser mantida a mesma maneira em todo o código. Veja abaixo quatro tipos diferentes de endentação e os comentários:

A)
    // Se contador alcançar limite, zera-o:
    if (i == 10){
      i = 0; }
    else {
      i++;
      n--; }
B)
    // Se contador alcançar limite, zera-o:
    if (i == 10)
    {
      i = 0;
    }
    else
    {
      i++;
      n--;
    }
C)
    // Se contador alcançar limite, zera-o:
    if (i == 10)
      {
      i = 0;
      }
    else
      {
      i++;
      n--;
      }

D)
    // Se contador alcançar limite, zera-o:
    if (i == 10){
      i = 0;
    } else {
      i++;
      n--;
    }

Comentários:

A) Esta maneira é a que consome menos espaço vertical, porém deixa o código excessivamente compacto e de difícil compreensão na hora da depuração. Perde-se facilmente o controle do abrir e fechar de chaves. É o menos recomendado.

B) Deste modo o código fica bem distribuído, porém numa sequência longa de "if" pode ficar difícil descobrir que comando está sobre qual "if", dado o desalinhamento das chaves, em relação ao comando.

C) Semelhante ao de cima, porém com as chaves alinhadas aos comandos. Em situações de várias endentações sucessivas isso facilita bastante a compreensão do código.

D) Esta é o modelo usado para a programação java®. É um meio termo que consome menos espaço vertical que o modelos B e C e permite uma razoável compreensão do código.


Variáveis

Ao contrário do "C/C++" onde as variáveis devem ter o seu tipo perfeitamente definido no JavaScript todas as variáveis são do tipo "Variant", que aceitam qualquer tipo de dado, se "moldando" da melhor maneira.

Vale observar que apesar de aceitar qualquer tipo de dado de entrada e se moldar automaticamente na saída, as variáveis do tipo "Variant" mantém a característica da carga inicial. Dessa forma, nas linhas abaixo:

    var a = 3;

Ou:

    var a = "3";

Carregam respectivamente a variável "a" com o número 3 e com a string "3".

Isso pode não fazer diferença, mas a utilização de comandos string como o substr sobre a primeira variável provocaria erro. Além disso, como no "C++" o Java permite a sobrecarga de comandos, como o comando soma ("+"). Ele pode valer tanto para somar números, como para concatenar strings.

Dessa forma os exemplos abaixo:

A)
    var a = 2;
    var b = 3;

    alert(a);
    alert(b);
    alert(a+b);
B)
    var a = "2";
    var b = "3";

    alert(a);
    alert(b);
    alert(a+b);


Resultam em:

A) Serão apresentados três pop-ups seguidos, contendo: "2", "3" e "5"

B) Serão apresentados três pop-ups seguidos, contendo: "2", "3" e "23"

Caso houvesse a necessidade de fazer o segundo caso gerar também o número "5", bastaria utilizar o comando parseInt(sNum, 10), que converte o conteúdo numérico da string dada para inteiro, assim como o parseFloat(sNum) converte para Número em Ponto Flutuante.

Note que o parseInt foi usado com 2 parâmetros. Esta é a maneira mais segura de chamá-lo. O segundo parâmetro é a base em que será feita a conversão do número. Quando a string numérica a ser convertida começa com "0" (zero) este comando tem o péssimo hábito de assumir base octal. Por isso coloque o ", 10" para indicar base decimal.


Caixa (Case)

A utilização de caracteres Maiúsculos e Minúsculos na linguagem JavaScript é algo crucial. Os comandos só funcionam se digitados da maneira correta. A composição de caixa alta/baixa deve ser mantida à risca.

Um exemplo é o comando citado no item anterior, o parseInt( ). As sintaxes "parseint", "Parseint", "ParseInt"ou "PARSEINT" são inválidas!

Para piorar existem comandos que aceitam a sintaxe errada, porém não executam o desejado, pois trata-se de outro comando ou propriedade. Um exemplo disso é a propriedade "value" de um text-box. Ela retorna ou carrega o conteúdo do campo. Porém a propriedade "Value" também existe, permite leitura e escrita, mas não carrega o conteúdo do campo.

Por isso é bom tomar MUITO cuidado ao digitar os comandos. Na dúvida, consulte o MSDN Microsoft®, que contém no help de cada função a sintaxe adequada a ela (procure o Tópico "JScript Language Reference").


Nomes de Objetos

Os objetos de Tela ou de página podem ser referenciados de várias maneiras no Java Script, porém, dependendo do browser, uma ou outra maneira pode não ser interpretada corretamente.

A melhor maneira de se referenciar é utilizar a sintaxe completa de acesso, ou seja:

    document.form.objeto.propriedade

onde:

document Fixo. Todo em minúsculo. Refere-se à página atual.
form Deve ser substituido pelo Nome exato do <FORM> definido na página,
dentro do qual o objeto deverá estar definido.
objeto Nome exato do objeto definido na página.
propriedade Nome exato da propriedade que se queira referenciar do objeto.


¤ Links Relacionados:
- Radio e Check Button
- Conversão de Bases

  Retornar