O que é JavaScript? - Guia do iniciante

O que é JavaScript? - Guia do iniciante
Para desenvolvedores da web, HTML e CSS estavam lá para exibir conteúdo no site e fazer com que pareça esteticamente agradável. Mas eles não conseguiram lidar com a interatividade das páginas da web. Para esse fim, outro idioma foi necessário, especificamente para lidar com o aspecto de programação do seu site. Para que isso possa lidar com o comportamento dinâmico e interativo do seu site.

Portanto veio JavaScript. É um dos mais populares linguagens de script Esse trabalho no lado do cliente Para lidar com a interatividade da sua página da web. Além disso, pode aumentar o comportamento dinâmico do site manipulando o conteúdo que recebe do servidor da web. Há um monte de coisas que o JavaScript pode fazer, aprenderemos neste artigo, juntamente com como funciona e alguns conceitos básicos.

Várias funções que você pode fazer com JavaScript:

  • Modifique o conteúdo da página da web adicionando e removendo os elementos.
  • Monitore vários cliques de mouse, pauram eventos e lida com suas ações.
  • Controlar várias animações e transições.
  • Manuseio de eventos quando um usuário insere alguma entrada.
  • Validar a entrada que o usuário fornece antes de enviar ao servidor.

E muito mais, você pode controlar como sua página se comporta.

Por que aprender JavaScript?

JavaScript foi considerado uma ferramenta apenas para páginas da web interativas. Mas esses dias se foram e agora você pode criar aplicativos móveis e web completos, bem como aplicativos de rede usando várias estruturas fornecidas pela JavaScript.

Você também pode projetar jogos de navegador com JavaScript. Está crescendo outros idiomas e empresas famosas estão construindo suas aplicações em torno de JavaScript. Agora, você sabe a importância de aprender JavaScript, então vamos ver como funciona.

Editor de código JavaScript

Para o código JavaScript, você pode usar o console do navegador ou mesmo os editores JS online. Mas é melhor usar os editores de código. Existem vários editores de código por aí, como código do Visual Studio, texto sublime, átomo e muito mais, você pode verificar vários editores JavaScript disponíveis neste artigo. Destes, o código do Visual Studio é altamente recomendado, pois é o editor de código mais usado, e o raciocínio por trás disso é seu suporte constante para as próximas tecnologias e a interface de usuário fácil de usar.

Como adicionar JavaScript ao seu arquivo?

Existem duas maneiras de adicionar JavaScript ao seu arquivo HTML:

Script interno (Configurando o JavaScript dentro do arquivo html usando tag)

Script externo (Criando um arquivo separado para o código JS e adicionando o link na tag

consol.registro, alertas e documentos.Escreva em JavaScript

Um comando útil para depurar e registrar seu código é console.registro. É útil escrever conteúdo indiretamente no console da web.

console.log ("Hello World");

Alertas são usados ​​para fornecer alertas ao usuário final que está acessando a página da web.

Alerta ("Hello World");

Documento.escrever Modifica o conteúdo na página da web adicionando conteúdo adicional à sua página da web.

documento.Escreva ("Bem -vindo à página da web!");

Em JavaScript, o console tem vários métodos. Mais informações detalhadas estão aqui.

Como adicionar comentários no JavaScript

Durante a programação, os comentários de escrita são extremamente úteis. Ajuda a lembrar o que você codificou e se houver alguma informação extra que você precisa escrever para a outra pessoa que está verificando seu código. Ambos solteiro e múltiplo Comentários de linha podem ser escritos. Para usar um comentário de linha única no código (javascript), usamos //:

// toda essa frase é um grande comentário de linha única.

Considerando que, no caso de múltiplas comentários de linha, use / * no implorando e feche -o usando * /:

/* Este é um comentário de várias linhas. Você pode até seu blog aqui, se quiser. */

Variáveis ​​em JavaScript

Assim como em qualquer outra linguagem de programação, as variáveis ​​também são usadas em JavaScript. O trabalho de uma variável é manter um tipo de dados em uma referência nomeada. Em JavaScript, podemos definir variáveis ​​usando três maneiras: var, deixar, const.

O var é usado desde o início do JavaScript e é escopo globalmente, o que significa que todas as funções nessa página ou nesse programa podem acessá -lo.

var x = 15;
var y = 4;
console.log (x + y);

Saída:

Porque é globalmente escopo, é melhor usar deixar e const. O motivo é que às vezes você deseja declarar uma variável em uma declaração IF e fora disso, se você deseja declarar a variável com o mesmo nome. O uso do VAR causará problemas. Para entender mais sobre variáveis ​​globais em JavaScript, você pode verificar este artigo.

Os dois tipos restantes de variáveis ​​disponíveis no JavaScript são deixar e const. Usando Let, podemos declarar qualquer tipo de dados, enquanto que, no caso de const, apenas valores constantes são declarados.

deixe msg = "Hello World";
console.log (msg);
msg = 10;
console.log (msg);

Saída:

Aqui, declaramos uma string e um tipo de dados numéricos usando a variável Let. Agora, usando const, se tentarmos declarar qualquer valor que não seja constante, isso nos dará um erro.

// abaixo causará um erro.
const pi = 3.142;
console.log (pi);
pi = 3.15;
console.log (pi);

Tipos de dados em javascript

JavaScript nos fornece vários tipos de dados, como Números, Cordas, Booleanos, Flutuador, Objetos, e mais. Se você quiser ler sobre os tipos de dados em JavaScript, poderá ir para o MDN Docs oficial. Ele informa ao programa com que tipo de dados eles estão trabalhando e manipulando.

Número: O tipo de dados para representar um número inteiro positivo e negativo ou o ponto flutuante é o número.

deixe num = 11;
console.log (num);
console.log (tipo de num);
num = -12;
console.log (num);
console.log (tipo de num);

Saída:

Corda: Para armazenar uma sequência de caracteres, o tipo de dados da string é usado.

Seja x = "Bem -vindo"
console.log (x);
console.log (tipo de x);

Saída:

boleano: Um tipo de dados que representa valores verdadeiros e falsos em um programa.

Seja x = verdadeiro
console.log (x);
console.log (tipo de x);

Saída:

Objetos: Para armazenar a coleta de vários tipos de dados em uma única variável, os objetos são usados.

Deixe o filme =
Nome: "Início",
Gênero: "Thriller",
Ano Ofrelease: "2010",
NumberOfCopies: 10
;
console.log (filme);
console.log (tipo de filme);

Saída:

Matrizes em JavaScript

Para armazenar a coleta de dados de qualquer tipo, podemos usar matrizes. Simplesmente inicialize a matriz usando o construtor da matriz:

deixe meses = new Array ();

Ou com [] Inicialização:

deixe meses = [];

Ou simplesmente criar uma matriz com dados explícitos:

deixe meses = ["janeiro", "fevereiro", "março", "abril", "maio"];

O índice na matriz começa com zero e, para acessar qualquer elemento que você simplesmente precise escrever Array [Indexposition]:

deixe meses = ["janeiro", "fevereiro", "março", "abril", "maio"];
console.log (meses [3]);

Saída:

Para entender melhor o conceito de matriz em JavaScript, verifique este artigo.

Métodos para diferentes tipos de dados em JavaScript

Vários métodos estão disponíveis para manipular os valores de vários tipos de dados.

Métodos de string: Para modificar os valores de uma string, existem inúmeros métodos diferentes disponíveis para nós. Eles podem ser usados ​​para verificar o comprimento de uma string, encontre a posição de uma determinada palavra em uma string ou convertê -la em diferentes tipos de dados.

Seja x = "Olá, bem -vindo em casa"
// Para verificar o comprimento da string
console.log (x.comprimento);
// Para cortar uma parte específica da corda
console.log (x.fatia (3, 7));
// para substituir uma palavra específica em uma string
console.log (x.substituir ("home", "aqui"));
// para converter string em letras minúsculas
console.log (x.tolowerCase ());

Saída:

Obviamente, existem vários outros métodos, se você quiser saber mais, verifique este artigo também.

Métodos numéricos: Da mesma forma para manipular o valor de um tipo de dados numéricos, existem vários métodos. Alguns deles são fornecidos abaixo:

Seja x = 4445.4
// para converter números em uma string
console.log (x.para sequenciar);
// para converter o número em seu console de formulário exponencial.log (x.toExponencial ());
// retorna o número com comprimento especificado
console.log (x.toprecision (2));

Saída:

JavaScript nos fornece métodos para objetos, booleanos, matrizes e muito mais.

Condições em JavaScript

Outra parte fundamental da programação é tomar decisões e causar algumas ações baseadas nessas decisões. Isso pode ser feito através de declarações condicionais em JavaScript. Você pode usar:

Se ... mais:

Deixe o equilíbrio = 1200;
if (equilíbrio < 1000)

console.log ("Balance menor que 1000");

outro

console.log ("Balance mais de 1000");

Saída:

Se ... senão se… mais:

Deixe o equilíbrio = 1200;
if (equilíbrio <1000)
console.log ("Balance menor que 1000");
else if (Balance> 1000 && Balance <1500)
console.log ("Balance entre 1000-1500");
else console.log ("Balance mais de 1500");

Saída:

Trocar:

Seja alfabet = 'b';
Switch (alfabeto)

caso 'a':
console.log ("ovo");
quebrar;
caso 'b':
console.log ("manga");
quebrar;
padrão:
console.log ("chá!");

Saída:

Para entender melhor o tópico, você pode verificar esses artigos de if-else e alternar declarações condicionais em detalhes.

Loops em JavaScript

Até que uma certa condição seja atendida. Os loops continuam repetindo um pedaço de código (pode ser um JavaScript de linha única e até múltipla) que o JavaScript prevê, enquanto, do-while, e para cada loop. Aqui está como eles funcionam junto com exemplos:

Para loop

Ele se arrasta através de um determinado código várias vezes.

para (vamos i = 0; i < 10; i++)

console.log (i + "");

Saída:

Você pode entender o conceito e o trabalho disso através deste artigo.

Enquanto loop

Loops através de um código especificado dado até que as condições fornecidas sejam atendidas.

deixe i = 0;
enquanto eu <4 )

console.log (i + "");
i ++;

Saída:

Faça enquanto loop

Semelhante ao while loop, há um loop de fazer-. Difere nesse aspecto que aqui pelo menos o loop será executado uma vez. O motivo é que as condições são verificadas no final do loop.

deixe i = 0;
fazer

console.log (i + "");
i ++;
enquanto eu < 3);
Saída:

Saída:

Para cada loop

Para itera sobre uma coleção como matrizes, pois cada loop é usado.

Deixe a letra = ["m", "a", "n", "g", "o"];
carta.para cada(
função (entrada)

console.log (entrada + "");

);

Saída:

Isso é apenas para lhe dar um entendimento básico. Se você quiser entender isso em profundidade, verifique este artigo ou para entender o loop for-in, você também pode verificar este artigo.

Funções em JavaScript

As funções são blocos de código que são atribuídos para executar alguma tarefa. Por exemplo, você deseja que uma mensagem seja exibida quando clicar em um botão. Então isso acontecerá através do uso de funções. Para entender o conceito em detalhes, você pode verificar este artigo.

Aqui está uma demonstração de como funciona:

adição de função (i, j = 5)

retornar i + j;

deixe resultado = adição (3,5);
console.log ("add (3,5) é" + resultado);

Saída:

No exemplo acima, dois números foram transmitidos para a função da adição () e foram armazenados no resultado variável.

O JavaScript nos fornece vários tipos de dados, funções, métodos e mais profunda. Estes são extremamente úteis e facilitam a compreensão do programa. Existem muitas maneiras de aprender JavaScript, através de livros, bem como através de recursos online.

Conclusão:

No guia de hoje, aprendemos o básico do JavaScript. JavaScript se tornou nada menos que essencial para páginas da web interativas e atraentes. Atualmente, o JavaScript nos fornece várias estruturas que até nos ajudam a desenvolver aplicativos da Web e móveis. Os desenvolvedores também estão criando jogos de navegador usando JavaScript.

Com o aumento da demanda por JavaScript, os recursos para aprender o idioma também estão aumentando. Você pode aprender através de tutoriais on -line, cursos ou mesmo através de livros. Mas, não importa qual seja o seu meio de aprender, a única coisa que faz de você um especialista está praticando.