Web

Technology -
II
chapter - 3
Scripting Languages
 A scripting language is a type of programming language in which
the instructions are interpreted individually at runtime.
 Scripting languages are interpreted from source code directly,
without the need for compilation, using an interpreter to translate
commands.
 It is important to note that all scripting languages are
programming languages, but not all programming languages are
scripting languages.
 There are many scripting languages, such as Python, JavaScript,
Perl, Ruby, Node.js, and PHP, that are extensively used to develop
software products, web development, and data analysis.
 The major advantage of this language is that it can run on multiple
platforms; hence, it can work on different OS without any
modification.
 HW Difference between Programming and Scripting.
Client-side scripting
 Web browsers execute client-side scripting. It is used when
browsers have all code.
 Source code is used to transfer from webserver to user’s
computer over the internet and run directly on browsers.
 It is also used for validations and functionality for user events.
 It allows for more interactivity. It usually performs several
actions without going to the user.
 It cannot be basically used to connect to databases on a web
server.
 These scripts cannot access the file system that resides in the
web browser. Pages are altered on basis of the user’s choice.
 It can also be used to create “cookies” that store data on the
user’s computer.
Advantages of Client Side
Scripting
 Allow for more interactivity by immediately responding to
users’ actions.
 Execute quickly because they do not require a trip to
the server.
 May improve the usability of Web sites for users whose
browsers support scripts.
 Can give developers more control over the look and
behaviour of their Web widgets.
 Can be substituted with alternatives (for example, HTML)
if users’ browsers do not support scripts
 Are reusable and obtainable from many free resources.
Disadvantages of Client Side
Scripting
 Not all browsers support scripts, therefore, users might
experience errors if no alternatives have been provided.
 Different browsers and browser versions support scripts
differently, thus more quality assurance testing is
required.
 More development time and effort might be required (if
the scripts are not already available through other
resources).
 Developers have more control over the look and
behaviour of their Web widgets; however, usability
problems can arise if a Web widget looks like a
standard control but behaves differently or vice-versa.
Server Side Scripting
 Web servers are used to execute server-side
scripting.
 They are basically used to create dynamic pages.
 It can also access the file system residing at the
webserver.
 A server-side environment that runs on a
scripting language is a web server.
 Scripts can be written in any of a number of
server-side scripting languages available.
 It is used to retrieve and generate content for
dynamic pages.
Advantages of Server Side
Scripting
 The site can use a content management
system which makes editing simpler.
 Generally quicker to load than client-side
scripting
 User is able to include external files to save
coding.
 Scripts are hidden from view so it is more
secure. Users only see the HTML output.
 User does not need to download plugins like
Java or Flash.
Disadvantages of Server Side
Scripting
 Many scripts and content management
systems tools require databases in order
to store dynamic data.
 It requires the scripting software to be
installed on the server.
 The nature of dynamic scripts creates
new security concerns, in some cases
making it easier for hackers to gain
access to servers exploiting code flaws.
JavaScript
 JavaScript is a lightweight programming
language commonly used by web
developers to add dynamic interactions
to web pages, applications, servers, and
even games.
 It creates elements for improving site
visitors’ interaction with web pages,
such as dropdown menus, animated
graphics, and dynamic background
colors.
Features of JavaScript
 All popular web browsers support JavaScript as they provide
built-in execution environments.
 JavaScript follows the syntax and structure of the C
programming language. Thus, it is a structured programming
language.
 JavaScript is a weakly typed language, where certain types are
implicitly cast (depending on the operation).
 JavaScript is an object-oriented programming language that
uses prototypes rather than using classes for inheritance.
 It is a light-weighted and interpreted language.
 It is a case-sensitive language.
 JavaScript is supportable in several operating systems
including, Windows, macOS, etc.
 It provides good control to the users over the web browsers.
Limitations of JavaScript
 Security Issues: JavaScript is client-side scripting language which means the
code runs on the user’s computer. This can lead to security issues if not
implemented properly.

Browser Support: Not all browsers support the latest version of JavaScript. This
can lead to compatibility issues when developing cross-browser applications.

Speed Issues: JavaScript can be slower than other languages due to its
interpreted nature. This can cause performance issues in applications that
require high performance.

Poor Error Handling: JavaScript does not have a good error handling
mechanism which can make debugging difficult.

Lack of Libraries: JavaScript has limited libraries compared to other languages
such as Java or Python.
 Hw. Write a brief note on Internet Technology
Keywords and Reserve Words
 A reserved word is a word that is already
defined by the JavaScript library and cannot
be used as an identifier, such as name of a
variable, function, or label.
 Keywords have special use in JavaScript and
cannot be used as identifiers.
 For example, the var and let keywords are
used to define variables,
the function keyword is used to define the
functions, etc.
Identifier
 An identifier is a name of variable,
function/method, or property.
 It is a sequence of characters in the
code i.e. variable, function/method, or
property.
Rules for writing identifier
 Identifier names must start with either a letter, an underscore _, or the
dollar sign $
//valid
const a = 'hello';
const _a = 'hello';
const $a = 'hello';
//invalid
const 1a = 'hello'; // this gives an error
 JavaScript is case-sensitive. So y and Y are different identifiers. For
example,
const y = "hi";
const Y = 5;
console.log(y); // hi console.log(Y); // 5
 Keywords cannot be used as identifier names. For example,

//invalid
const new = 5; // Error! new is a keyword.
document.write()
 Thisis used to display or write a text in
a web page.
 The output of the below program is 11
Using innerHTML
(document.getElementById(id)
 JavaScript can use the document.getElementById(id)
method to access the HTML element. The id attribute
defines the HTML element.
Using Button
 Itwill display a button and onclick it will
display the message.
window.alert()
 This is one of the popup functions defined by JavaScript.
 It displays the content or message using an alert box.
 The window object in JavaScript is the global scope object, hence
variables, properties and methods by default belong to the window
object. Hence, keyword window is optional .
console.log()
 The console.log() is a function in JavaScript
which is used to print any kind of variables
defined in it.
 It just print any message that needs to be
displayed to the user.
Adding JavaScript to HTML
 There are three different ways using
which user can add JavaScript into
webpage:
 Inline JavaScript
 Internal JavaScript
 External JavaScript
Inline JavaScript
 JavaScript written within the HTML
element with the event handling
attribute then it is called as Inline
JavaScript/
 This method is used when we have to
call a function in the HTML event
handler attribute.
 Javascript code can be added directly on
onclick, onmouseover, onload etc.
Inline JavaScript Code example
Internal JavaScript
 Itis also called embedding the
JavaScript code in HTML.
 When JavaScript written in same HTML
page inside a script element then it is
called as internal JavaScript.
 JavaScript can be written either in Head
section or in body section of HTML.
Internal Javascript code
External JavaScript
 In this method, first JavaScript code are
written in seperate external fiel and
stored using the .js extension and the
include it in HTML page using src attribute
of <script> tag.
 Steps

1. Create JavaScript file within same folder

2. Create your html file.
3. Run the file
 save this code to script.js
 document.write(“This is external JavaScript”)
 Now create another file external.html and write the code

<html>
<head>
<script type= “text/javascript” src= “./script.js”>
</script>
</head>
<body>
</body>
</html>
JavaScript DataTypes
 There are two type of Data types
 Primitive
 Non primitive

Primitive Data Type : - Primitive data

types are immutable data types (values
cannot be changed)
Data Type Description

String Represents sequence of characters e.g. “Hello world”

Number Represents numeric values e.g. 15

Boolean Represents Boolean values either true or false

Null represents null i.e. no value

Non-primitive
 Non primitive values are mutable data
types. The value of an object can be
changed after it gets created.
 Objects are not compared by value.

Data types Description

Object Represents instances through which
we can access members
Array Represents group of similiar values
RegExp Represents regular expression
Varriables
A variable is a named given to store a
value.
 It is a name of storage location.
 JavaScript variable can hold a value of
any data type.
 Declaration Syntax:

var name;
var address;
var phone, country;
Example
Scope of variable
Variable scope is the context of the program in
which it can be accessed. In programming, a
variable is a named storage location that holds
data or a value.
Variable scope in JavaScript is the region of the
code where a particular variable can be
accessed or modified.

 Global Scope variable

 Local Scope Variable
Global Scope Variable
 Variablesdeclared Globally (outside of
any function) have Global Scope and
Global variables can be accessed from
anywhere in a program.
Local Scope Variables
 Variables declared inside a function
become local to the function.
 Local variables are created when a
function starts and deleted when the
function is executed.
 Local variables have Function Scope
which means that they can only be
accessed from within the function.
 Global Scope Variable Example

 Local Scope Variable

Rules for writing variables
 Spaces are not allowed in variable names.
 Only letters, digits, underscores, and
dollar signs are permitted in variable names.
 Case matters when it comes to variable names.
 A letter (alphabet), an underscore (_), or a
dollar sign ($) must be the first character in a
variable name, any other special characters
must not be taken.
 certain terms such as reserved words in
javascript shouldn’t be used to name variables.
Operators in Javascript
 JavaScript Operators are symbols
used to perform specific mathematical,
comparison, assignment, and logical
computations on operands.
 They are fundamental elements in
JavaScript programming, allowing
developers to manipulate data and
control program flow efficiently.
JavaScript Operators
 ArithmeticOperators
 Assignment Operators
 Comparison Operators
 Logical Operators
 Bitwise Operators
 String Operators
 Miscellaneous Operators
Arithmetic Operators
Comparision Operators
 The JavaScript comparison operators compare two
values and returns a boolean result (true or false).
 JavaScript supports the following comparison
operators −
Logical Operators
 The logical operators are generally used
to perform logical operations on boolean
values.
 But logical operators can be applied to
values of any types not only boolean.
Functions In JavaScript
 JavaScript functions are used to perform operations.
We can call JavaScript function many times to reuse the
code.
 Functions are useful in organizing the different parts of
a script into the several tasks that must be completed.
There are mainly two advantages of JavaScript
functions.
 Code reusability: We can call a function several times
in a script to perform their tasks so it saves coding.
 Less coding: It makes our program compact. We don't
need to write many lines of code each time to perform
a common task.
Example of Function
function showMessage()
{
alert( 'Hello everyone!' );
}
showMessage();
<script>
function msg()
{
alert("hello! this is message");
}
</script>
<input type=button onclick=msg()
value="call function"/>
function welcomeMsg(name)
{
return ("Hello " + name + " welcome to
GeeksforGeeks");
}

var namevalue= "User";

console.log(welcomeMsg(namevalue));
 function square (number) {
return number * number;
};
var x = square(4);
console.log(x);
Control Structures
 JavaScript control statement is used
to control the execution of a program
based on a specific condition.
 If the condition meets then a particular
block of action will be executed
otherwise it will execute another block
of action that satisfies that particular
condition.
If Statement

 we can use if statement to check a specific

condition, the code block gets executed when
the given condition is satisfied.
<script>
var num = 5;
if (num > 0)
{
console.log("The number is positive.");
};
</script>
If-Else Statement

 The if-else statement will perform some

action for a specific condition.
 If the condition meets then a particular
code of action will be executed
otherwise it will execute another code of
action that satisfies that particular
condition.
let num = -10;
if (num > 0)
console.log("The number is positive.");
else
console.log("The number is negative");
switch statement
 The JavaScript switch
statement evaluates an expression and
executes a block of code based on
matching cases. It provides an
alternative to long if-else chains,
improving readability and
maintainability, especially when
handling multiple conditional branches.
let day = 3;
let dayName;

switch (day) {
case 1:
dayName = "Sunday";
break;
case 2:
dayName = "Monday";
break;
case 3:
dayName = "Tueday";
break;
case 4:
dayName = "Wednesday";
break;
case 5:
dayName = "Thursday";
break;
case 6:
dayName = "Friday";
break;
case 7:
dayName = "Saturday";
break;
default:
dayName = "Invalid day";
}

console.log(dayName); // Output: Tuesday