Introdução a JavaScript

#JavaScript
#Boas práticas

O JavaScript (JS) é uma linguagem de programação que está associada diretamente ao HTML e CSS. Enquanto o HTML vai definir o conteúdo, esse conteúdo vai se tornar mais atrativo e visualmente agradável por meio do CSS e o JS vai permitir programar qual será o comportamento, as ações nessa página.

Com JS é possível alterar o conteúdo, valores de atributos, estilos, ocultar ou mostrar elementos do HTML. Para adicionar o código JS no HTML é necessário usar a tag <script>.

A boa prática de codificação vai dizer como no CSS é recomendado criar uma arquivo style.css no JavaScript é recomendado criar um arquivo script. js ou script.mjs. O endereço para esse arquivo deve ser adicionado por meio da tag <script> no final da tag <body>.

As Funções ou simplesmente function em JS é um bloco de código que pode ser acionado por um evento. As Funções podem ser incorporadas no <head> ou <body>.

No JS a saída pode ocorrer de maneira diferentes, podendo ser ao escrever no elemento HTML por meio innerHTML; ou na saída do HTML usando document.write(), este método deve ser usado apenas para teste, pois após o carregamento será excluído do HTML ; outra forma é por meio de uma caixa de alerta com window.alert() e usando console.log() por meio do console do navegador para depuração .

As instruções no JS são compostas por declarações de valores, operadores, expressões, palavras-chave e comentários. Essas instruções são executadas na sequência que foram escritas, uma a uma, para finalizar cada instrução deve ser usado o ponto e vírgula (;).

Os espaços em branco serão ignorados, no produto final, mas você pode colocar espaço em branco em seu código para melhorar a legibilidade. Ainda visando a boa prática é recomendado que a linha não passe de 80 caracteres e caso seja necessário quebrar a linha procurar fazer depois de um operador.

Para agrupar de forma mais eficiente as instruções o JS permite criar blocos de código, esse bloco será escrito dentro de chaves {...}, todas as codificações dentro de um bloco serão executadas em conjunto.

As instruções irão se iniciar geralmente por meio das palavras chaves, que são comandos que será executado pelo JS, como por exemplo:

var - declara uma variável
let - declara uma variável de bloco
const - declara uma constante de bloco
if - marca um bloco de instruções a serem executadas em uma condição
switch - marca um bloco de instruções a serem executadas em diferentes casos
for - marca um bloco de instruções a serem executadas em um loop
function - declara uma função
return - sai de um função
try - implementa a tratamento de erros para um bloco de instruções

Essas palavras-chave serão reservadas não devendo ser usadas para declaração de nomes de variáveis, constantes ou funções, por exemplo. Segundo o ECMAScript 6 as palavras que não podem ser usadas são:

abstract;
arguments;
await;
boolean;
break;
byte;
case;
catch;
char;
class;
const;
continue;
debugger;
default;
delete;
do;
double;
else;
enum;
eval;
export;
extends;
false;
final;
finally;
float;
for;
function;
goto;
if;
implements;
import;
in;
instanceof;
int;
interface;
let;
long;
native;
new;
null;
package;
private;
protected;
public;
return;
short;
static;
super;
switch;
synchronized;
this;
throw;
throws transient;
true;
try;
typeof;
var;
void;
volatile;
while;
with;
yield;

As palavras associadas a objetos, propriedades e métodos devem ser evitadas, sendo elas:

Array;
Date;
eval;
function;
hasOwnProperty;
Infinity isFinite;
isNaN;
isPrototypeOf;
length Math;
NaN;
name;
Number;
Object;
prototype;
String;
toString;
undefined;
valueOf

Busque também evitar as palavras reservadas em Java:

getClass;
java;
JavaArray;
javaClass;
JavaObject;
JavaPackage;

Devem ser evitadas palavras associadas a objetos e propriedades HTML e Window, como:

alert;
all;
anchor;
anchors;
area;
assign blur;
button;
checkbox;
clearInterval;
clearTimeout;
clientInformation;
close;
closed confirm;
constructor;
crypto;
decodeURI;
decodeURIComponent;
defaultStatus;
document;
element;
elements;
embed;
embeds;
encodeURI;
encodeURIComponent;
escape;
event;
fileUpload;
focus;
form;
forms;
frame;
innerHeight;
innerWidth;
layer;
layers;
link;
location;
mimeTypes;
navigate;
navigator;
frames;
frameRate;
hidden;
history image;
images;
offscreenBuffering;
open;
opener;
option;
outerHeight;
outerWidth;
packages;
pageXOffset;
pageYOffset;
parent parseFloat;
parseInt;
password;
pkcs11;
plugin;
prompt;
propertyIsEnum;
radio;
reset;
screenX;
screenY;
scroll;
secure;
select;
self;
setInterval;
setTimeout;
status;
submit taint;
text;
textarea;
top;
unescape;
untaint;
window;

E por último deve ser evitadas as palavras associadas aos manipuladores de eventos HTML:

onblur;
onclick;
onerror;
onfocus;
onkeydown;
onkeypress;
onkeyup;
onmouseover;
onload;
onmouseup;
onmousedown;
onsubmit

Até aqui permitiu conhecer inicialmente o que é Java Script, sua importante aplicação e as listas de palavras reservadas e que devem ser evitadas em nomes de variáveis/constantes e funções.

#communityweekchallenge