Practical Introduction to JavaScript

·

4 min read

Have you ever visited a website and exclaimed how cool and interactive features it has?🤩Well, JavaScript was probably making it happen.

Yes,it's JavaScript .

  • It is helpful in making interactive and dynamic website.

  • Process data

  • Making games

  • Mobile and desktop apps

  • Presentations

  • Server Applications
  • Web Servers

JavaScript is the Programming Language for the Web.JavaScript can update and change both HTML and CSS.

JavaScript can calculate, manipulate and validate data.

JavaScript is a text-based programming language used both on the client-side and server-side that allows you to make web pages interactive.

Say hello world in JavaScript

On the web, JavaScript code lives inside the HTML document, and needs to be enclosed by

<script>
document.write("Hello World!");
</script>
//Output Hello World!

Output to the console

But wait what is console 🤔? console is part of the web browser and allows you to log messages, run JavaScript code, and see errors and warnings. Let's see how console looks. Screenshot_20210530-150159~2.png To output we need to use a very important function called console.log

console.log("This I am printing in console")

Now we shall learn to write basic code in JavaScript but before that we need to know few things,let's have a look at them.

JavaScript comments

The JavaScript comment feature simplifies the production of more readable code.A JavaScript comment block (also known as the multi-line comment) begins with */ , while a single line comment starts with //.

JavaScript variables.

variables are containers for storing data values.The value of a variable can change throughout the program.

Declaring a variable is as simple as using the keyword var.

Naming convention for variable:

1.The first character must be a letter or an underscore (_). You can't use a number as the first character.

2.The rest of the variable name can include any letter, any number, or the underscore. You can't use any other characters, including spaces, symbols, and punctuation marks.

JavaScript variable names are case sensitive. JavaScript variables with lowercase and uppercase characters are different

Here, a, b, c are variables, declared with the var keyword:

var a = 5;
var b = 6;
var c = a*b;
document.write(c);
//Output :30

JavaScript datatypes

Data types in JavaScript describe the different types or kinds of data that you will be working with and storing in variables

Screenshot_20210530-154503~2.png Different datatypes in JavaScript are:

1.Number.

Number represents integer and floating numbers (decimals and exponentials).

var a=250; // integer value
var b=25.5; // a number containing a decimal
var c = 10e4 // an exponential value

2.String

String is used to store text. In JavaScript, strings are surrounded by quotes:

Single quotes: 'Hello' Double quotes: "Hello" Backticks: Hello

var str1 = “hello";

3.Boolean

This data type represents logical entities. Boolean represents one of two values: true or false. It is easier to think of it as a yes/no switch.

const check=true;
const check=false;

4.Undefined

The undefined data type represents value that is not assigned. If a variable is declared but the value is not assigned, then the value of that variable will be undefined

var a;
console.log(a); // This will return undefined.

5.Null

In JavaScript, null is a special value that represents empty or unknown value

var a = null;
console.log(a); // This returns null

6.Symbol

A value having the data type Symbol can be referred to as a symbol value. Symbol is an immutable primitive value that is unique .

const value1= symbol ("apple");
const value2=symbol("apple");

Here,value1 and value2 are different because they are of symbol datatypes. Array in JavaScript arrays are used to store multiple values in a single variable. We have 3 ways of of constructing array in JavaScript

7.object

An object is a complex data type that allows us to store collections of data.Itbis non primitive data type. Eg: function,date,array,time,etc.


const stu={
name="ram";
Stu_class=10;
phno.=0987654321
};

Arrays in JavaScript

arrays are used to store multiple values in a single variable. There are 3 ways of making array in JavaScript.

1.JavaScript array literal


<script>  
var stu=["ram","shyam","vinod"];  
for (i=0;i<stu.length;i++){  
document.write(stu[i] + "<br/>");  
}  
</script>

2.JavaScript array constructor

In this we,need to create instance of array by passing arguments in constructor so that we don't have to provide value explicitly.



<script>  
var stu=new Array("ram","shyam","vinod");  
for (i=0;i<stu.length;i++){  
document.write(stu[i] + "<br>");  
}  
</script>

3.JavaScript Array directly

<script>  
var i;  
var stu = new Array();  
stu[0] = "ram";  
stu[1] = "shyam";  
stu[2] = "vinod";  

for (i=0;i<emp.length;i++){  
document.write(emp[i] + "<br>");  
}  
</script>