DEV Community

Grazielle Café ☕️
Grazielle Café ☕️

Posted on

👩‍💻 Lógica de Programação e Algoritmos com Javascript - Parte 1

Javascript

A linguagem Javascript foi criada pela Netscape Communications Corporation junto com a Sun Microsystem. Sua primeira versão foi criada em 1955. Em 1996, a Netscape decidiu entregar o Javascript para a ECMA (European Computer Manufacturers Association). A Ecma é uma associação dedicada a padronização de sistemas de informação. Por isso, a linguagem Javascript também é chamada ECMAScript e suas versões da linguagem estão associadas a esse nome. Atualmente destacam-se as versões ECMAScript 6 e ECMAScript 7.

O Javascript possui um importante papel no processo de desenvolvimento para páginas web, junto com o HTML e CSS. O HTML serve para descrever o conteúdo de uma página web e definir a marcação semântica (significado) dos elementos que compõem a página. O CSS determina os estilos e a formatação dos elementos, ou seja, utiliza-se o CSS para definir a aparência do site - cores, bordas, espaçamentos, etc. É a apresentação da página em si, cuja implementação geralmente fica aos cuidados do Web Designer. Já a linguagem Javascript é utilizada para definir o comportamento dos elementos da página.

Editores de Código

Para criar programas Javascript, podemos utilizar editores simples que já estão instalados no computadores (como o bloco de notas). Mas acho ser interessante, para de acordo com o seu desenvolvimento em códigos utilizar uma IDE. Recomendo uma que estão sendo mais usadas, a VSCode, que você pode baixar por aqui. Outros conhecidos são Sublime e Netbeans.


Lógica de Programação

Neste primeiro tópico, iremos abordar alguns conceitos importantes para a compreensão da lógica de programação, tais como: conceitos de variantes, partes que compõem um programa (entrada, processamento de dados e saída), estruturas de condições, repetições, manipulação de listas de dados (vetores) e outras técnicas.

Variáveis e constantes

As variáveis são espaços alocados na memória do computador que permitem guardar informações e trabalhar com elas - como o valor que o cliente deseja sacar no terminal do caixa eletrônico.

Como o nome sugere, os valores armazenados em uma variável podem ser alterados durante a execução do programa. São exemplos de uma variáveis manipuladas em um programa: a descrição, a quantidade e o preço do produto, ou então o nome, altura e idade de uma pessoa.

Em Javascript os nomes das variáveis não podem:

  1. Conter espaços;
  2. Começar por número;
  3. Conter caracteres especiais;
  4. Utilizar nomes de palavras reservadas de linguagem, como function, var, new, for, ou return.

Exemplos para variáveis: primeiroCliente, novoSalario, precoFinal.

Para declarar uma variável em Javascript usa-se

var nome; 
Enter fullscreen mode Exit fullscreen mode

Para que uma variável receba um dado, utiliza-se o conceito de atribuição.

var idade = 18; 
Enter fullscreen mode Exit fullscreen mode

As novas versões dos navegadores web permitem a declaração de constantes. Diferente das variáveis, uma constante não pode ter o seu conteúdo alterado no decorrer do programa.

const poltronas = 140; 
Enter fullscreen mode Exit fullscreen mode

Condições

Diversas são as situações em que um programa que é necessário criar uma condição para indicar qual tarefa deve ser executada. Os comandos if, else e switch ... case são os responsáveis por criar condições em Javascript.

If ... else

Eles são úteis para facilitar a compreensão do fluxo dos comandos em uma estrutura de controle.

Para criar uma estrutura clássica, utilizamos os comandos if... else (se, senão). Eles possuem algumas variações. É possível utilizar apenas o if (para apresentar uma mensagem caso o cliente seja menor de idade, por exemplo). E também criar comandos com else (para verificar a classificação etária de um aluno de natação, que poderia ser infantil, juvenil ou adulto).

// define uma condição simples 
if (condição){
   comandos; 
} 

// define uma condição de if ... else 
if (condição){
   comandos V; 
} else { 
   comandos F;
}

//define múltiplas condições 
if (condição 1){
   comandos 1; 
} else if{
   comandos 2; 
} else {
   comandos 3; 
}
Enter fullscreen mode Exit fullscreen mode

Operadores relacionais

Símbolo Significado
== Igual. Retorna verdadeiro caso os dados contenham o mesmo conteúdo
!= Diferente. Retorna verdadeiro caso os dados contenham conteúdos diferentes
> Maior. Também podem ser realizadas comparações de números ou palavras.
> Menor. Também podem ser realizadas comparações de números ou palavras.
>= Maior ou igual. Os simbolos devem ser nesta ordem (>=)
<= Menor ou igual. Tenha cuidado com a ordem dos símbolos (<=)

Operadores lógicos

Símbolo Significado
! Not. Indica negação. Inverte o resultado de uma comparação
&& And. Indica conjunção. Retorna verdadeiro quando todas as comparações forem verdadeiras.

Switch ... Case

As linguagens de programação dispõem de outra estrutura que permite criar condições. Trata-se do comando ** switch ... case **. Ele é útil quando várias alternativas definidas a partir do conteúdo de uma variável.

** Exemplo para Switch ... Case **

<script> 
  var bairro = prompt('Bairro de entrega'); 
  var taxaEntrega; 

  switch(bairro){
    case 'Centro': 
    taxaEntrega = 5.00; 
    break; 

    case 'Três Vendas':
    taxaEntrega = 7.00; 
    break; 

    case 'Laranjal': 
    taxaEntrega = 8.00; 
    break; 
  }

alert('Taxa R$: ' + taxaEntrega.toFixed(2));
</script>
Enter fullscreen mode Exit fullscreen mode

Repetições

As estruturas de repetição permitem fazer com que um ou mais comandos em um programa sejam executados várias vezes. Essas estruturas, também denominadas laços de repetições ou loops, complementam a programação sequencial e a programação condicional.

Laços for

A sintaxe do comando for é composta por três instruções, que definem:
a) O valor inicial da variável de controle;
b) a condição que determina se a repetição deve ou não continuar;
c) o incremento ou decremento da variável de controle.

´´´
for (var i =1; i <= 10; i++){
comandos;
}


#### Laços while 
Um laço de repetição também pode ser criado com o comando **while**, que realiza um teste condicional logo no seu início, para verificar se os comandos do laço serão ou não executados. 

´´´
while (condição){
   comandos;
}
Enter fullscreen mode Exit fullscreen mode

Laços do ... while

do{
   comandos; 
} while (condição); 
Enter fullscreen mode Exit fullscreen mode

Uma sutil, porém importante, diferença entre as estruturas de repetição while e do ... while é que o comando while, a condição é verificada no início, enquanto com o comando do ... while a condição é verificada no final.


Com este post foi possível revisar alguns conteúdos básicos de programação com Javascript! Nos próximos posts, abordaremos sobre paradigma de programação, programação síncrona e assíncrona, declaração de objetos e muito mais 😀!

Top comments (1)

Collapse
 
fabriciadiniz profile image
Fabrícia Diniz

adorei o artigo, inclusive achei muito chique você incluir até tabelas.
Já tô no aguardo dos próximos