This session describes the scripting languages. The session also explores the JavaScript language and versions used in the language. It further describes the variables, data types, methods, built in functions, event handling.
In this Session, you will learn to:
- Explain scripting
- Explain the JavaScript language
- Explain the client-side and server-side JavaScript
- List the variables and data types in JavaScript.
- Describe the JavaScript methods to display information
- Explain escape sequence and built in functions in JavaScript
- Explain events and event handling
- Explain operators and their types in JavaScript
- Explain regular expressions in JavaScript
- Explain decision-making statements in JavaScript
- Explain while loop
- Explain for loop
- Explain do...while loop
- Explain break and continue statement
- Explain single-dimensional arrays
- Explain multi-dimensional arrays
- Explain for..in loop
Consider an organization that provides a Website that allows its customers to view their products. The company has received frequent customer feedbacks to provide the shopping facility online. Therefore, the company has decided to add the shopping facility in their Website by creating dynamic Web pages. These Web pages will allow the user to shop for the products online. For example, details such as credit card number, email, and phone number entered by the customer must be in a proper format. Further, the developer also requires to retrieve the chosen products and their quantity to calculate the total cost.
The developer can handle all these critical tasks by using a scripting language. A scripting language refers to a set of instructions that provides some functionality when the user interacts with a Web page.
Scripting refers to a series of commands that are interpreted and executed sequentially and immediately on occurrence of an event. This event is an action generated by a user while interacting with a Web page. Examples of events include button clicks, selecting a product from a menu, and so on. Scripting languages are often embedded in the HTML pages to change the behaviour of the Web pages according to the user’s requirements.
There are two types of scripting languages, described as follows:
-
Client-side Scripting
- Refers to a script being executed on the client’s machine by the browser.
-
Server-side Scripting
- Refers to a script being executed on a Web server to generate dynamic HTML pages.
JavaScript is a scripting language that allows you to build dynamic Web pages by ensuring maximum user interactivity. JavaScript language is an object-based language, which means that it provides objects for specifying functionalities. In real life, an object is a visible entity such as a car or a table. Every object has some characteristics and is capable of performing certain actions. Similarly, in a scripting language, an object has a unique identity, state, and behaviour.
The identity of the object distinguishes it from the other objects of the same type. The state of the object refers to its characteristics, whereas the behavior of the object consists of its possible actions. The object stores its identity and state in fields (also called variables) and exposes its behaviour through functions (actions).
| Car | Table |
|---|---|
| Identity: BMW F90 M5 | Identity: T002 |
| State: Color-Red, Wheels-Four | State: Color-Brown |
| Behavior: Running | Behavior: Stable |
The first version of JavaScript was developed by Brendan Eich at Netscape in 1995 and was named JavaScript 1.0. Netscape Navigator 1.0 and Internet Explorer 3.0 supported JavaScript 1.0. Over the period, it gradually evolved with newer versions where each version provided better features and functionalities as compared to their previous versions.
Table 11.1 lists various versions of JavaScript language, also called as ECMAScript.
| Edition | Name | Description |
|---|---|---|
| 1 | ECMAScript 1 (1997) | First edition |
| 2 | ECMAScript 2 (1998) | Supported by Internet Explorer from version 4.0 |
| 3 | ECMAScript 3 (1999) | Added regular expressions and try/catch and was supported by Internet Explorer 5.0, Netscape Navigator 1.0, and Opera 5.0 onwards |
| 5 | ECMAScript 5 (2009) | Added features such as ‘strict mode’, JSON support, String.trim(), Array.isArray(), and Array iteration methods. Is supported by Internet Explorer 6.0 and Mozilla Firefox 1.0 onwards. |
| 6 | ECMAScript 2015 | Was published in 2015 and added features such as let and const, default parameter values, Array.find(), and Array.findIndex() |
| 7 | ECMAScript 2016 | Was published in 2016 and added exponential operator and Array.prototype.includes |
| 8 | ECMAScript 2017 | Was published in 2017 and added features such as string padding, Object.entries, Object.values, async functions, and shared memory |
| 9 | ECMAScript 2018 | Was published in 2018 and added features such as rest/spread properties, asynchronous iteration, and Promise.finally() |
| 10 | ECMAScript 2019 | Was published in 2019 and added features such as Array.prototype.flat, Array.prototype.flatMap, and Object.fromEntries |
| 11 | ECMAScript 2020 | Was published in June 2020 and introduces a BIGINT primitive type for arbitrary-sized integers, nullish coalescing operator, and globalThis object. |
| 12 | ECMAScript 2021 | Was published in June 2021 and introduces replaceAll method for Strings, Promise.any.AggregateError, WeakRef, and other features. |
JavaScript is a scripting language, which can be executed on the client-side and on the server-side. A client-side JavaScript (CSJS) is executed by the browser on the user’s workstation. A client-side script might contain instructions for the browser to handle user interactivity. These instructions might be to change the look or content of a Web page based on the user inputs. Examples include displaying a welcome page with the username, displaying date and time, validating that the required user details are filled, and so on.
A JavaScript is either embedded in an HTML page or is separately defined in a file, which is saved with a .js extension. In client-side scripting, when an HTML page is requested, the Web server sends all the required files to the user’s computer. The Web browser executes the script and displays the HTML page to the user along with any tangible output of the script.
A server-side JavaScript (SSJS) is executed by the Web server when an HTML page is requested by a user. The output of a server-side JavaScript is sent to the user and is displayed by the browser. In this case, a user might not be aware that a script was executed on the server to produce the desirable output.
A server-side JavaScript can interact with the database, fetch the required information specific to the user, and display it to the user. This means that server-side scripting fulfills the goal of providing dynamic content in a web page. Unlike client-side JavaScript, HTML pages using server-side JavaScript are compiled into bytecode files on the server. Compilation is a process of converting the code into machine-independent code. This machine-independent code is known as the bytecode, which is an executable file. The Web server runs this executable to generate the desired output.