JavaScript: differenze tra le versioni

Versione delle 16:57, 21 feb 2023

Versione attuale delle 16:29, 10 lug 2025

(28 versioni intermedie di 19 utenti non mostrate)

Riga 5:

|autore = [[Brendan Eich]]

|data = [[1995]]

|utilizzo = <!-- Ambito di utilizzo specifico: linguaggio general-purpose, interrogazione di basi di dati, ecc.eccetera -->

|versione = 1.8.5

|utilizzo = <!-- Ambito di utilizzo specifico: linguaggio general-purpose, interrogazione di basi di dati, ecc. -->

|paradigmi = Programmazione a eventi e a oggetti, funzionale

|tipizzazione = debole

Riga 19 ⟶ 18:

|sito_web = https://developer.mozilla.org/it/docs/Web/JavaScript

}}

In [[informatica]] '''JavaScript''' è un [[linguaggio di programmazione]] multi paradigma [[Programmazione orientata agli oggetti|orientato]] agli [[Programmazione a eventi|eventi]], utilizzato sia nella [[programmazione Web|programmazione]] [[lato client]] web che sia [[lato server]] (NodeJs[[Node.js]]) per la creazione di restRESTful API, applicazioni desktop eed embedded, [[sito web|siti web]] e [[applicazione web|applicazioni web]], di effetti dinamici [[interattività|interattivi]] tramite [[funzione (informatica)|funzioni]] di [[script]] invocate da ''eventi'' innescati a loro volta in vari modi dall'utente sulla [[pagina web]] in uso ([[mouse]], [[tastiera (informatica)|tastiera]], caricamento della pagina ecc...).

Originariamente sviluppato da [[Brendan Eich]] della [[Netscape Communications]] con il nome di '''Mocha''' e successivamente di '''LiveScript''', in seguito è stato rinominato "''JavaScript''" ed è stato formalizzato con una [[sintassi]] più vicina a quella del linguaggio [[Java (linguaggio di programmazione)|Java]] di [[Sun Microsystems]] (che nel 2010 è stata acquistata da [[Oracle Corporation|Oracle]]). [[Norma tecnica|Standardizzato]] per la prima volta il 1997 dalla [[European Computer Manufacturers Association|ECMA]] con il nome [[ECMAScript]], l'ultimo standard, di giugno 2022, è ECMA-262 Edition 13<ref>{{Cita web|url=https://262.ecma-international.org/13.0/|titolo=ECMA-262 13th Edition}}</ref> ed è anche uno standard [[ISO]] (ISO/IEC 16262).

Riga 27 ⟶ 26:

=== Java, JavaScript e JScript ===

Il cambio di nome da LiveScript a JavaScript si ebbe più o meno nel periodo in cui Netscape stava includendo il supporto per la tecnologia Java nel suo browser [[Netscape Navigator]].<ref>{{Cita web|url=https://auth0.com/blog/a-brief-history-of-javascript/|titolo=A Brief History of JavaScript|sito=Auth0 - Blog|lingua=en|accesso=2020-02-28}}</ref> La scelta del nome si rivelò fonte di grande confusione. Non c'è una vera relazione tra Java e JavaScript; le loro somiglianze sono soprattutto nella sintassi (derivata in entrambi i casi dal [[C (linguaggio)|linguaggio C]]); le loro semantiche sono piuttosto diverse, e in particolare i loro ''[[object model]]'' non hanno relazione e sono notevolmente incompatibili.

Dato il successo di JavaScript come linguaggio per arricchire le [[pagina web|pagine web]], [[Microsoft]] sviluppò un linguaggio compatibile, conosciuto come ''JScript''. La necessità di specifiche comuni fu alla base dello standard ECMA 262 per [[ECMAScript]], di cui sono state pubblicate otto edizioni da quando il lavoro iniziò, nel novembre [[1996]]<ref name="ecma262">[https://www.ecma-international.org/publications/standards/Ecma-262.htm Standard ECMA-262]</ref>.

=== Aspetti strutturali ===

{{Vedi anche|AJAX}}

Le caratteristiche principali di JavaScript sono:

* essere un [[linguaggio interpretato]]: il codice non viene [[compilazione|compilato]], ma [[Interprete (informatica)|eseguito direttamente;]] in JavaScript [[lato client]], il codice viene eseguito dall'interprete contenuto nel browser dell'utente.

Riga 41 ⟶ 38:

* è un [[linguaggio orientato agli oggetti|linguaggio debolmente orientato agli oggetti]]. Ad esempio, il meccanismo dell'[[Ereditarietà (informatica)|ereditarietà]] è più simile a quello del Self e del [[NewtonScript]] che a quello del [[Java (linguaggio di programmazione)|linguaggio Java]], fortemente orientato agli oggetti. Gli oggetti stessi ricordano più gli [[array associativo|array associativi]] del [[Perl|linguaggio Perl]] che gli oggetti di Java o C++.<ref name="Flanagan">{{cita libro|David|Flanagan|JavaScript - La guida|2000|Apogeo|Milano|isbn=88-7303-627-9}}</ref>

Altri aspetti di interesse: in JavaScript lato client, il codice viene eseguito direttamente sul [[client]] e non sul [[server]]. Il vantaggio di questo approccio è che, anche con la presenza di [[script]] particolarmente complessi, il [[web server]] non rischia sovraccarichi, dato che il lavoro viene svolto dal client. Un rovescio della medaglia è che, nel caso di script particolarmente grandi, il tempo per il trasferimento dalla rete può diventare eccessivamente lungo. Inoltre ogni informazione che presuppone un accesso a dati memorizzati in una [[base di dati]] remota deve essere rimandata a un linguaggio che effettui materialmente la [[Transazione (basi di dati)|transazione]], per poi restituire i risultati ada una o più variabili JavaScript; operazioni del genere richiedono un nuovo caricamento della pagina stessa. Questi limiti sono però stati superati in buona parte con la nascita di [[AJAX]].

Alcune altre caratteristiche di JavaScript degne di nota:

Riga 49 ⟶ 46:

=== Incompatibilità ===

Le varie implementazioni di JavaScript, come già accaduto per HTML, spesso non sono conformi agli standard, ma piuttosto sono costruite per funzionare con uno specifico browser web e con un insieme di versioni specifiche degli stessi. L'attuale standard [[ECMAScript]] dovrebbe essere teoricamente la base di tutte le implementazioni JavaScript, ma in pratica i browser [[Mozilla]] (e [[Netscape Navigator|Netscape]]) usano ''JavaScript'', [[Microsoft Internet Explorer]] usa ''JScript'', e altri browser come [[Opera (browser)|Opera]] e [[Safari (browser)|Safari]] usano altre implementazioni ''ECMAScript'', spesso con ulteriori caratteristiche non standard, per permettere la [[compatibilità]] con JavaScript e JScript.

JavaScript e JScript contengono molte caratteristiche che non sono parte dello standard ufficiale ECMAScript, e possono anche essere privi di diverse caratteristiche. In tal modo, sono in parte incompatibili, il che porta gli autori di script a dovere sopperire a tali problemi durante la scrittura del [[software]]. Tra i due, JavaScript è più conforme allo standard: ciò significa che uno script redatto secondo gli standard ECMA funzionerà con la maggior parte dei browser, soprattutto se in versioni recenti.

Un altro effetto è che ciascun browser potrebbe trattare lo stesso script in modo diverso, e ciò che funziona in un browser potrebbe non funzionare in un altro, o in una diversa versione dello stesso browser. Come con l'HTML, è quindi raccomandabile scrivere codice conforme agli standard. Naturalmente negliNegli anni sono state realizzate varie librerie e framework, che possono essere usate per semplificare la scrittura di codice JavaScript che funzioni correttamente indipendentemente dal browser usato. Una delle librerie più conosciute e diffuse per semplificare la scrittura di semplici script all'interno di pagine HTML o [[PHP]] è [[jQuery]], mentre esistono numerosi framework per scrivere applicativi in JavaScript anche estremamente sofisticati (lato client e/o lato server) ignorando del tutto la necessità di riconoscere quale browser utilizzerà l'utente finale.

==== Contromisure ====

Riga 78 ⟶ 75:

</syntaxhighlight>

In questo caso, l'espressione "document.body.style" normalmente causerebbe un errore in un browser che non ha la proprietà "document.body", ma l'uso dell'operatore "&&" assicura che "document.body.style" non venga mai chiamato se "document.body" non esiste. Il test sfrutta questa particolarità della valutazione di espressioni logiche, chiamata ''[[lazy evaluation]]'' (lett.letteralmente "valutazione pigra").

Oggi, una combinazione di browser sniffing, object detection, e conformità agli standard, come le specifiche ECMAScript e i [[Foglio di stile|CSS]], sono usati in varie misure per provare ad assicurare che un utente non incontri mai un errore JavaScript.

=== Uso ===

Riga 86 ⟶ 83:

A differenza di altri linguaggi, quali il C o il C++, che permettono la scrittura di [[programma (informatica)|programmi]] completamente stand-alone, JavaScript viene utilizzato soprattutto come [[linguaggio di scripting]], integrato, ovvero all'interno di altro codice.

L'idea di base è che il ''programma ospite'' (quello che ospita ed esegue lo script) fornisca allo script un'[[Application Programming Interface|API]] ben definita, che consente l'accesso ada operazioni specifiche, la cui implementazione è a carico del ''programma ospite'' stesso. Lo script, quando eseguito, utilizza riferimenti a questa API per richiedere (al ''programma ospite'') l'esecuzione di operazioni specifiche, non previste dai costrutti del linguaggio JavaScript in sé. Tale meccanismo viene adottato anche in linguaggi quale il [[linguaggio C|C]] o [[Java (linguaggio di programmazione)|Java]], nel quale il programma si affida a delle [[Libreria (software)|librerie]], non previste dal linguaggio in sé, che permettono di effettuare operazioni quali l'I/O o l'esecuzione di chiamate a funzioni di sistema.

L'esempio tipico (e, forse, il più noto e comune) di ''programma ospite'' per uno script JavaScript è quello del [[browser]]. Un browser moderno incorpora normalmente un [[interprete JavaScript]]. Quando viene visitata una [[pagina web]] che contiene codice JavaScript, quest'ultimo viene eseguito dall'interprete contenuto nel browser. Le interfacce che consentono a JavaScript di rapportarsi con un browser sono chiamate [[Document Object Model|DOM]] (''Document Object Model'' in italiano ''Modello a Oggetti del Documento''). Molti siti web usano la tecnologia JavaScript lato client per creare potenti [[applicazione web|applicazioni web]] [[web dinamico|dinamiche]].

Un uso principale del JavaScript in ambito [[Web]] è la scrittura di piccole funzioni integrate nelle pagine [[HTML]], che interagiscono con il DOM del browser per compiere determinate azioni non possibili con il solo [[HTML]] statico: controllare i valori nei campi di input, nascondere o visualizzare determinati elementi, ecc. Sfortunatamente, gli standard DOM imposti dal [[W3C]] non sempre vengono rispettati in modo consistentecoerente ede omogeneo da tutti. Browser diversi, a seconda del loro [[motore di rendering]], espongono diversi oggetti o metodi allo script, perciò spesso è necessario implementare controlli aggiuntivi ada una funzione JavaScript, per garantirne la compatibilità con ciascun browser e persino in funzione delle varie versioni del medesimo browser.

Al di fuori del Web, interpreti JavaScript sono integrati in diverse applicazioni. [[Adobe Acrobat]] e [[Adobe Reader]] supportano JavaScript nei [[file]] [[Portable Document Format|PDF]]. La piattaforma [[Mozilla]], che è alla base di molti diffusi browser Web, usa JavaScript per implementare l'[[interfaccia utente]] e la logica di transazione dei suoi vari prodotti. Gli interpreti JavaScript sono integrati anche nelle applicazioni proprietarie prive di interfacce programmabili via script. Infine la tecnologia [[Windows Script Host]] di [[Microsoft]] supporta JavaScript (via JScript), un linguaggio di scripting per i [[sistema operativo|sistemi operativi]].

Ciascuna di queste applicazioni fornisce il proprio modello a oggetti, che dà accesso all'ambiente ospite, con il nucleo del linguaggio JavaScript che rimane per lo più invariato in ciascuna applicazione. Ci sono diverse implementazioni del nucleo del linguaggio JavaScript, tra le quali:

* [[KJS (JavaScript)|KJS]]

* [[Rhino (interprete JavaScript)|Rhino]]

Riga 114 ⟶ 111:

<syntaxhighlight lang="html4strict">

<script type="text/javascript">

// <![CDATA[

JavaScript statements...

Riga 123 ⟶ 120:

<syntaxhighlight lang="html4strict">

<script type="text/javascript"> ... </script>

</syntaxhighlight>

Riga 130 ⟶ 127:

<syntaxhighlight lang="javascript" strict="">

<script type="text/javascript">

alert('Hello world');

</script>

Riga 138 ⟶ 135:

<syntaxhighlight lang="javascript" strict="">

<script type="text/javascript">

document.write('Hello world');

</script>

Riga 146 ⟶ 143:

Per integrare del codice JavaScript in un documento HTML, bisogna farlo precedere da:

<syntaxhighlight lang="html4strict"><script type="text/javascript"></syntaxhighlight>

e seguire da:

<syntaxhighlight lang="html4strict"></script></syntaxhighlight>

Riga 161 ⟶ 158:

</syntaxhighlight>

I segnalatori di commento <code>&lt;!--</code> ... <code>--&gt;</code> sono necessari per assicurare che il codice non venga visualizzato come testo da browser molto vecchi, che non riconoscono il tag <code>&lt;script&gt;</code> nei documenti HTML, mentre LANGUAGE è un attributo HTML (il cui uso è ormai sconsigliato) che può essere richiesto da vecchi browser. Comunque, i tag &lt;script&gt; nei documenti [[XHTML]]/[[XML]] non funzionano se commentati, dato che i parser conformi agli standard XHTML/XML ignorano i commenti e possono anche incontrare problemi con i simboli <code>--</code>, <code>&lt;</code> e <code>&gt;</code> negli script (per esempio, confondendoli con gli operatori di decremento degli interi e di confronto). I documenti XHTML dovrebbero quindi includere gli script come sezioni [[CDATA]] dell'XML, facendoli precedere da

<syntaxhighlight lang="html" strict="">

<script type="text/javascript">

//<![CDATA[

</syntaxhighlight>

Riga 176 ⟶ 173:

Gli elementi HTML [https://www.w3.org/TR/html4/interact/scripts.html#h-18.2.3] possono contenere eventi intrinseci che possono essere associati a gestori specificati da uno script. Per scrivere del codice HTML 4.01 valido, il server web dovrebbe restituire un 'Content-Script-Type' con valore 'text/JavaScript'. Se il server web non può essere configurato a tale scopo, l'autore del sito web può inserire la seguente dichiarazione nella sezione di intestazione del documento

<syntaxhighlight lang="html4strict">

<meta http-equiv="Content-Script-Type" content="text/javascript" />

</syntaxhighlight>

Riga 196 ⟶ 193:

== Elementi del linguaggio ==

=== Variabili ===

Le [[variabile (informatica)|variabili]] sono in genere tipizzate dinamicamente ovvero sono definite semplicemente assegnando loro un valore oppure usando il comando <code>let,che permette di modificare la variabile, o dal comando const (constant) che indica che la variabile non può essere modificata</code>; quelle dichiarate fuori da qualunque funzione sono in visibilità "globale" ovvero accessibili dall'intera [[pagina web]]; quelle dichiarate dentro una funzione sono invece locali ovvero interne per quella funzione.

Per passare variabili da una pagina all'altra, uno sviluppatore può impostare un [[cookie]] o usare un frame nascosto o una finestra in background per memorizzarli.

Riga 216 ⟶ 213:

function MyObject(attributeA, attributeB)

{

this.attributeA = attributeA;

this.attributeB = attributeB;

}

// crea un Oggetto

obj = new MyObject('red', 1000);

// accede ada un attributo di obj

alert(obj.attributeA);

// accede ada un attributo con la notazione del vettore associativo

alert(obj["attributeA"]);

</syntaxhighlight>

Riga 533 ⟶ 530:

# ''onDrag'': attivato quando il mouse trascina un oggetto o una selezione di testo nella finestra dello stesso browser o anche di un altro o anche sul Desktop;

# ''onDragEnter'': attivato appena l'utente trascina un oggetto su un obiettivo valido dello stesso o di un altro browser;

# ''onDragOver'': attivato quando l'utente trascina un oggetto su un obiettivo valido ada ospitarlo, ed è simile all'evento precedente, ma viene attivato dopo quello;

# ''onDragLeave'': attivato quando l'utente trascina un oggetto su un obiettivo adatto per ospitarlo, ma non vi viene rilasciato;

# ''onDragEnd'': attivato quando l'utente rilascia l'oggetto al termine del trascinamento.

Riga 734 ⟶ 731:

L'approfondimento della documentazione ufficiale permette di effettuare ulteriori buone pratiche, fra le quali:

* verifica del supporto (per esempio [[Safari (browser)|Safari]] su [[iOS]] è noto per non aver raggiunto un ottimo supporto)<ref name="mozdev-notification-permission" /><ref>{{Cita web

|url = https://caniuse.com/mdn-api_notification_requestpermission

|titolo = Notification API: requestPermission

Riga 767 ⟶ 764:

=== File System API ===

Scrivere in modo asincrono un file in un [[file system]] in modalità sandbox utilizzando JavaScript:<syntaxhighlight lang="javascript">

window.requestFileSystem(window.TEMPORARY, 1024 * 1024, function(fs) {

fs.root.getFile('log.txt', {create: true}, function(fileEntry) {

Riga 855 ⟶ 852:

=== Web Workers ===

{{Vedi anche|Web worker}}

Aumentano le prestazioni della pagina web:<syntaxhighlight lang="javascript">

var worker = new Worker('task.js');

Riga 867 ⟶ 865:

=== Web Socket ===

{{Vedi anche|AJAXWebSocket}}

Comunicazione bidirezionale full-duplex sul Web: sia il server che il client possono inviare dati in qualsiasi momento o anche contemporaneamente. Vengono inviati solo i dati stessi, senza il sovraccarico delle intestazioni HTTP, riducendo drasticamente la [[larghezza di banda]].<syntaxhighlight lang="javascript">

var socket = new WebSocket('www.sito.it');

socket.onopen = function(event) {

Riga 965 ⟶ 964:

=== JS nel web 3D ===

{{vedi anche|Web 3D|WebGL}}

JavaScript comprende librerie e framework per creare interfacce 3D sul web<ref>{{Cita web|url=https://bashooka.com/coding/3d-javascript-libraries/|titolo=20 Interactive 3D JavaScript Libraries & Frameworks – Bashooka|data=2019-05-30|lingua=en-US|accesso=2021-02-18}}</ref>.

[[File:Webgl loader ctm.png|alt=Esempio di WebGL|miniatura|Esempio di WebGL]]

<syntaxhighlight lang="javascript">

Riga 983 ⟶ 982:

== Alternative ==

{{vedi anche|HTML5|CSS}}

Con la nascita di [[HTML5|HTML 5]] e CSS 3 alcune possibilità come la creazione di<ref name=":0">{{Cita web|url=https://blog.logrocket.com/5-things-you-can-do-with-css-instead-of-javascript/|titolo=5 things you can do with CSS instead of JavaScript|sito=LogRocket Blog|data=2019-10-29|lingua=en-US|accesso=2021-02-09}}</ref><ref>{{Cita web|url=https://freefrontend.com/css-gallery/|titolo=49 CSS Galleries|sito=Free Frontend|lingua=en-US|accesso=2021-02-09}}</ref><ref>{{Cita web|url=https://livecode.com/demo/html5/calculator/|titolo=LiveCode - HTML5 - Calculator App Demo|sito=livecode.com|accesso=2021-02-09}}</ref><ref>{{Cita web|url=https://www.andreapacchiarotti.it/archivio/menu-responsivo.html|titolo=Menù responsivo in HTML e CSS senza JavaScript e jQuery|autore=Andrea Pacchiarotti|sito=Andrea pacchiarotti|lingua=it|accesso=2021-02-09}}</ref><ref>{{Cita web|url=https://webdesign.tutsplus.com/it/tutorials/css-tooltip-magic--cms-28082|titolo=Come fare un magico, animato Tooltips con CSS|sito=Web Design Envato Tuts+|accesso=2021-02-09}}</ref><ref>{{Cita web|url=https://web.dev/drag-and-drop/|titolo=Using the HTML5 Drag and Drop API|sito=web.dev|lingua=en|accesso=2021-02-09}}</ref><ref>{{Cita web|url=https://www.w3schools.com/howto/howto_html_file_upload_button.asp|titolo=How To Create a File Upload Button|accesso=2021-02-09}}</ref>:

* gallerie/slide di immagini e video

Riga 1 031 ⟶ 1 030:

== Collegamenti esterni ==

* {{Collegamenti esterni}}

* {{FOLDOC}}

;Specifiche

* {{cita web|https://www.ecma-international.org/publications/standards/Ecma-262.htm|ECMA 262 ECMAScript Language Specification|lingua=en}}

* {{cita web|https://mozilla.org/js/language/js20/|Proposal for JavaScript 2.0|lingua=en}}

* {{cita web|1=http://wp.netscape.com/eng/mozilla/3.0/handbook/javascript/index.html|2=Guide for JavaScript 1.1 as used by Navigator 3.x|lingua=en|accesso=7 dicembre 2004|dataarchivio=6 novembre 2004|urlarchivio=https://web.archive.org/web/20041106050312/http://wp.netscape.com/eng/mozilla/3.0/handbook/javascript/index.html|urlmorto=sì}}

;Storia

* {{en}} [https://web.archive.org/web/20080208124612/http://wp.netscape.com/comprod/columns/techvision/innovators_be.html Innovators of the Net: Brendan Eich and JavaScript] ([[Marc Andreesen]], Netscape TechVision, 24 Jun 1998)

* {{en}} [http://inventors.about.com/library/inventors/bl_javascript.htm Brendan Eich and JavaScript] {{Webarchive|url=https://archive.todayis/20121208142259/http://inventors.about.com/od/jstartinventions/a/JavaScript.htm |data=8 dicembre 2012 }} (about.com)

;Apprendimento

Riga 1 046:

* [https://www.html.it/javascript/ Guide, articoli, faq, raccolte script su JavaScript] di HTML.it

* [https://www.html.it/guide/guida-javascript-di-base/ Guida completa a JavaScript] di HTML.it

* {{cita web|https://www.w3schools.com/jsref/|Una dettagliata JavaScript Object Reference}}

* [https://javascript.info Learn & Practice Frontend Development for free]

;Cooperazione con…

* {{cita web|url=https://pear.php.net/package-info.php?pacid=93|titolo=PHP|lingua=en}}

* {{cita web|http://tcllib.sourceforge.net/doc/javascript.html|TCL|lingua=en}}

Riga 1 054:

;Strumenti

* {{cita web|url=http://www.skenz.it/traduttori/tesine/index.php?title=Formattazione_javascript|titolo=Un tool di formattazione (scritto in Java) per il linguaggio JavaScript|accesso=22 aprile 2008|dataarchivio=23 gennaio 2009|urlarchivio=https://web.archive.org/web/20090123191802/http://www.skenz.it/traduttori/tesine/index.php?title=Formattazione_javascript|urlmorto=sì}}

* [http://demo.opencrx.org/opencrx-core-CRX/helpJsCookie_it_IT.html Guida pratica per abilitare JavaScript nei vari browser e sistemi operativi]

{{Browser Internet}}

{{Estensioni}}

{{Principali linguaggi di programmazione}}

{{Framework per applicazioni web}}

{{Controllo di autorità}}

{{Portale|telematica|informatica|internet}}

[[Categoria:JavaScript| ]]