JavaScript

JavaScript is a programming language that executes on the browser. It turns static HTML web pages into interactive web pages by dynamically updating content, validating form data, controlling multimedia, animate images, and almost everything else on the web pages.

JavaScript is the third most important web technology after HTML and CSS. JavaScript can be used to create web and mobile applications, build web servers, create games.

In early 1995, Brendan Eich from Netscape designed and implemented a new language for non-java programmers to give newly added Java support in Netscape navigator. It was initially named Mocha, then LiveScript, and finally JavaScript.

Nowadays, JavaScript can execute not only on browsers but also on the server or any device with a JavaScript Engine. For example, Node.js is a framework based on JavaScript that executes on the server.

Ecma International is a non-profit organization that creates standards for technologies. ECMA International publishes the specification for scripting languages is called 'ECMAScript'. ECMAScript specification defined in ECMA-262 for creating a general-purpose scripting language.

JavaScript is officially maintained by ECMA (European Computer Manufacturers Association) as ECMAScript.

JavaScript is an object-oriented language, and it also has some similarities in syntax to Java programming language.

ROLES OF JAVASCRIPT

You can modify the content of a web page by adding or removing elements.
You can change the style and position of the elements on a web page.
You can monitor events like mouse click, hover, etc. and react to it.
You can perform and control transitions and animations.
You can create alert pop-ups to display info or warning messages to the user.
You can perform operations based on user inputs and display the results.
You can validate user inputs before submitting it to the server.

Basic Rules for JavaScript

JavaScript is case-sensitive. This means that variables, language keywords, function names, and other identifiers must always be typed with a consistent capitalization of letters.
Each line must be terminate by semicolon . ;
Extension JavaScript file is “.js”.

Adding JavaScript

There are typically three ways to add JavaScript to a web page:

<script> and </script> Tag : Embedding the JavaScript code between a pair of <script> and </script> tag.

<head>

<title>Embedding JavaScript </title>

</head>

<body>

var greet = "Hello World!";

document.write(greet); // Prints: Hello World!

</script>

</body>

</html>

2. JavaScript File : Creating an external JavaScript file with the .js extension and then load it within the page through the src attribute of the <script> tag.

JavaScript File:

3. HTML Tag: Placing the JavaScript code directly inside an HTML tag using the special tag attributes such as onclick, onmouseover, onkeypress, onload, etc.

<head>

<title>Including External JavaScript File</title>

</head>

<body>

Click Me

</button>

</body>

</html>

Difference Between Client-side and Server-side Scripting

Client-side scripting languages such as JavaScript, VBScript, etc. are interpreted and executed by the web browser, while server-side scripting languages such as PHP, ASP, Java, Python, Ruby, etc. runs on the web server and the output sent back to the web browser in HTML format.

Client-side scripting has many advantages over traditional server-side scripting approach. For example, you can use JavaScript to check if the user has entered invalid data in form fields and show notifications for input errors accordingly in real-time before submitting the form to the web-server for final data validation and further processing in order to prevent unnecessary network bandwidth usages and the exploitation of server system resources.

Also, response from a server-side script is slower as compared to a client-side script, because server-side scripts are processed on the remote computer not on the user's local computer.

JavaScript Variable:

JavaScript support three types of variables .

1. Var

2. Let

3. Const

Note: In JavaScript, if a variable has been declared, but has not been assigned a value explicitly, is automatically assigned the value undefined (garbage).

Var

· It allow to create variables , which are able to store any type of value .

· It also allow to store multiple type of value into a variables .

· also declare multiple variables and set their initial values in a single statement

· Each variable are separated by commas.

· All the var type of variables have global access , which allow to access in whole webpage.

Type of data which we store into variables

1. Numeric

2. Textual

3. Boolean

Generating Output in JavaScript

There are certain situations in which you may need to generate output from your JavaScript code. For example, you might want to see the value of variable, or write a message to browser console to help you debug an issue in your running JavaScript code, and so on.

In JavaScript there are several different ways of generating output including writing output to the browser window or browser console, displaying output in dialog boxes, writing output into an HTML element, etc.

Writing Output to Browser Console

// Printing a simple text message

console.log("Hello World!"); // Prints: Hello World!

// Printing a variable value

var x = 10;

var y = 20;

var sum = x + y;

console.log(sum); // Prints: 30

</script>

Displaying Output in Alert Dialog Boxes

// Displaying a simple text message

alert("Hello World!"); // Outputs: Hello World!

// Displaying a variable value

var x = 10;

var y = 20;

var sum = x + y;

alert(sum); // Outputs: 30

</script>

Writing Output to the Browser Window

// Printing a simple text message

document.write("Hello World!"); // Prints: Hello World!

// Printing a variable value

var x = 10;

var y = 20;

var sum = x + y;

document.write(sum); // Prints: 30

</script>

Inserting Output Inside an HTML Element

<body>

// Writing text string inside an element

document.getElementById("greet").innerHTML = "Hello World!";

// Writing a variable value inside an element

var x = 10;

var y = 20;

var sum = x + y;

document.getElementById("result").innerHTML = sum;

</script>

</body>

JavaScript Operators

Operators are symbols or keywords that tell the JavaScript engine to perform some sort of actions. For example, the addition (+) symbol is an operator that tells JavaScript engine to add two variables or values, while the equal-to (==), greater-than (>) or less-than (<) symbols are the operators that tells JavaScript engine to compare two variables or values, and so on.

Types of Operators

1. Arithmetic Operators (+, -, *, /, %)

2. Assignment Operators (=, +=, -=, *=, /=, %=)

3. String Operators (+, +=)

4. Increment/Decrement Operators (++x, --x, x++, x--)

5. Logical Operators (&&, ||, !) : use to combine more than one condition into one expression a,I,o,u,e

6. Comparison Operators (>, <, >=, <=, ==, !=)

Arithmetic Operator

27/5 à 5 à quotient

27%5 à 2 remainder

Example:

<body>

var num1=6;

var num2=3;

var add=num1+num2;

document.write ("addition of 2 number"+add);

var sub=num1-num2;

document.write ("<br> subtraction of 2 number" + sub);

var mut=num1* num2;

document.write ("<br> Multiplication of 2 number" + mut);

var div=num1/num2;

document.write ("<br> division of 2 number" +div);

var mod=num1% num2;

document.write ("<br> mod of 2 numbers" + mod);

</script>

</body>

Assignment Operator

Example:

<body>

var num1=6;

var num2=3;

document.write ("befor addition" , num1);

num1 + num2 // num1= num1 + num2

document.write ("<br> after addition " , num2);

var x=8

document.write ("<br> before subtraction " , X);

x - = num2

document.write ("<br> after subtraction : , X);

Var Z=3

document.write ("<br> before multiplication " , Z);

Z= num1

document.write ("<br> after multiplication " , Z);

Var y=67

document.write ("<br> before division " , Y);

var Y/=num2

document.write("<br> after division " , Y);

var p=76

document.write _"<br> before modulis " , p);

p%=num2

document.Write ("<br> after module " , p);

</Script>

</body>

Assignment Number 1

Comparison Operator

Process à symbol

Case 1: 25 is greater than or equals to 15

Memory wastage

Case 2: 25 >=15

Example:

<body>

var n1=4;

var n2="4";

document.write ( " Equals: " + ( n1= = n2));

document.write ( " <br> Not Equals : " + ( n1! = n2));

document.write ( " <br> Identical : " + (n1 === n2));

</script>

</body>

String Operators

There are two operators which can also use for strings operator doscription exaples results

Example:

<body>

var num1=6;

var num2=3;

document.write ("befor addition" , num1);

num1 + num2 // num1= num1 + num2

document.write ("<br> after addition " , num2);

var x=8

document.write ("<br> before subtraction " , X);

x - = num2

document.write ("<br> after subtraction : , X);

Var Z=3

document.write ("<br> before multiplication " , Z);

Z= num1

document.write ("<br> after multiplication " , Z);

Var y=67

document.write ("<br> before division " , Y);

var Y/=num2

document.write("<br> after division " , Y);

var p=76

document.write _"<br> before modulis " , p);

p%=num2

document.Write ("<br> after module " , p);

</Script>

</body>

Page updated

Google Sites

Report abuse