SdevLab – Curso | Aprenda JavaScript ECMA-262 Online

Fala galera,

Hoje apresento um curso de JavaScript (ECMA-262). A história é a mesma das publicações anteriores: os posts são o resultado de um material didático que preparei para um curso que ministrei na época da faculdade. Então, vou postar mais alguns cursos aqui nos próximos dias!

OBS: O “curso” foi planejado para autodidatas, não é como na sala de aula que quando você não entende pode simplesmente levantar a mão e fazer uma pergunta. Aqui no nosso curso quem não entender algo, pode (e deve) usar o recurso do comentário!

Curso de JavaScript ECMA-262

javascript

Aulas do Curso

Para quem estiver interessado, segue abaixo um roteiro de tutoriais que foi preparado para quem não entende nada do assunto e deseja saber o básico da linguagem (o curso é referente a recomendação ECMA-262).

Continuar lendo

SdevLab – Tutorial | JavaScript Validação de Formulários

Fala Galera,

Para encerrar a série de posts sobre JavaScript, um exemplo de utilidade desta linguagem – validação de formulários.

Boa leitura!

ATUALIZAÇÃO (24/08/2015): Este post foi escrito com base nos tutoriais do W3C para JavaScript ECMA-262 (dei um curso de linguagens web em 2010 mais ou menos e foi deste curso que surgiu a série de posts). O link de referência deste post, ou de posts seguintes desta mesma série, hoje aponta para a versão ECMAScript 5, logo não é mais válido. O conteúdo está correto, mas não é sobre a versão mais atual!

Validação de Formulários em JavaScript

Para encerrar e cumprir o que foi prometido, segue abaixo o exemplo de uma validação de formulário em JavaScript.

<html>
<head>

function validateForm()
{
var x=document.forms["form"]["name"].value;
var y=document.forms["form"]["email"].value
var atpos=y.indexOf("@");
var dotpos=y.lastIndexOf(".");
if (x==null || x=="")
{
alert("Campo nome precisa ser preenchido!");
return false;
}
if (atpos=y.length)
{
alert("Digite um endereço de e-mail válido!");
return false;
}
}

</head>
<body>
<form name="form" action="" onsubmit="return validateForm()" method="post">
Nome: <input type="text" name="name">
Email: <input type="text" name="email">
<input type="submit" value="Submit">
</form>
</body>
</html>

No exemplo fazemos dois testes simples. No primeiro teste somente estamos conferindo se o usuário preencheu o campo. No segundo teste, conferimos se ele digitou um endereço de e-mail válido somente tratando a string digitada. Primeiro ele confere se tem algum texto antes do caracter @. Depois, procura algo do tipo gmail, hotmail, que indica o servidor de e-mail utilizado, e para finalizar, ele procura um “.” e o complemento, por exemplo “.com.br”.

E assim encerro esta ideia que era colocar o básico sobre JavaScript aqui no blog, próximo post, assunto novo!

Até a próxima!
xD

Fonte: w3schools.com

SdevLab – Tutorial | JavaScript Caracteres Especiais

Eae Galera,

Segue neste post um tutorial básico de como utilizar caracteres especiais em JavaScript.

Boa Leitura!

ATUALIZAÇÃO (24/08/2015): Este post foi escrito com base nos tutoriais do W3C para JavaScript ECMA-262 (dei um curso de linguagens web em 2010 mais ou menos e foi deste curso que surgiu a série de posts). O link de referência deste post, ou de posts seguintes desta mesma série, hoje aponta para a versão ECMAScript 5, logo não é mais válido. O conteúdo está correto, mas não é sobre a versão mais atual!

Caracteres Especiais em JavaScript

Tratamos os caracteres especiais em JavaScript de uma maneira um pouco diferente. Para inserir aspas simples ou duplas, barra, tab e outros caracteres em variáveis do tipo string ou em alerts precisamos seguir os padrões da tabela abaixo:

Código Saída
\’ Aspas simples
\” Aspas duplas
\\ Barra
\n Nova linha
\r Carrega retorno
\t Tab
\b Backspace
\f Form feed

Segue um exemplo para ilustrar melhor o uso dos caracteres especiais em JavaScript:

var txt="Antes de estudar JavaScript, estudamos  \"PHP\".";

Até a próxima!
xD

Fonte: w3schools.com

SdevLab – Tutorial | JavaScript Eventos

Fala Galera,

Prestes a chegar na etapa final da série de posts sobre JavaScript estamos (frase estilo Mestre Yoda)! Hoje o assunto do dia é Eventos em JavaScript.

Boa leitura!

ATUALIZAÇÃO (24/08/2015): Este post foi escrito com base nos tutoriais do W3C para JavaScript ECMA-262 (dei um curso de linguagens web em 2010 mais ou menos e foi deste curso que surgiu a série de posts). O link de referência deste post, ou de posts seguintes desta mesma série, hoje aponta para a versão ECMAScript 5, logo não é mais válido. O conteúdo está correto, mas não é sobre a versão mais atual!

Eventos em JavaScript

Eventos são ações que podem ser detectadas pelo JavaScript. Estes eventos servem de gatilhos para nossas funções, exemplo disso já vimos nos capítulos anteriores quando chamávamos uma função no clique de um botão utilizando o evento onClick.

Cada elemento HTML possui certos eventos que podemos acessar, na lista abaixo podemos ver alguns exemplos:

  • um clique de mouse
  • carregamento de uma página
  • carregamento de uma imagem
  • submissão de um formulário
  • selecionar um input em um formulário
    Para saber a lista completa de eventos, basta seguir para o link:

http://www.w3schools.com/tags/ref_eventattributes.asp

No próximo post veremos como funcionam os caracteres especiais em JavaScript.

Até a próxima!
xD

Fonte: w3schools.com

SdevLab – Tutorial | JavaScript Try Catch

Eae galera,

Vamos na onda do JavaScript, neste post com um recurso muito bacana, o try catch.

Boa leitura!

ATUALIZAÇÃO (24/08/2015): Este post foi escrito com base nos tutoriais do W3C para JavaScript ECMA-262 (dei um curso de linguagens web em 2010 mais ou menos e foi deste curso que surgiu a série de posts). O link de referência deste post, ou de posts seguintes desta mesma série, hoje aponta para a versão ECMAScript 5, logo não é mais válido. O conteúdo está correto, mas não é sobre a versão mais atual!

Try Catch em JavaScript

O Try…Catch permite que você teste um bloco de códigos (try). Se algum erro for encontrado, podemos tratá-lo em um outro bloco de códigos (catch).

Exemplo:

try
{
alertaa("Mensagem!");
}
catch(err)
{
alert("Erro!");
}


No exemplo acima, dentro do try eu tento dar uma mensagem alert, porém, como não escrevi alert da maneira correta, a instrução dentro do meu bloco try não será executada, e o bloco catch será executado.

Podemos utilizar o throw para adicionar uma exceção ao erro, como no exemplo abaixo:

var x=prompt("Entre com o número de vezes que o Flamengo ganhou o campeonato brasileiro:");
try
{
if(x 6)
{
throw "Err2";
}
}
catch(er)
{
if(er=="Err1")
{
alert("Erro! Muito pouco, o mengão é melhor que isso!");
}
if(er=="Err2")
{
alert("Erro! Ainda não, mas chegaremos lá!");
}
}


No próximo post veremos como o JavaScript trabalha com eventos.

Até a próxima!
xD

Fonte: w3schools.com