JavaScript facts for kids
![]() Screenshot of JavaScript source code
|
|
Paradigm | Multi-paradigm: event-driven, functional, imperative, procedural, object-oriented |
---|---|
Designed by | Brendan Eich of Netscape initially; others have also contributed to the ECMAScript standard |
First appeared | 4 December 1995 |
Stable release | |
Preview release | |
Typing discipline | Dynamic, weak, duck |
Filename extensions |
|
Major implementations | |
V8, JavaScriptCore, SpiderMonkey, Chakra | |
Influenced by | |
Java, Scheme, Self, AWK, HyperTalk | |
Influenced | |
ActionScript, ArkTS, AssemblyScript, CoffeeScript, Dart, Haxe, JS++, Opa, TypeScript | |
|
JavaScript, often called JS, is a special programming language. It is one of the main tools that makes the internet work. Think of it like a brain for websites, working with HTML (which builds the page) and CSS (which styles it).
Almost all websites use JavaScript. It helps make web pages interactive and lively. For example, when you click a button and something happens without the page reloading, that's often JavaScript at work!
Your Web browser has a special "engine" that understands and runs JavaScript code. These engines are also used in other places, like servers and many apps. A popular tool for using JavaScript outside of browsers is called Node.js.
JavaScript is a high-level language. This means it's easier for humans to read and write than some other computer languages. It follows rules set by something called the ECMAScript standard. Even though its name sounds like Java, they are actually quite different languages.
Contents
How JavaScript Was Born
Early Days of the Web
The first popular web browser with pictures, called Mosaic, came out in 1993. It made the internet easy for everyone to use, not just tech experts. The people who made Mosaic later started a company called Netscape. In 1994, they released their own browser, Netscape Navigator, which quickly became very popular.
Back then, web pages were mostly static. This means they just sat there and didn't do much after they loaded. People wanted to make pages more exciting and interactive. So, in 1995, Netscape decided to add a programming language to their Navigator browser.
They tried two ideas:
- Working with Sun Microsystems to use the Java language.
- Hiring Brendan Eich to add a language called Scheme.
The goal was to create a "language for everyone." It would help people who weren't expert programmers make fun, interactive websites. Netscape soon decided that Brendan Eich should create a brand new language. They wanted it to look similar to Java, but be simpler.
When it first came out in a test version of Navigator in September 1995, it was called LiveScript. But by the official release in December, the name was changed to JavaScript. This name choice caused some confusion, making people think it was closely related to Java. Brendan Eich later said the name was a marketing trick because Java was very popular at the time.
Microsoft Joins the Race
In 1995, Microsoft launched its own browser, Internet Explorer. This started a big competition with Netscape, known as the "browser war." For JavaScript, Microsoft created its own version of the language called JScript.
Microsoft released JScript in 1996. It was different from Netscape's JavaScript. These differences made it hard for website creators. They had to make their sites work for both browsers, which was tricky. For many years, you would see messages like "best viewed in Netscape" or "best viewed in Internet Explorer" on websites.
Making JavaScript a Standard
In November 1996, Netscape asked an organization called Ecma International to make JavaScript a standard. This way, all browser makers could follow the same rules. This led to the first official ECMAScript language rules being released in June 1997.
The process of making rules continued. ECMAScript 2 came out in 1998, and ECMAScript 3 in 1999. Work on ECMAScript 4 started in 2000.
However, Microsoft's Internet Explorer became very dominant. By the early 2000s, about 95% of people used Internet Explorer. This meant that JScript, Microsoft's version, became the main way to make interactive websites. Microsoft stopped working with Ecma International on the new standards, and so ECMAScript 4 was put on hold.
Growing Up and Getting Stronger
Things started to change around 2004. Mozilla, which came from Netscape, released the Firefox browser. Many people liked Firefox, and it started to take users away from Internet Explorer.
In 2005, Mozilla joined Ecma International. New work began on the language. Around this time, a very important idea called Ajax came out. Ajax allowed websites to load new information in the background without reloading the whole page. Think of how social media feeds update without you clicking refresh! This made JavaScript super popular again. Many new JavaScript tools and libraries like jQuery were created.
In 2008, Google launched its Chrome browser. Chrome had a super fast JavaScript engine called V8. This engine used a new trick called "just-in-time compilation" (JIT) to make code run faster. Other browser makers then had to update their engines to keep up.
In 2009, all these different groups came together. They decided to work together to make JavaScript even better. This led to the ECMAScript 5 standard, released in December 2009.
Modern JavaScript
Big improvements continued for several years. Many new features were added and made official with ECMAScript 6 in 2015.
Also in 2009, a tool called Node.js was created by Ryan Dahl. Node.js allowed JavaScript to be used outside of web browsers, like on servers. This made JavaScript even more powerful and popular. By 2018, millions of developers were using Node.js.
Today, the rules for JavaScript are openly managed on GitHub. New updates are released every year. The JavaScript world now has tons of libraries and frameworks. These are like toolkits that help developers build amazing things faster.
What JavaScript Can Do
JavaScript is the main language for making websites interactive. It works with HTML documents to change how pages look and act.
All big web browsers have a special JavaScript engine built-in. This engine runs the code right on your computer or phone.
Examples of Interactive Websites
JavaScript helps websites do cool things like:
- Loading new parts of a page without reloading the whole thing. This is how you can send messages on social media without leaving the page.
- Making animations on web pages, like things fading in or moving around.
- Playing browser games directly in your web browser.
- Controlling streaming media like videos and music.
- Showing pop-up ads or alert messages.
- Checking if information you type into a web form (like your email) is correct before sending it.
- Collecting information about how you use a website. This helps website owners understand what people like.
- Sending you to a different page automatically.
- Saving and getting information on your device, like your game progress.
Helpful Tools for JavaScript
Many websites use special JavaScript tools called libraries or frameworks. These are like pre-made building blocks that save developers a lot of time.
jQuery is one of the most popular. Others include Angular, React, and Vue. Developers can even use several of these together.
Sometimes, people talk about "Vanilla JS." This means using only the basic JavaScript features without any extra libraries.
Using JavaScript Beyond Browsers
JavaScript isn't just for web browsers anymore! Its special engines are now used in many other computer programs.
Early attempts to use JavaScript on server-side (the part of a website that runs on a server, not your computer) were not very popular. But in the late 2000s, with tools like Node.js, using JavaScript on servers really took off.
Tools like Electron and React Native let developers build computer and phone apps using JavaScript. You can also find JavaScript in other places, like scripting PDF documents in Adobe Acrobat or making extensions for GNOME Shell (a desktop environment).
JavaScript has even been used in some embedded systems, which are small computer systems built into other devices.
Key Features of JavaScript
JavaScript has many features that make it powerful and flexible.
Step-by-Step and Organized Code
JavaScript uses a style of programming called "structured programming." This means you can use commands like `if` (to make decisions), `while` (to repeat actions), and `switch` (to choose between many options).
Flexible Types
JavaScript is "weakly typed." This means it can sometimes guess what kind of data you're working with. For example, if you add a number to a text string, JavaScript might turn the number into text so it can join them together.
Here's a simple table to show how JavaScript can change data types:
left operand | operator | right operand | result |
---|---|---|---|
[] (empty array) |
+ |
[] (empty array) |
"" (empty string) |
"123" (string) |
+ |
1 (number) |
"1231" (string) |
"123" (string) |
- |
1 (number) |
122 (number) |
Dynamic and Flexible
JavaScript is "dynamically typed." This means you don't have to tell the computer what type of data a variable will hold ahead of time. A variable that holds a number can later hold text.
Object-Oriented (Prototype-Based)
In JavaScript, an "object" is like a container for information. It can hold different pieces of data, called "properties," and actions it can perform, called "methods." You can add, change, or remove these properties and methods while the program is running.
Instead of using "classes" like some other languages, JavaScript uses "prototypes" for sharing features. Think of a prototype as a blueprint that other objects can copy from.
Functions as Objects
In JavaScript, functions are very special. They can be treated like objects themselves! This means you can give them properties and methods, just like other objects.
Functions That Remember
A "nested function" is a function inside another function. These inner functions can "remember" and use information from the outer function, even after the outer function has finished running. This is called a "closure."
Functions Without Names
JavaScript also lets you create "anonymous functions," which are functions without a specific name.
Other Cool Features
- Counting from Zero: Like many programming languages, JavaScript starts counting from zero. So, the first item in a list is at position 0, not 1.
- Flexible Inputs: You can send a function as many inputs as you want, even if you don't know how many there will be ahead of time.
- Easy Lists and Objects: JavaScript makes it easy to create lists (arrays) and objects using simple shortcuts.
- Pattern Matching: JavaScript has "regular expressions," which are powerful tools for finding and changing patterns in text.
- Handling Delays: JavaScript uses "promises" and "async/await" to deal with tasks that take time, like loading data from the internet. This helps your program stay smooth and not freeze while waiting.
How JavaScript Looks (Syntax)
Here are some simple examples of JavaScript code.
Basic Examples
You can create variables in JavaScript using `var`, `let`, or `const`. Variables are like containers for storing information.
// This creates a variable called `myNumber` and puts the number 2 inside it.
let myNumber = 2;
// JavaScript is flexible! You can change what's inside `myNumber` later.
// Now, `myNumber` holds the text "foo".
myNumber = "foo";
// The `const` keyword means "constant." This variable cannot be changed later.
const greeting = "Hello!";
// greeting = "Hi!"; // This would cause an error!
You'll see comments in the code, starting with `//`. These are notes for humans and the computer ignores them.
JavaScript itself doesn't have a built-in way to show things on the screen. But the "environment" where it runs (like your web browser) usually provides tools for this. Here's how you might print "Hello, World!" in a browser's developer console:
console.log("Hello, World!"); // This sends "Hello, World!" to the console
To make something appear on a web page, you need to work with the page's structure (the DOM):
// This creates a new 'span' element (a small container for text)
const myElem = document.createElement('span');
// We can add a class and an ID to it, like giving it a name and a label
myElem.classList.add('cool-text');
myElem.id = 'main-message';
// We can also add other special information, called "attributes"
myElem.setAttribute('data-info', 'important');
// Finally, we add this new element to the main part of the web page (the body)
document.body.appendChild(myElem);
Here's a function that calculates something called a factorial (like 3! = 3 * 2 * 1 = 6):
function factorial(n) {
// If n is 0, the factorial is 1
if (n === 0)
return 1;
// If n is negative, factorial is not defined
if (n < 0)
return undefined;
// This part does the actual calculation
const calculate = a => a > 1 ? a * calculate(a - 1) : 1;
return calculate(n);
}
factorial(3); // This will give you 6
JavaScript also has "arrow functions," which are a shorter way to write functions:
// A simple arrow function that adds two numbers
const addNumbers = (num1, num2) => num1 + num2;
addNumbers(5, 7); // This will give you 12
You can create "objects" in JavaScript using a `class` keyword. This is like making a blueprint for similar items:
class Ball {
constructor(radius) {
this.radius = radius; // The ball has a radius
}
// This is a method (a function for the object)
showRadius() {
console.log("The radius is: " + this.radius);
}
};
const myBall = new Ball(10); // Create a new ball with radius 10
myBall.showRadius(); // This will print "The radius is: 10"
JavaScript also lets you organize your code into "modules." This helps keep different parts of a big program separate and tidy.
Export example (what a module can share):
/* mymodule.js */
// This function is shared with other parts of the program
export function add(num1, num2) {
return num1 + num2;
}
// This class is also shared
export class Calculator {
constructor(val1, val2) {
this.val1 = val1;
this.val2 = val2;
}
sum() {
return this.val1 + this.val2;
}
}
Import example (how to use shared code):
// Import the 'add' function from 'mymodule.js'
import { add } from './mymodule.js';
console.log(add(1, 2)); // This will print 3
// Import the 'Calculator' class
import { Calculator } from './mymodule.js';
const myCalc = new Calculator(5, 3);
console.log(myCalc.sum()); // This will print 8
Keeping JavaScript Safe
JavaScript can be used to make websites interactive, but it also needs to be safe. Web browsers have rules to protect you.
First, JavaScript code runs in a "sandbox." This means it can only do things related to the web page. It can't, for example, create or delete files on your computer. Second, there's a "same-origin policy." This rule stops code from one website (like a game site) from looking at your information on another site (like your bank). Most security problems with JavaScript happen when these rules are broken.
Cross-Site Scripting (XSS)
One common problem is called "cross-site scripting" (XSS). This happens when a bad person tricks a website into showing you a harmful script. This script might then try to steal your information from that website. To prevent this, websites need to be careful about what information they show on their pages.
Cross-Site Request Forgery (CSRF)
Another trick is "cross-site request forgery" (CSRF). Here, a bad website might trick your browser into doing something you didn't mean to do on another site, like transferring money from your bank. Websites try to prevent this by asking for special hidden codes to confirm your actions.
Not Trusting the User's Computer
Website creators must remember that your computer might not always run their JavaScript exactly as they planned. This means:
- Websites can't completely hide how their JavaScript works, because the code has to be sent to your computer.
- If a website checks your form input (like if you typed a number correctly) using JavaScript, it's just for convenience. The website also needs to check it on their own web server to be truly secure.
- You can sometimes turn off JavaScript, so websites can't rely on it to stop you from doing things like saving an image.
- Sensitive information, like passwords, should never be hidden in JavaScript code.
Trusting Other Developers
Many JavaScript projects use code written by other developers, called "libraries." Developers trust that these libraries are safe and up-to-date. But sometimes:
- A library might have a new version that causes problems or security holes in programs that use it.
- A library might not get updated, leaving known security problems unfixed.
- Sometimes, a developer might even remove their library entirely, which can break many websites and apps that depend on it.
Browser and Plugin Issues
Web browsers and their extra tools (plugins) can sometimes have their own security flaws. These flaws could allow a bad person to run harmful code on your computer. Companies like Microsoft and Google work hard to make sure their browsers run JavaScript in a safe, limited way.
Tools for JavaScript Developers
Many helpful tools exist to make writing JavaScript easier:
- Most web browsers have special "developer tools" built-in. These include a "debugger" that helps find mistakes in code.
- Tools like ESLint check JavaScript code to make sure it follows good rules and styles.
- Some browsers have "profilers" that help developers see how fast their code runs.
- Many text editors highlight JavaScript code in different colors, making it easier to read.
Things Related to JavaScript
Java
People often confuse JavaScript with Java. They both appeared in 1995 and have similar-looking code. Also, JavaScript was designed with some of Java's ideas in mind.
However, they are very different:
- Java needs to be "compiled" into a special code before it runs, while JavaScript runs directly from the code you write.
- Java uses "classes" to create objects, while JavaScript uses "prototypes."
- Java is "statically typed" (you declare data types beforehand), while JavaScript is "dynamically typed" (data types can change).
JSON
JSON is a way to organize data that came from JavaScript. It stands for "JavaScript Object Notation." It's now used by many other programming languages to share information.
Transpilers
For big websites that use a lot of JavaScript, "transpilers" are helpful. These tools convert code written in other languages (like TypeScript or CoffeeScript) into JavaScript. This can make development faster and easier.
WebAssembly
WebAssembly is a newer language designed to work with JavaScript. It's especially good for parts of web pages that need to run very fast, like games. It runs in the same safe "sandbox" as JavaScript.
Images for kids
See also
In Spanish: JavaScript para niños