<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var number=70,num2=20; // default value= undefined
//number=10;
//var num2=20;
document.write(number+" "+num2)
// 00number = 10; //dont'do this//
// Number = "10"; Don't use reserve keywords like (Number)
NUMBER_ThirtyFour = 34;
myFavoriteOne = "I like this style";
number00 = "New Value";
number_00 = "Next VAlue";
alert(number00);
</script>
</body>
</html>
Array-
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var arrayName = new Array(10,"hello",40,4000,200);
alert(arrayName[0]);
alert(arrayName[1]);
var secondArray = [10,"hello",40,4000,200] // short hand version
alert(arrayName[0]);
alert(arrayName[1]);
</script>
</body>
</html>
if Else
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
// One line Comment
/* Multiple Line COmment */
var number1 = 20;
var number2 = 30;
var number3 = 700;
var number4 = 500;
if(number1 === number2) {
alert('something');
} else if(number3 < number4) {
alert('This is the ELSE IF statement');
}
else {
alert('else statement');
}
</script>
</body>
</html>
Loop
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var counter = 0;
while(counter <= 5) {
alert("WHILE LOOP: " + counter);
counter++;
}
var i = 0;
do {
alert("DO WHILE LOOP:" + i );
i++;
} while(i < 5);
for(var i = 0; i < 5; i++) {
alert("FOR LOOP: " + i);
}
</script>
</body>
</html>
Math
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var calculate = (10 + 10) / 5 - (20 + 30);
alert(calculate);
var number1 = 10;
var number2 = 10;
var calculation = number1 * number2;
alert(calculation);
alert(10000 - 1000);
</script>
</body>
</html>
Function-
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
function addNumbers(){
var number1 = 10;
var number2 = 20;
var calculation = number1 + number2;
return calculation;
}
var result = addNumbers();
var cal = result + 1000;
alert(cal);
</script>
<script>
// function addNumbers(number1,number2){
// var calculation = number1 * number2;
// document.write(calculation);
// }
// addNumbers(100, 300);
</script>
<script>
// function addNumbers(){
// var number1 = 34;
// var number2 = 20;
// var calculation = number1 + number2;
// document.write(calculation);
// }
// addNumbers();
</script>
</body>
</html>
Event
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
</head>
<body>
<button onclick="alert('Hello from button');" class="btn btn-primary">CLICK HERE</button>
<button id="button2" class="btn btn-success">CLICK HERE</button>
<script>
document.getElementById('button2').onclick = function() {
clickMeFunction()
};
function clickMeFunction() {
alert('Hello from the best function, yayyyyyyyy');
}
</script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
</head>
<body>
<button onclick="alert('Hello from button');" class="btn btn-primary">CLICK HERE</button>
<button id="button2" class="btn btn-success">CLICK HERE</button>
<button onmouseover="alert('Hello from button 3');" class="btn btn-info">HOVER OVER ME</button>
<script>
document.getElementById('button2').onclick = function() {
clickMeFunction()
};
function clickMeFunction() {
alert('Hello from the best function, yayyyyyyyy');
}
</script>
</body>
</html>
Array
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
sdaf
<ul>
<script>
//var lastNames = new Array();
var lastNames = ['maneesh', 'John', 'Jose', "Peter", " Mohad"];
var names = new Array('maneesh', 'John', 'Jose', "Peter", " Mohad");
var i = 0;
while(i < names.length) {
document.write('<li>' + names[i] + ' '+lastNames[i]+ '</li>');
i++;
}
// Adding value last into array
// arr[i]=val i =0 ,1 , 6 etc this will not continuous
//arr.push('maneesh', 'John', 'Jose')
// Remove element in array
//arr.pop() This will delete recent one (last item)
// Remove First item from array
//arr.shift()
// Adding item at the beggining of the array
//arr.unshift('maneesh', 'John', 'Jose')
//Adding and removing at the same time
// arr.splice(fromIndex,how_many_item_want_to_remove, 'maneesh', 'John', 'Jose', "Peter")
//Extract subarray
// subarry= arr.slice(fromIndex,toIndex)
//Take input from user
// var inpu=prompt("Enter a value");
//Calculating array length
//arr.lentgh
</script>
</ul>
</body>
</html>
Loop
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<ul>
<script>
var i = 0;
var message = "hello";
while(i < 5) {
document.write("<li>" + i + " "+ message + "</li>");
i++;
}
</script>
</ul>
</body>
</html>
Built in Function
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>
Built in Function
</title>
</head>
<body>
<script>
var time = new Date();
var seconds = time.getSeconds();
document.write("Your computer clock seconds are: " + seconds);
</script>
<br>
<br>
<br>
<script type="text/javascript">
var str = new String( "This tring is super this long" );
document.write("This string is " +str.length + " Characters long");
</script>
</body>
</html>
Math Function
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var number = 10.6;
var roundNumber = Math.round(number);
var number2= Math.pow(24,8);
alert(number2);
</script>
</body>
</html>
Resource
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<style>
ul {
padding: 0px;
list-style:none;
}
.col-xs-3 {
word-wrap: break-word;
}
</style>
</head>
<body>
<div class="container clearfix">
<div class="row">
<div class="col-xs-3">
<code>
<h4>Example of variables Syntax</h4>
<ul>
<li>var name = "Edwin";</li>
<li>var Last_Name = "Diaz";</li>
<li>var number = 43;</li>
</ul>
</code>
</div>
<div class="col-xs-3">
<code>
<h4>Adding 1 to variables in 3 ways</h4>
<ul>
<li>number = number + 1</li>
<li>number += 1;</li>
<li>number++;</li>
</ul>
</code>
</div>
<div class="col-xs-3">
<code>
<ul>
<h4>Example of Conditional Code</h4>
<li>if(10 < 20) {
alert('Hellow student');
}</li>
</ul>
</code>
</div>
<div class="col-xs-3">
<code>
<ul>
<h4>Else If</h4>
<li>if(10 < 20) {
alert('Hellow student');
}else if(200 < 400) {
alert('Of course 200 is smaller');
}else {
alert('everything is just false');
}</li>
</ul>
</code>
</div>
</div>
<div class="row"><!--row starts-->
<div class="col-xs-3">
<code>
<ul>
<h4>While Loop</h4>
var counter = 0;
<li>while(10 < 20) {
alert('Hellow student I hope you like this');
counter++;
}</li>
</ul>
</code>
</div>
<div class="col-xs-3">
<code>
<ul>
<h4>Do While Loop</h4>
var counter = 0;
<li>do{
alert('If you made it this far, you have learned!');
counter++;
}(10 < 20);</li>
</ul>
</code>
</div>
<div class="col-xs-3">
<code>
<ul>
<h4>For Loop</h4>
<li>for(var i =0; i < 10; i++){
alert('Yesssss');
}</li>
</ul>
</code>
</div>
<div class="col-xs-3">
<code>
<ul>
<h4>Function with No Parameters</h4>
<li>
function name() {
alert("hello from the functions name");
}
name();
</li>
</ul>
</code>
</div>
</div><!--row-->
<div class="row">
<div class="col-xs-3">
<code>
<ul>
<h4>Function Passing values</h4>
function name(variable1,variable2) {
var calculation = variable1 + variable2
document.write(calculation);
}
name(10,14);
</ul>
</code>
</div>
<div class="col-xs-3">
<code>
<ul>
<h4>Function Returning values</h4>
function name() {
var variable1 = 100;
var variable2 = 200;
var calculation = variable1 + variable2
return calculation;
}
var result = name(10,14);
alert(result);
</ul>
</code>
</div>
<div class="col-xs-3">
<code>
<ul>
<h4>Click Event Handlers</h4>
<li>onclick="alert('HELLO FROM BUTTON');">CLICK HERE
</li>
<br>
<li>
document.getElementById("heading").onclick = function() {myFunction()};
function myFunction() {
document.getElementById("heading").innerHTML = "YOU CLICKED ME!";
}
</li>
</ul>
</code>
</div>
<div class="col-xs-3">
<code>
<h4>Example of Operators</h4>
<ul>
<li>Less than: < </li>
<li>Greater Than: ></li>
<li>Greater Than or equal to: >=</li>
<li>Less Than or equal to: <=</li>
<li>Assignment: = </li>
<li>Equality: == </li>
<li>Strict Equality: === </li>
<li>Not Equal to : != </li>
<li>Strict Not Equal to !== </li>
</ul>
</code>
</div>
</div>
</div>
</body>
Comments
Post a Comment