Guida su JavaScript

in data
Guida su JavaScript Guida su JavaScript
Guida su JavaScript

Versione italiana

Guida su JavaScript

1. Introduzione a JavaScript

JavaScript è un linguaggio di programmazione orientato agli oggetti e basato su prototipi. È uno dei tre principali linguaggi del web, insieme a HTML e CSS. JavaScript viene eseguito nel browser dell'utente, consentendo di interagire con il DOM (Document Object Model) e di gestire eventi.

Link utili:

2. Includere JavaScript in una pagina web

Puoi includere JavaScript in una pagina web in diversi modi:

  • Inline: Scrivendo direttamente nel tag <script> all'interno del documento HTML.

    <script>
    alert("Ciao, mondo!");
</script>
    <script>
    alert("Ciao, mondo!");
</script>

  • Esterno: Creando un file .js separato e collegandolo nel documento HTML.

    <script src="script.js"></script>
    <script src="script.js"></script>

3. Sintassi di base di JavaScript

Ecco alcuni concetti fondamentali di JavaScript:

  • Variabili: Puoi dichiarare variabili utilizzando var, let o const.

    let nome = "Mario";
const eta = 30;
    let nome = "Mario";
const eta = 30;

  • Tipi di dati: JavaScript supporta diversi tipi di dati, tra cui stringhe, numeri, booleani, oggetti e array.

    let numero = 42; // Numero
let testo = "Hello"; // Stringa
let attivo = true; // Booleano
let oggetto = { nome: "Mario", eta: 30 }; // Oggetto
let array = [1, 2, 3]; // Array
    let numero = 42; // Numero
let testo = "Hello"; // Stringa
let attivo = true; // Booleano
let oggetto = { nome: "Mario", eta: 30 }; // Oggetto
let array = [1, 2, 3]; // Array

  • Operatori: JavaScript supporta operatori aritmetici, di confronto e logici.

    let somma = 5 + 3; // Aritmetico
let uguale = (5 === 5); // Confronto
let e = (true && false); // Logico
    let somma = 5 + 3; // Aritmetico
let uguale = (5 === 5); // Confronto
let e = (true && false); // Logico

4. Funzioni

Le funzioni in JavaScript possono essere dichiarate in vari modi:

  • Funzione dichiarata:

    function saluta() {
    console.log("Ciao!");
}
    function saluta() {
    console.log("Ciao!");
}

  • Funzione espressione:

    const saluta = function() {
    console.log("Ciao!");
};
    const saluta = function() {
    console.log("Ciao!");
};

  • Arrow function:

    const saluta = () => {
    console.log("Ciao!");
};
    const saluta = () => {
    console.log("Ciao!");
};

5. Controllo del flusso

JavaScript offre diverse strutture di controllo del flusso:

  • Condizionali:

    if (eta >= 18) {
    console.log("Sei maggiorenne.");
} else {
    console.log("Sei minorenne.");
}
    if (eta >= 18) {
    console.log("Sei maggiorenne.");
} else {
    console.log("Sei minorenne.");
}

  • Cicli:

    for (let i = 0; i < 5; i++) {
    console.log(i);
}
    for (let i = 0; i < 5; i++) {
    console.log(i);
}

6. Manipolazione del DOM

JavaScript può essere utilizzato per manipolare il DOM, consentendo di modificare il contenuto e lo stile delle pagine web.

// Seleziona un elemento
let titolo = document.getElementById("titolo");

// Modifica il contenuto
titolo.textContent = "Nuovo Titolo";

// Aggiungi un evento
titolo.addEventListener("click", function() {
    alert("Hai cliccato sul titolo!");
});
// Seleziona un elemento
let titolo = document.getElementById("titolo");

// Modifica il contenuto
titolo.textContent = "Nuovo Titolo";

// Aggiungi un evento
titolo.addEventListener("click", function() {
    alert("Hai cliccato sul titolo!");
});

7. Eventi

JavaScript consente di gestire eventi come clic, passaggi del mouse e invii di moduli.

document.getElementById("pulsante").addEventListener("click", function() {
    alert("Pulsante cliccato!");
});
document.getElementById("pulsante").addEventListener("click", function() {
    alert("Pulsante cliccato!");
});

8. Risorse aggiuntive

Ecco alcune risorse utili per approfondire la tua conoscenza di JavaScript:

English version

JavaScript Guide

1. Introduction to JavaScript

JavaScript is an object-oriented, prototype-based programming language. It is one of the three main languages ​​of the web, along with HTML and CSS. JavaScript runs in the user's browser, allowing it to interact with the DOM (Document Object Model) and handle events.

Useful links:

2. Including JavaScript in a Web Page

You can include JavaScript in a web page in several ways:

  • Inline: By writing directly in the <script> tag within the HTML document.
<script>
alert("Hello, world!");
</script>
<script>
alert("Hello, world!");
</script>
  • External: By creating a separate .js file and linking it into your HTML document.
<script src="script.js"></script>
<script src="script.js"></script>

3. Basic JavaScript Syntax

Here are some basic JavaScript concepts:

  • Variables: You can declare variables using var, let, or const.
let name = "John";
const age = 30;
let name = "John";
const age = 30;
  • Data Types: JavaScript supports several data types, including strings, numbers, booleans, objects, and arrays.
let number = 42; // Number
let text = "Hello"; // String
let active = true; // Boolean
let object = { name: "John", age: 30 }; // Object
let array = [1, 2, 3]; // Array
let number = 42; // Number
let text = "Hello"; // String
let active = true; // Boolean
let object = { name: "John", age: 30 }; // Object
let array = [1, 2, 3]; // Array
  • Operators: JavaScript supports arithmetic, comparison, and logical operators.
let sum = 5 + 3; // Arithmetic
let equals = (5 === 5); // Comparison
let e = (true && false); // Logical
let sum = 5 + 3; // Arithmetic
let equals = (5 === 5); // Comparison
let e = (true && false); // Logical

4. Functions

Functions in JavaScript can be declared in various ways:

  • Declared Function:
function greet() {
console.log("Hello!");
}
function greet() {
console.log("Hello!");
}
  • Expression Function:
const greet = function() {
console.log("Hello!");
};
const greet = function() {
console.log("Hello!");
};
  • Arrow function:
const greet = () => {
console.log("Hello!");
};
const greet = () => {
console.log("Hello!");
};

5. Flow control

JavaScript offers several flow control structures:

  • Conditionals:
if (age >= 18) {
console.log("You are of legal age.");
} else {
console.log("You are of legal age.");
}
if (age >= 18) {
console.log("You are of legal age.");
} else {
console.log("You are of legal age.");
}
  • Loops:
for (let i = 0; i < 5; i++) {
console.log(i);
}
for (let i = 0; i < 5; i++) {
console.log(i);
}

6. DOM manipulation

JavaScript can be used to manipulate the DOM, allowing you to change the content and style of web pages.

// Select an element
let title = document.getElementById("title");

// Edit the content
title.textContent = "New Title";

// Add an event
title.addEventListener("click", function() {
alert("You clicked on the title!");
});
// Select an element
let title = document.getElementById("title");

// Edit the content
title.textContent = "New Title";

// Add an event
title.addEventListener("click", function() {
alert("You clicked on the title!");
});

7. Events

JavaScript lets you handle events like clicks, mouseovers, and form submissions.

document.getElementById("button").addEventListener("click", function() {
alert("Button clicked!");
});
document.getElementById("button").addEventListener("click", function() {
alert("Button clicked!");
});

8. Additional Resources

Here are some useful resources to deepen your knowledge of JavaScript:

Commenti

Posta un commento