Youtube Reference : Click Here
JavaScript was initially created to “make web pages alive”.
The programs in this language are called scripts. They can be written right in a web page’s HTML and run automatically as the page loads. Scripts are provided and executed as plain text. They don’t need special preparation or compilation to run.
In this aspect, JavaScript is very different from another language called Java.
When JavaScript was created, it initially had another name: “LiveScript”. But Java was very popular at that time, so it was decided that positioning a new language as a “younger brother” of Java would help.
But as it evolved, JavaScript became a fully independent language with its own specification called ECMAScript, and now it has no relation to Java at all.
‘Java and JavaScript have the same relation as that of car and carpet ‘- Gitman
Today, JavaScript can execute not only in the browser, but also on the server, or actually on any device that has a special program called the JavaScript engine.
The browser has an embedded engine sometimes called a “JavaScript virtual machine”.
Different engines have different “codenames”. For example:
- V8 – in Chrome and Opera.
- SpiderMonkey – in Firefox.
Engines are complicated. But the basics are easy.
- The engine (embedded if it’s a browser) reads (“parses”) the script.
- Then it converts (“compiles”) the script to the machine language.
- And then the machine code runs, pretty fast.
JavaScript in Frontend
To include and run JavaScript in your HTML file, you need to include the JavaScript File by the <script> tag or you can also write the javascript code inside the HTML file in the script tag.
- Include External File
<script src="path_to_js_file"></script>
2) JS code inside HTML file
<script>
//Your JS code here<br>
</script><br>
Most of the time, a JavaScript application needs to work with information. Here are two examples:
1. An online shop – the information might include goods being sold and a shopping cart.
2. A chat application – the information might include users, messages, and much more.
Variables are used to store this information.
A variable is a “named storage” for data. To create a variable in JavaScript, use the let keyword.
The statement below creates a variable with the name “message”:
let message ;We can also change it as many times as we want:
let message;
message = 'Hello!';
message = 'World!'; // value changed
alert(message); //alert is used to pop up an alert on the page
When the value is changed, the old data is removed from the variable:
To declare a constant (unchanging) variable, use const instead of let:
const myBirthday = '18.04.1982';Variables declared using const are called “constants”. They cannot be reassigned. An attempt to do so would cause an error
const myBirthday = '18.04.1982';
myBirthday = '01.01.2001'; // error, can't reassign the constant!<br>
When a programmer is sure that a variable will never change, they can declare it with const to guarantee and clearly communicate that fact to everyone.
undefined means a variable has been declared but has not yet been assigned a value. On the other hand, null is an assignment value. It can be assigned to a variable as a representation of no value. Also, undefined and null are two distinct types: undefined is a type itself (undefined) while null is an object.
In short When the variable is not initialized the typeof variable is undefined, while null is is assigned to a variable by the programmer explicitly. A string in JavaScript must be surrounded by quotes.
let str = "Hello";
let str2 = 'Single quotes are ok too';
let phrase = `can embed ${str}`;
In JavaScript, there are 3 types of quotes.Double quotes: "Hello".
Single quotes: 'Hello'.
Backticks: `Hello`.
Double and single quotes are “simple” quotes. There’s no difference between them in JavaScript.
Backticks are “extended functionality” quotes. They allow us to embed variables and expressions into a string by wrapping them in ${…}, for example:
let name = "John";
// embed a variable
alert( `Hello, ${name}!` ); // Hello, John!
// embed an expression
alert( `the result is ${1 + 2}` ); // the result is 3
The expression inside ${…} is evaluated and the result becomes a part of the string. We can put anything in there: a variable like name or an arithmetical expression like 1 + 2 or something more complex.
Please note that this can only be done in backticks. Other quotes don’t have this embedding functionality!
alert( "the result is ${1 + 2}" ); // the result is ${1 + 2} (double quotes do nothing)
Syntax
function functionName(Parameter1, Parameter2, ..)<br>
{
// Function body<br>
}
An object can be created with figure brackets {…} with an optional list of properties. A property is a “key: value” pair, where a key is a string (also called a “property name”), and value can be anything.To understand this rather abstract definition, let us look at an example of a JavaScript Object :
let school = {
name : "AIT",
location : "Pune",
established : "1994"
}
Each of these keys is referred to as properties of the object. An object in JavaScript may also have a function as a member, in which case it will be known as a method of that object.
Let us see such an example :
let college = {
name: 'AIT',
location : 'Pune',
established : '1994',
displayInfo : function(){
console.log(`${college.name} was established
in ${school.established} at ${college.location}`);
}
}
school.displayInfo();
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent