Corso JavaScript - Le basi

Indice dei contenuti

Questo articolo è il primo di una serie dedicata al corso JavaScript realizzato da BytePost dedicato ai principianti. In questo corso infatti, spiegheremo le basi del linguaggio di programmazione per lo sviluppo web chiamato JavaScript, partendo dalle nozioni più basilari in modo da rendere l’apprendimento più semplice possibile anche per i meno esperti.

Essendo JavaScript un linguaggio basato sulla pratica più che sulla teoria, ogni guida o articolo sarà accompagnato da una serie di tutorial di facile comprensione, che ti consiglio di riscrivere in un apposito editor di codice.

Se vuoi utilizzare un editor per JavaScript veloce e facile da usare, ma soprattutto online e gratuito, visita il nostro: Codewith.it.

Prima di procedere con il corso JS, è d’obbligo precisare che, per comprendere appieno i concetti che verranno spiegati, dovresti conoscere almeno le basi di HTML e CSS.

Quindi prima di procedere qui, se ne hai bisogno, puoi passare prima per il nostro precedente corso: Imparare l’HTML e CSS.

Le basi di JavaScript

Cos’è Javascript?

JavaScript è uno dei principali linguaggi di programmazione al mondo e uno dei può popolari ed utilizzati. JS è utilizzato fondamentalmente per essere integrato nelle pagine web e serve a creare oggetti dinamici con cui far interagire gli utenti, oppure a eseguire funzioni e strumenti avanzati per la gestione dei dati.

Questo linguaggio consente di creare vere e proprie applicazioni web, infatti la maggior parte degli elementi presenti in un sito e con cui interagisci probabilmente sono realizzati proprio in JavaScript.

JS è un linguaggio client-side, ovvero è programmato per essere usato dall’utente finale direttamente dal suo browser. Infatti, è eseguito dai browser web al momento del caricamento della pagina e non necessita di librerie e risorse esterne per funzionare.

A cosa serve JavaScript?

Come detto, JavaScript è un linguaggio di programmazione per la creazione di oggetti dinamici nelle pagine o siti web.

Con questo linguaggio è possibile alterare e modificare ogni singolo elemento nella pagina a nostro piacimento e senza limiti.

Alcune dei principali utilizzi di JavaScript sono i seguenti:

Aggiunta di elementi HTML personalizzati
Aggiunta e modifica di elementi anche dopo il caricamento della pagina
Modifica del CSS (modifiche allo stile degli elementi)
Creazione di elementi dinamici
Creazione e compilazione di form
Invio e ricezione di dati
Salvataggio e caricamento di file
Generazione di file
Avvisi
Effetti
Animazioni
Programmazione in generale e molto altro

Potrebbe essere complicato da comprendere a primo impatto, ma JavaScript è un potente linguaggio di programmazione con cui è realmente possibile agire su ogni singolo oggetto molto facilmente o creare qualsiasi cosa si abbia in mente. L’unico limite è la propria conoscenza.

Integrare JavaScript nelle pagine web

Codice in-line

Nelle pagine HTML ogni elemento è definito tramite appositi tag con funzioni specifiche. L’integrazione di codici JS all’interno di pagine HTML è possibile semplicemente definendo uno di questi tag in una qualsiasi posizione desiderata.

JavaScript infatti, vive internamente alle pagine web attraverso i tag <script>…</script>.

Questi tag possono essere molteplici nella stessa pagina, possiamo dire anche a numero illimitato.

Inoltre, al contrario di molti altri elementi HTML, <script> può essere inserito sia in <body> che in <head> senza particolari distinzioni. La scelta ricade in base alle esigenze, molti script infatti necessitano di essere eseguiti prima della renderizzazione o caricamento della pagina per funzionare.

Nel caso invece di script secondari o ad esecuzione manuale, è possibile (e consigliato) definirli nel footer della pagina, nella posizione più bassa, in modo da rendere più rapido il caricamento della pagina.

Codice esterno

Altro metodo per l’integrazione del codice JavaScript in una pagina HTML è attraverso file esterni in formato .js.

Un po’ come avviene con il CSS, è possibile richiamare risorse esterne JavaScript in una pagina in questo modo:

<script type="text/javascript" src="codici.js"></script>

Nell’attributo “src” andrà digitato l’URL o path del file in formato .js. La posizione del tag HTML, segue le stesse regole della scrittura in-line della sezione precedente.

N.B. Nel marcatore <script> è possibile aggiungere un istruzione sul formato definito dall’attributo “type” (type=”text/javascript“). Nelle ultime versioni di JS è più obbligatorio indicare tale istruzione.

Esempio

Qui di seguito un esempio di apertura del codice JavaScript in una pagina HTML, privo di effettivo codice utile.

<!DOCTYPE html>
<html>
  <head>
      <script type="text/javascript">
            ....
      </script>
  </head>
  <body>
      <script>
            ....
      </script>
      <script type="text/javascript" src="codici.js"></script>
  </body>
</html>

Regole di JavaScript

Il codice JavaScript per essere eseguito correttamente dai browser deve rispettare determinate regole, altrimenti sarà facile imbattersi in spiacevoli errori.

Queste regole sono facili da ricordare e possiamo riassumerle in questi punti:

Ogni riga di codice deve terminare con il punto e virgola (;).
JS è case sensitive, ovvero fa distinzione tra lettere minuscole e maiuscole (“Nome” è diverso da “nome”.
Il nome personalizzato delle variabili, oggetti e funzioni non può iniziare con un numero o un simbolo.
La separazione delle parole che compongono un valore/nome personalizzato può essere definito con il simbolo “_” (underscore).
I nomi personalizzati inoltre, non possono avere spazi tra le parole che lo compongono
- Si consiglia di usare nomi come miaVariabile o mia_funzione ad esempio.
Per definire stringhe di testo o valori, queste vanno racchiuse all’intero degli apici singoli (‘) o doppi (“), altrimenti non verranno eseguiti e restituiranno errori.
Non puoi attribuire nomi vietati alle variabili o funzioni. Per vietati si intendono quei nomi pre-imposati presenti nel linguaggio che hanno già funzioni stabilite come: function, while, for, in ,do, return, this etc…

Tieni a mente questi concetti ma non dargli troppo peso, vedrai tutto nel dettaglio negli articoli seguenti.

JavaScript è un linguaggio tipizzato ma senza troppe restrizioni o vincoli, cioè per essere eseguito non necessità di una struttura ordinata e specifica, ma riesce ad interpretare script anche con eventuali errori e mancanze, compensando i valori assenti con quelli che ritiene più opportuni (esempio l’assenza di un punto e virgola o ripetizione di variabili).

JavaScript è un linguaggio che esegue le istruzioni “a cascata”, ovvero dalla prima all’ultima in ordine di scrittura nella pagina. Ogni istruzione eseguita dopo, se richiesto, può sovrascriverne una precedente.

Fa quindi molta attenzione alla scrittura del codice e cerca di essere il più ordinano possibile seguendo la gerarchia degli elementi.

Questa era l’introduzione a JavaScript per il primo articolo del nostro corso, che come già detto sarà dedicato ai principianti. Anche nei prossimi cercheremo di dare spiegazioni dettagliate senza informazioni superflue, perché JS come molti altri linguaggi di programmazione si basa molto sulla pratica costante.

Se vuoi approfondire, puoi dare un’occhiata alla sezione “Funzioni HTML&JS” del nostro sito, li troverai molti tutorial utili per iniziare a programmare con JS in maniera semplice e intuitiva.

Se hai bisogno di ulteriori informazioni scrivici nei commenti, oppure prosegui con il corso cliccando nel tasto in basso.

Clicca qui per visualizzare il programma completo del corso JS

Prosegui con: Corso JavaScript – Primi codici ⇨

Iscriviti alla nostra Newsletter qui e seguici su Facebook per aggiornamenti!

Articoli recenti: