Image

JavaScript is a scripts programming language, intended for interactive Web pages and for App. Web too, created in 1995. JavaScript is an object oriented language, known as prototype.

BEGINNER

⇒ Code Examples

→ You must be bilingual (Fr/En). The code examples are in English.

→ Let's start with very simple codes. The more you progress, page after page, the more the scripts will be sophisticated. However, you will have to go through 30 to 40 pages per level, before moving on to the next step…

→ To evaluate your codes, click on the icon at the bottom left of the page (cogwheels), then choose a compiler from the list which will open in another tab. Be careful with certain formats. Finally, test your work.

→ Don't try to understand everything the first time, just practice. Some code examples will seem similar to you, yet the differences remain and you must find them.

→ The pagination is located below the compiler and below the comments area. The order of these pages is of little importance to beginners.

IT'S UP TO YOU TO COPY AND IMMERSE YOURSELF!

C 0001 - Hello World !
Reproduce this code (do not copy and paste!).

<!DOCTYPE html>
<html>
<body>
<h2>Exemple</h2>
<p id="example1">JavaScript can change content</p>
<button type="button" onclick='document.getElementById("example1").innerHTML = "Hello World !";'>Click here !</button>
</body>
</html>
C 0002 - List
Reproduce this code (do not copy and paste!).

<!DOCTYPE html>
<html>
<body>
<h2>Array methods using JavaScript</h2>
<h2>join()</h2>
<p>The join () method joins the array elements into a string.</p>
<p>In this example, "/" acts as a separator between the elements presented :</p>
<p id="demo"></p>
<script>const painters = ["Vermeer", "Picasso", "Leonardo da Vinci", "Vincent van Gogh"];document.getElementById("demo").innerHTML = painters.join(" / ");</script>
</body>
</html>
C 0003 - PopUp
Reproduce this code (do not copy and paste!).

<!DOCTYPE html>
<html>
<body>
<h2>POPUP</h2>
<p>Example</p>
<script>window.alert(189 + 3454);
</script>
</body>
</html>
C 0004 - Data Comparison
Reproduce this code (do not copy and paste!).

<!DOCTYPE html>
<html>
<body>
<h2>Compare two data for your retirement</h2>
<p>Indicate your age :</p>
<input id="age" value="67" />
<button onclick="myFunction()">Compare</button>
<p id="demo"></p>
<script>function myFunction() {  let age = document.getElementById("age").value;  let see = (age < 67) ? "Too young ":"Old enough ";  document.getElementById("demo").innerHTML = see + "to retire.";}</script></body>
</html>
C 0005 - Data Types
Reproduce this code (do not copy and paste!).

<!DOCTYPE html>
<html>
<body>
<h2>Evaluation</h2>
<p id="comp"></p>
<script>
let x = 6 + 28 + "Orange" + "Paris" ;
document.getElementById("comp").innerHTML = x;
</script>
</body>
</html>

C 0006 - Data Types
Reproduce this code (do not copy and paste!).

<!DOCTYPE html>
<html>
<body>
<h2>Evaluation</h2>
<p id="comp"></p>
<script>
let x = 134 + "Blue" + 272 + "Orange" + "London" ;
document.getElementById("comp").innerHTML = x;
</script>
</body>
</html>

C 0007 - Data Types
Reproduce this code (do not copy and paste!).

<!DOCTYPE html>
<html>
<body>
<h2>Evaluation</h2>
<p id="comp"></p>
<script>
let x = 134 + " Blue" + 272 + " Orange" + " London" ;
document.getElementById("comp").innerHTML = x;
</script>
</body>
</html>

C 0008 - PopUp
Reproduce this code (do not copy and paste!).

<!DOCTYPE html>
<html>
<body>
<h2>POPUP</h2>
<p>Example</p>
<script>window.alert(888 + 2023);
</script>
</body>
</html>
Image

CHOOSE YOUR COMPILER

Reproduce this code, choosing one of the compilers below (don't copy and paste! It would be too easy). They all have the same function, just choose one according to your preferences.

When copying your code, replace the existing (default) code already in the compiler with your own.

Warning ! Choose the compiler based on the formatting (e.g., with or without HTML tags). For some of these compilers, you must choose the programming language yourself from the menu that is then offered. Of course, don't forget to click on RUN !

Responsibility

Some of the external links presented below, are not under the direct responsibility of Fond of Code. We cannot therefore be held responsible for the quality/Viability, or the temporary nor permanent interruption of some of them.

All about JavaScript

Code

Recent versions

Frameworks

Libraries

Info+

» Creation date: 1995
* Created by Brendan Eich
* Developed and supported by ECMAScript, Netscape Communications Corporation, Mozilla Foundation
* Influenced by Java, C ++, PERL and Python
* Multiplatform

News

The comments you leave us are systematically subject to rigorous moderation. Incivility and slander, threats, intimidation of all kinds, more generally all gratuitous verbal violence, or the dissemination of unverified information... are not tolerated. We also reserve the right to publish only comments which effectively advance the debate and allow a better understanding of the subject covered by the article presented on this page (as well as all its ramifications) and this, whatever its overall content.

Image

Fond of Code TM © ®
All rights reserved - Protected Trademark/Logo (INPI)

Legal structures based in
Nice - FRANCE

Montreal - Canada
By appointment

SIRET: 41138921600028 (France)
Inc. : 661515-5 (Canada, Qc.)
Official resumption in France : March 2025
Beta version of the website : May 2024
Implementation : July 2024
Launch of initial activity : 1996 (Europe and North America)
New version of the website : April 2025

Fond of Code official launch : May 2025

Image
Image