JavaScript
·
Dynamic Computer Programming Language
·
Scripting Language
·
Lightweight
·
Interpreted Programming Language
·
Open and Cross-Platform
History
v
Javascript author is Brendan Eich
v Javascript was found In 1995
v He was developed javascript for their
web browser Netscape Navigator
v Initially Javascript name was Mocha
v In Netscape Navigator 2.0 betas(sep-
1995)it was called Livescript
v In Netscape Navigator 2.0 beta 3(Dec-
1995)it was called Javascript
Advantage
§
Security
§ Less Server Interaction
§
Immediate feedback to the visitors
§
Interactive
§
Rich Interface
Comments
v Single line Comment
//……Single line Comment……//
v Multiline Comment
/*
Multiline Comment
*/
Primitive values or datatype
Booleans:
true
false
Numbers:
Int -
23
Float
- 9.457
String:
‘abc’
“xyz”
Sample program
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,
initial-scale=1.0">
<link rel="stylesheet" href="style1.css" type="text/css">
<title>Javascript</title>
</head>
<body>
<h2>Javascript</h2>
<script language="javascript" type="text/javascript">
document.write("Hello World");
v1=10
v2=20
document.write("Total=",v1+v2)
console.log("hai hello");
console.error("something went wrong!")
</script>
</body>
</html>
Style1.css
h2{
background-color: aqua;
width: auto;
height: 40px;
}
Output
Declaring
Variables
Const:
It creates immutable variable binding
Const x=9;
X=7; //it case type
error
let:
it creates mutable variable binding
let y=5;
y=3*5;
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style1.css" type="text/css">
<title>Javascript</title>
</head>
<body>
<h2>Javascript</h2>
<script language="javascript" type="text/javascript">
const x=8;
let y=5;
y=3*5;
document.write(x)
document.write()
document.write("\n"+y)
</script>
</body>
</html>
JavaScript
External File
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style2.css" type="text/css">
<script type="text/javascript" src="samplejs.js"></script>
<title>Document</title>
</head>
<body>
Click here
<input type="button" onclick="sayHello()" value="clickme"/>
</body>
</html>
Style2.css
body{
background-color: aqua;
width: auto;
height: auto;
font-family: 'Courier New', Courier, monospace;
font-size: large;
}
input{
color: green;
font-size: larger;
background-color: orange;
font-weight: bold;
}
samplejs.js
document.write("javascript")
output
JavaScript
Variable Scope
Global Variable -
Out of the function
Local Variable – Within a function
Alert.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style2.css" type="text/css">
<script type="text/javascript" src="samplejs.js"></script>
<title>Document</title>
</head>
<body>
Click here
<input type="button" onclick="sayHello()" value="clickme"/>
</body>
</html>
Samplejs.js
var a="global variable";
function sayHello()
{
var a="local variable";
document.write(a);
}
JavaScript Keyword
.
JavaScript Statements
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script type="text/javascript" src="samplejs1.js"></script>
<title>Document</title>
<h2>Javascript</h2>
</head>
<body>
</body>
</html>
Samplejs1.js
document.write("<h1>This is a heading</h1>");
document.write("<p>This is a paragraph.</p>");
document.write("<p>This is another paragraph.</p>");
Output
0 comments:
Post a Comment