00. Introduction to JavaScript
This article will introduce javascript.
What is ECMA Script?
ECMA Script is a standard on which javascript is based.
It was created to ensure that different documents on javascript are actually talking about the same language.
Statically typed or Dynamically typed?
JavaScript is a dynamically typed language. This means that variable types are determined at runtime, and you do not need to explicitly declare the type of a variable before using it. You can assign different types of values to a variable during its lifetime.
For example, in JavaScript, you can do the following:
let x = 10; // x is now a number
x = "Hello"; // x is now a string
x = true; // x is now a boolean
On the other hand, statically typed languages require you to declare the variable's type explicitly, and the type checking is done at compile-time, before the code is executed. Languages like Java, C++, and TypeScript are statically typed, and they require you to specify the variable type explicitly when declaring them:
int x = 10; // x is a variable of type int
String name = "John"; // name is a variable of type String
JavaScript's dynamic typing allows for more flexibility but can lead to potential runtime errors if not handled carefully. Static typing, on the other hand, provides better type safety at the cost of some initial verbosity and strictness.
How to execute JavaScript?
1. Inside browser
You can open
Consolein dev tools and start writing javascript there.
2. By installing javascript runtime viz. Node.js.
3. By inserting it inside <script> tag of an HTML document.
<script>tag can be placed in the<head>, or in the<body>section of an HTML page, or in both.
Inside
<head>JavaScript is loaded and executed before DOM rendering.
In production, we do like this
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Title</title> <script src="script.js" defer></script> </head> <body style="font-family: cursive"> <h1>Introduction to JavaScript</h1> </body> </html>Usually used for external scripts that load asynchronously but defer execution until DOM renders (
deferattribute).
Before the closing
</body>tagEnsures that the DOM is fully loaded before calling (only load not execution) the script in the browser.
Improves page load speed because the browser does not block DOM rendering, as the script is loaded and executed at the end.
"use strict" in JavaScript
The "use strict" directive enables strict mode in JavaScript, which enforces stricter rules, helps eliminate silent errors by turning them into explicit errors, and encourages better coding practices. It makes JavaScript code more secure, reliable, and easier to debug.
Strict mode can be applied to an entire script or within a specific function.
- Global Scope: Place
"use strict";as the first statement in your JavaScript file to enable it for the entire script.
"use strict";
// All code in this file runs in strict mode
let name = "Sourav";
- Function Scope: Place
"use strict";as the first statement inside a function body to enable it only within that function's scope.
function myFunction() {
"use strict";
// Code in here runs in strict mode
}
// Code outside the function runs in non-strict (sloppy) mode
Happy reading!