Learn JavaScript from Scratch
Hello! Welcome
Today we are going to learn JavaScript from scratch.
What is JavaScript?
JavaScript is one of the most popular and versatile programming languages.
With it, you can create dynamic websites, mobile applications, and even video games.
Anything you can think of!
Where is JavaScript used?
JavaScript was mainly used to modify the content of web pages, create visual effects, and process data.
But nowadays, it is used in many more places, thanks to tools like Node.js.
How to run your code
To run JavaScript, you don’t need to install anything. Just open your browser and:
- Press F12 (or right-click on the page and select Inspect).
- Go to the Console tab.
- Type
console.log('Hello, LuisLlamas.es!');
and press Enter
It’s that easy! You just ran your mini JavaScript program.
You’re doing great!
Now let’s talk about the syntax of JavaScript.
Variables
Variables in JavaScript allow you to store data like numbers, text, or lists. You can use let
or const
to declare them.
let value = 10;
const sum = value + 5;
With them, we can perform operations like addition, subtraction, multiplication, and division, as well as work with strings.
Conditionals
With conditionals, you can make your program make decisions. Use if to execute code only if a condition is true.
if (age >= 18) {
console.log('You are an adult');
}
Loops
Loops allow you to repeat actions. Use for or while to repeat tasks multiple times until a condition is met.
for (let i = 1; i <= 5; i++) {
console.log(i);
}
Functions
Functions are reusable blocks of code that perform a specific task. You can define a function with function
and call it when you need it.
function greet(name) {
console.log('Hello, ' + name);
}
Arrays
An array is a collection of elements. In JavaScript, you can use arrays to store multiple values and work with them in an organized way.
let fruits = ['apple', 'banana', 'orange'];
Objects
In JavaScript, objects allow you to organize data in key-value pairs. They are very useful for storing related information.
let person = {
name: 'John',
age: 25
};
You’re almost there!
Now let’s see how to add JavaScript to a website!
Adding JavaScript to a website
To include JavaScript on a web page, we use the <script>
tag. Typically, we place it at the end of the <body>
of your HTML.
<script>
console.log('Hello, JavaScript!');
</script>
Usually, you will save your code in a separate file and load it like this:
<script src="your_file.js"></script>
What is the DOM?
The DOM (Document Object Model) is a representation of the structure of a web page.
With JavaScript, we can modify the content and styles of a page by accessing the elements of the DOM.
Events in JavaScript
Events allow JavaScript to react to user actions, such as clicking a button, moving the mouse, or typing in a text field.
document.getElementById('myButton').addEventListener('click', function() {
alert('You clicked!');
});
Well done!
You now know the basics of JavaScript! You can continue exploring and creating your own projects.