Scribd
Upload
2 views

Java Script

The document provides an overview of dynamic web pages, focusing on client-side and server-side dynamic pages, with an emphasis on JavaScript as a lightweight, cross-platform scripting language. It details JavaScript's features, syntax, data types, functions, and various programming constructs such as loops, conditionals, and objects. Additionally, it covers the use of JavaScript for creating interactive web elements, variable declarations, and mathematical operations.

Uploaded by

py.hariprasad
Copyright
© © All Rights Reserved
Available Formats
Download as RTF, PDF, TXT or read online on Scribd
2 views

Java Script

The document provides an overview of dynamic web pages, focusing on client-side and server-side dynamic pages, with an emphasis on JavaScript as a lightweight, cross-platform scripting language. It details JavaScript's features, syntax, data types, functions, and various programming constructs such as loops, conditionals, and objects. Additionally, it covers the use of JavaScript for creating interactive web elements, variable declarations, and mathematical operations.

Uploaded by

py.hariprasad
Copyright
© © All Rights Reserved
Available Formats
Download as RTF, PDF, TXT or read online on Scribd
You are on page 1/ 16

Dynamic web pages:

1.Client side dynamic pages- user interaction without database


2.Server side dynamic pages- user interacts with server/database
Client side web pages designed with java script
JavaScript is an object-based scripting language which is lightweight and cross-platform.
JavaScript is not a compiled language, but it is a translated language. The JavaScript Translator
(embedded in the browser) is responsible for translating the JavaScript code for the web
browsers.
 Object can be defined to use multiple times in program.
Features of JavaScript:
1. All popular web browsers support JavaScript as they provide built-in execution
environments.
2. JavaScript follows the syntax and structure of the C programming language. Thus, it is a
structured programming language.
3. It is a light-weighted and interpreted language.
4. It is a case-sensitive language.
5. JavaScript is cross platform..ie.., supportable in several operating systems and browsers.
Like Windows, macOS, IOS, android, and all browsers like chrome, mozilla....etc.
JavaScript is used to create interactive websites. mainly used for:
Client-side validation, Dynamic drop-down menus, Displaying date and time,
Displaying pop-up windows and dialog boxes (like an alert dialog box, confirm dialog box and
prompt dialog box),
Displaying clocks etc.
Java script declaration can be done in 2 ways:
Internal declaration, that is inside the html file
* In body tag
* In head tag
External declaration
In external file, that is outside html file
In html page declaration, whether in body or head tag, must use <script> element.
external script, provides code re-usability. Ie..,single JavaScript file can be used in several html pages.
An external JavaScript file must be saved by .js extension.
It is recommended to embed all JavaScript files into a single file. It increases the speed of the
webpage.
Data types: int, char, string, double, float…etc
Function, object, variable – reusage, not storage purpose

Function: To increase code re-usability we can define functions in script.


Syntax:
function addition()
{
Executable statement;
}

Ex: function add()


{
Var a=10;----integer
Var b=20;
Var c=a+b;
Var d=”deeksha”;----string
Var e=’h’;---character
var f=0.25;---float

var x123=10;
var _a=20;
var $a=10.
Var X123=30;

---------------------------------
<html>
<body>
<h2>Welcome to JavaScript</h2>
<script>
document.write("Welcome Javascript"); // output statement
</script>
</body>
</html>
-------------------------------------

1. In body tag
<html>
<body>
<script>
function msg(){
alert("Hello Javatscript");
document.write(“sample program”);
}
</script>
<form>
<input type="button" value="click" onclick="msg()"/> // calling function through onclick event
</form>
</body>
</html>
------------------------------------------
2. in head tag

<html>
<head>
<script type="text/javascript">
function msg(){
alert("Hello Javascript");
}
</script>
</head>
<body>
<p>Welcome to Javascript</p>
<form>
<input type="button" value="click" onclick="msg()"/>
</form>
</body>
</html>
------------------------------------
3. external
function msg()
{
alert("Hello Javascript");
}
<html>
<head>
<script type="text/javascript" src="msgg.js"></script>
</head>
<body>
<form>
<input type="button" value="click" onclick="msg()"/>
</form>
</body>
</html>

------------------------------------------------
comments:
// single line comments
/* multiline comment*/
------------------------------------------
variable:
must start with datatype ie.., var.
variable name must start with alphabets/_/$ only...digits are not acceptable as a first letter of variable
name, digits can use after first letter.
variable name is case sensitive, x and X are 2 different variables.
Variables are 2 types: local and global
local: with in method/function or conditional/ control statements
global: declare at script starting and can use in multiple methods/ conditional/control statements.
<html>
<body>
<p> variable declaration in java script</p>
<script>
var x=10;
var X=20;
var _x=30;
var $x=40;
var sum=x+X+_x+$x
document.write(sum);
</script>
</body></html>

local variable
<html>
<body>
<script>

function a(){
var data=200;
document.writeln(data);
}
function b(){
var data=300;
document.writeln(data);
}
a();//calling JavaScript function
b();

</script>
</body>
</html>

global variable

<html>
<body>
<script>
var data=200;//global variable
function a(){
document.writeln(data);
}
function b(){
document.writeln(data+data);
}
a();//calling JavaScript function
b();

</script>
</body>
</html>

--------------------------------------------------------------------
accessing local variable as a global variable through window keyword.
Syn: window.variable-name;
ex: window.a=100;
<html>
<body>
<script>

function a(){
var data=200;
window.value=100;
document.writeln(data);
}
function b(){
var data=300;
document.writeln(data);
document.writeln(window.value);
}
a();//calling JavaScript function
b();

</script>
</body>
</html>
------------------------------------
accessing any global variable with in any function
<html>
<body>
<script>
var data=200;//gloabal variable
function a(){
document.writeln(data);
alert(window.data);
}
function b(){
document.writeln(data+data);
alert(window.data+window.data);
}
a();//calling JavaScript function
b();

</script>
</body>
</html>
---------------------------------

Data types:
are two types of data types in JavaScript.
Primitive data type: which are defined as default in programing by software developers
string, number, boolean, undefined, null
all these 5 types declares with datatype var
var a=10; // number int a=10
var a="value"; // string
var a= true; // booleian
var a; //undefined
var a=null; //null vale assiging
Non-primitive (reference) data type:: which are developed by designer at run time.
object, array..etc
------------------------------------
operators:
Arithmetic Operators. +,-.%,*, ++,--
Comparison (Relational) Operators: ==, >=, >,<,<=..etc
Bitwise Operators: &, |, ^,~, >>, <<
Logical Operators: &&, ||, !=
Assignment Operators" =, *=, -=, %=
--------------------------------------------------
If statements
if--
if(expression)
{
//content to be evaluated
}

ifelse-
if(expression){
//content
}
else{
//content
}
ifelseif-
if(expression1){
//content to be evaluated if expression1 is true
}
else if(expression2){
//content
}
else if(expression3){
//content
}
else{
//content
}
If(exp1)
{
If(exp2)
{
If(exp3)
{
}else
}else
}
Else
{
}

switch
to execute one code from multiple expressions
switch(expression){
case value1:
code to be executed;
break;
case value2:
code to be executed;
break;
......

default:
code to be executed if above values are not matched;
}
------------------
loops:
The JavaScript loops are used to iterate the piece of code using for, while, do while or for-in loops.
for loop- for iterative statement execution
for (initialization; condition; increment)
{
code to be executed
}
while loop- execute on condition
while (condition)
{
code to be executed
}
do-while loop- execute at least once and then on condition
do{
code to be executed
}while (condition);
------------------------------------------------

functions
provides code re-usability and less code for more action.
function functionName(arg1, arg2, ...argN)
{
//code to be executed
}

1.Function with no arguments


2. Function with argument (single or multiple)

------------------------------------------------
object:
JavaScript is an object-based language. We can define object in 3 models.
Literal object- direct object declaration.
Syn: object={property1:value1,property2:value2.....propertyN:valueN}
example: emp={id: 001, name: deeksha, salary:30000}
var id=001
var name= deeksha
var salary= 30000
var id1=

Instance object: using new keyword we will define object


var objectname=new Object();
ex: var emp= new object();

Constructor object: defines along with function


we need to create function with arguments. Each argument value can be assigned in the current object by
using this keyword.

Fun(id,name,salary)
{
This.id=idno;
This.name= name;
This.salary=salary;
}

------------------------
arrays
By array literal.... var arrayname=[value1,value2.....valueN];
By creating instance of Array directly (using new keyword)- ...
var arrayname=new Array();
By using an Array constructor (using new keyword)
----------------------------------------
Date()
date:
The JavaScript date object can be used to get year, month and day automatically. and also displays time
with milliseconds also in webpage.
getDate()
It returns the integer value between 1 and 31 that represents the day for the specified date on the
basis of local time.
getDay(): to display the week days
It returns the integer value between 0 and 6 that represents the day of the week on the basis of
local time.
getFullYears()
It returns the integer value that represents the year on the basis of local time.
getHours()
It returns the integer value between 0 and 23 that represents the hours on the basis of local time.
getMilliseconds()
It returns the integer value between 0 and 999 that represents the milliseconds on the basis of
local time.
getMinutes()
It returns the integer value between 0 and 59 that represents the minutes on the basis of local
time.
getMonth()
It returns the integer value between 0 and 11 that represents the month on the basis of local time.
getSeconds()
It returns the integer value between 0 and 60 that represents the seconds on the basis of local
time.
-------------------------------------------------

Math operations:
The JavaScript math object provides several constants and methods to perform mathematical operation.
abs()
It returns the absolute value of the given number.
acos(12)
It returns the arccosine of the given number in radians.
asin()
It returns the arcsine of the given number in radians.
atan(13)
It returns the arc-tangent of the given number in radians.
cbrt()
It returns the cube root of the given number.
ceil()
It returns a smallest integer value, greater than or equal to the given number.
cos()
It returns the cosine of the given number.
cosh()
It returns the hyperbolic cosine of the given number.

exp()
It returns the exponential form of the given number.
floor()
It returns largest integer value, lower than or equal to the given number.
hypot()
It returns square root of sum of the squares of given numbers.
log()
It returns natural logarithm of a number.
max()
It returns maximum value of the given numbers.
min()
It returns minimum value of the given numbers.
pow()
It returns value of base to the power of exponent.
random()
It returns random number between 0 (inclusive) and 1 (exclusive).
round()
It returns closest integer value of the given number.
sign()
It returns the sign of the given number
sin()
It returns the sine of the given number.
sinh()
It returns the hyperbolic sine of the given number.
sqrt()
It returns the square root of the given number
tan()
It returns the tangent of the given number.
tanh()
It returns the hyperbolic tangent of the given number.

Note: all mathematical methods must preceeds “Math”


Ex: Math.sqrt(25);

You might also like