Skip to content
Snippets Groups Projects
Commit ac797f99 authored by Andrej Rasevic's avatar Andrej Rasevic
Browse files

adding javascript examples

parent 30a5b15a
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
Showing
with 672 additions and 0 deletions
lectureCodeExamples/Week2/JavaScript2Code/ArraysLengthProp.html 0 → 100755
+ 46
− 0
View file @ ac797f99
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Arrays Length Property</title>
</head>
<body>
<script>
"use strict";
main();
function main() {
let languages = ["English", "Spanish", "French"];
document.writeln("Array: ");
printArray(languages);
document.writeln("Length: " + languages.length + "<br><br>");
/* See what values are used for the elements in the middle */
languages[8] = "Italian";
document.writeln("After adding Italian<br>");
printArray(languages);
/* The Object.keys() method returns an array of a given
object's own enumerable property names, in the same order as
we get with a normal loop. */
document.writeln("<br>Keys: " + Object.keys(languages) + "<br>");
document.writeln("Length: " + languages.length + "<br>");
languages.length = 2;
document.writeln("<br>After changing length<br>");
printArray(languages);
}
function printArray(data) {
for (let i = 0; i < data.length; i++) {
document.writeln(data[i] + " ");
}
document.writeln("<br>");
}
</script>
</body></html>
\ No newline at end of file
lectureCodeExamples/Week2/JavaScript2Code/ArraysOneDim.html 0 → 100755
+ 49
− 0
View file @ ac797f99
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Arrays</title>
</head>
<body>
<script>
"use strict";
main();
function main() {
let numOfBeds = 4;
let roomNumber = reserveRoom(numOfBeds);
printRoom(roomNumber);
cleanRoom(roomNumber);
printRoom(roomNumber);
}
function reserveRoom(numberOfBeds) {
let roomNumber = new Array(numberOfBeds);
for (let idx = 0; idx < roomNumber.length; idx++) {
roomNumber[idx] = "Bed" + idx;
}
return roomNumber;
}
function printRoom(roomNumberParameter) {
for (let idx = 0; idx < roomNumberParameter.length; idx++) {
document.writeln(roomNumberParameter[idx] + "<br>");
}
}
function cleanRoom(roomNumberParameter) {
for (let idx = 0; idx < roomNumberParameter.length; idx++) {
roomNumberParameter[idx] += " cleaned ";
}
}
</script>
</body>
</html>
lectureCodeExamples/Week2/JavaScript2Code/ArraysTwoDim.html 0 → 100755
+ 70
− 0
View file @ ac797f99
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Two-Dimensional Arrays</title>
</head>
<body>
<script>
"use strict";
main();
function main() {
document.writeln("<h2>First Data Set</h2>");
const firstArray = [
[10, 20, 30],
[40, 50, 60],
[70, 80, 90]
];
printArray(firstArray);
document.writeln("<h2>Second Data Set</h2>");
let secondArray = createArray(2, 3);
initializeArray(secondArray, 1);
printArray(secondArray);
document.writeln("<h2>Third Data Set (Ragged Array)</h2>");
const thirdArray = [
[100, 200, 300],
[400],
[700, 800],
[],
[500, 600, 900, 1000]
];
printArray(thirdArray);
}
function createArray(maxRows, maxCols) {
let newArray = new Array(maxRows);
for (let row = 0; row < maxRows; row++) {
newArray[row] = new Array(maxCols);
}
return newArray;
}
function initializeArray(data, initialValue) {
for (let row = 0; row < data.length; row++) {
for (let col = 0; col < data[row].length; col++) {
data[row][col] = initialValue;
initialValue++;
}
}
}
function printArray(data) {
for (let row = 0; row < data.length; row++) {
for (let col = 0; col < data[row].length; col++) {
document.writeln(data[row][col] + "&nbsp;&nbsp;");
}
document.writeln("<br>");
}
}
</script>
</body>
</html>
lectureCodeExamples/Week2/JavaScript2Code/CharAt.html 0 → 100755
+ 50
− 0
View file @ ac797f99
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>charAt Example</title>
</head>
<body>
<script>
"use strict";
main();
function main() {
let value = prompt("Enter four digit value"), message;
if (validDigits(value, 4)) {
message = "Correct value provided";
} else {
message = "Incorrect value provided";
}
alert(message);
}
function findInstancesOfChar(str, target) {
let count = 0;
for (let idx = 0; idx < str.length; idx++) {
if (str[idx] === target) {
count++;
}
}
return count;
}
function validDigits(data, length) {
if (data.length !== length) {
return false;
} else {
for (let idx = 0; idx < data.length; idx++) {
if (isNaN(data.charAt(idx))) {
return false;
}
}
return true;
}
}
</script>
</body></html>
lectureCodeExamples/Week2/JavaScript2Code/ConsoleEx.html 0 → 100755
+ 28
− 0
View file @ ac797f99
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>JS Example</title>
</head>
<body>
<script>
var option = prompt("Enter log, info, warn or error");
if (option === "log") {
console.log("Using console.log");
} else if (option === "info") {
console.info("Using console.info");
} else if (option === "warn") {
console.warn("Using console.warn");
} else if (option === "error") {
console.error("Using console.error");
} else {
console.log("Invalid option: " + option);
}
</script>
</body>
</html>
lectureCodeExamples/Week2/JavaScript2Code/DefiningFunctions.html 0 → 100755
+ 32
− 0
View file @ ac797f99
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>JS Example</title>
</head>
<body>
<script>
/* Function declaration */
function product(x, y) {
return x * y;
}
document.writeln("Function declaration: " + product(3, 4) + "<br>");
/* Function expression (anonymous function) */
let productTwo = function(x, y) {
return x * y;
};
document.writeln("Function expression: " + productTwo(100, 200) + "<br>");
/* Using Function constructor */
var productThree = new Function("x", "y", "return x * y");
document.writeln("Function constructor: " + productThree(2, 3));
</script>
</body>
</html>
lectureCodeExamples/Week2/JavaScript2Code/FunctionsAsData.html 0 → 100755
+ 28
− 0
View file @ ac797f99
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Functions as Data</title>
</head>
<body>
<script>
"use strict";
/* We don't need to have a main function */
main();
function main() {
var sayHi = hello;
var hi = hello;
hi("John");
hello("John");
sayHi("John");
}
function hello(name) {
document.writeln("Hello " + name + "<br>");
}
</script>
</body></html>
\ No newline at end of file
lectureCodeExamples/Week2/JavaScript2Code/InputOutput.html 0 → 100755
+ 29
− 0
View file @ ac797f99
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Input/Output</title>
</head>
<body>
<script>
"use strict";
document.writeln("<strong>" + "Bill Calculation System</strong><br />");
let costPerCredit, numberOfCredits, tuitionCost;
/* Reading values from the user */
costPerCredit = Number(prompt("Enter cost per credit:"));
numberOfCredits = prompt("Enter number of credits:", 15);
/* Computing cost */
tuitionCost = costPerCredit * numberOfCredits;
document.writeln("<strong>Tuition Cost: </strong>" + tuitionCost);
</script>
</body>
</html>
lectureCodeExamples/Week2/JavaScript2Code/Network.html 0 → 100755
+ 34
− 0
View file @ ac797f99
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Network</title>
</head>
<body>
<script>
"use strict";
/* You need to allow browser pop-ups to run this program */
let network = prompt("Enter network name (abc, cbs)");
alert("Network specified is: " + network);
let webSite;
switch (network) {
case "abc":
webSite = "http://www.abc.com/";
break;
case "cbs":
webSite = "http://www.cbs.com/";
break;
default:
webSite = "http://www.cnn.com/";
break;
}
window.open(webSite);
</script>
</body>
</html>
lectureCodeExamples/Week2/JavaScript2Code/ProcessValues.html 0 → 100755
+ 46
− 0
View file @ ac797f99
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Process Values</title>
</head>
<body>
<script>
"use strict";
main();
function main() {
let numberOfValues = Number(prompt("Enter number of values to print"));
let wantHTML = window.confirm("Press OK for formatted output and Cancel otherwise");
let printingFunction;
if (wantHTML) {
// processValues(numberOfValues, htmlFormat);
printingFunction = formatOutput;
} else {
// processValues(numberOfValues, textFormat);
printingFunction = textFormat;
}
processValues(numberOfValues, printingFunction);
}
function textFormat(data) {
document.writeln(data);
}
function formatOutput(data) {
document.writeln("<span style='color:red;font-size:4em'><strong>" + data + " </strong></span>");
}
function processValues(maximum, printOption) {
for (let curr = 1; curr < maximum; curr++) {
printOption(curr);
}
printOption(maximum);
}
</script>
</body></html>
\ No newline at end of file
lectureCodeExamples/Week2/JavaScript2Code/SqrTable.html 0 → 100755
+ 42
− 0
View file @ ac797f99
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Square Root Table</title>
</head>
<body>
<script>
"use strict";
let currValue = 0,
maximumValue;
/* Reading a value from the user and verifying is correct */
do {
maximumValue = Number(prompt("Enter a value"));
if (maximumValue < 0) {
alert("Invalid value: " + maximumValue);
}
} while (maximumValue < 0);
/* Generating the table */
// document.writeln writes a string of text followed by a newline
// character to a document. Try also document.write(...)
document.writeln("<table border=\"2\">");
document.writeln("<caption><strong>Square Root Table</strong></caption>");
document.writeln("<tr><th>Number</th><th>Square Root</th></tr>");
while (currValue <= maximumValue) {
document.writeln("<tr><td>" + currValue + "</td><td>");
document.writeln(Math.sqrt(currValue) + "</td></tr>");
currValue = currValue + 1;
}
document.writeln("</table>");
</script>
</body>
</html>
lectureCodeExamples/Week2/JavaScript2Code/Strict.html 0 → 100755
+ 20
− 0
View file @ ac797f99
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Strict Example</title>
</head>
<body>
<script>
// Inspect the console for each case below
'use strict';
/* strict mode requires variable to be declared first */
// bookTitle = "Introduction to JavaScript";
/* Following variable name not allowed in strict mode */
// let interface = 10;
</script>
</body></html>
\ No newline at end of file
lectureCodeExamples/Week2/JavaScript2Code/StringMethods.html 0 → 100755
+ 71
− 0
View file @ ac797f99
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>String Methods</title>
</head>
<body>
<script>
"use strict";
main();
function main() {
let str1 = prompt("Enter string value");
let str2 = prompt("Enter string value"), result;
/* string comparison */
if (str1 <= str2) {
document.writeln(str1 + " <= " + str2);
} else if (str1 > str2) {
document.writeln(str1 + " > " + str2);
} else {
document.writeln("str1 equal to str2");
}
if (str1.includes(str2)) {
document.writeln("<br>" + str1 + " includes " + str2);
} else {
document.writeln("<br>" + str1 + " does not include " + str2);
}
if (str1.startsWith("the")) {
document.writeln("<br>" + str1 + " starts with \"the\"");
} else {
document.writeln("<br>" + str1 + " does not start with \"the\"");
}
if (str1.endsWith("ing")) {
document.writeln("<br>" + str1 + " ends with \"ing\"");
} else {
document.writeln("<br>" + str1 + " does not end with \"ing\"");
}
document.writeln("<br>\"Fear the turtle\".indexOf(\"the\")&rarr;" +
"Fear the turtle".indexOf("the"));
document.writeln("<br>\"Fear the turtle\".indexOf(\"boat\")&rarr;" +
"Fear the turtle".indexOf("boat"));
document.writeln("<br>\"Fear the turtle\".indexOf(\"\")&rarr;" + "Fear the turtle"
.indexOf(""));
document.writeln("<br>\"Fear the turtle\".lastIndexOf(\"e\")&rarr;" +
"Fear the turtle".lastIndexOf("e"));
document.writeln("<br>" + str1 + ".repeat(5)&rarr;" + str1.repeat(5));
document.writeln("<br>" + "\"Feartheturtle\".slice(2, 7) " +
"Feartheturtle".slice(2, 7));
document.writeln("<br>" + "\"Feartheturtle\".slice(-7) " + "Feartheturtle".slice(-7));
str1 = prompt("Enter comma separated string");
let strArray = str1.split(",");
document.writeln("<br>String components:<br>")
for (let i = 0; i < strArray.length; i++) {
document.writeln(strArray[i] + " Length: " + strArray[i].length + "<br>");
}
}
</script>
</body>
</html>
lectureCodeExamples/Week2/JavaScript2Code/Wrapper.html 0 → 100755
+ 28
− 0
View file @ ac797f99
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>charAt Example</title>
</head>
<body>
<script>
"use strict";
let name = "Testudo";
let letter = name.charAt(1); /* Autoboxing takes place */
document.writeln("Letter is " + letter + "<br>");
// JavaScript engine processing for above code
name = "Testudo";
let x = new String(name);
letter = x.charAt(1);
x = null; /* x will be destroyed once is no longer needed */
document.writeln("Letter is " + letter);
</script>
</body>
</html>
lectureCodeExamples/Week2/JavaScript2Code/WrapperType.html 0 → 100755
+ 32
− 0
View file @ ac797f99
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Wrapper object type example</title>
</head>
<body>
<script>
"use strict";
let name = "Testudo";
let objName = new String("Testudo");
if (name == objName) {
document.writeln('Same value');
} else {
document.writeln('Different value');
}
document.writeln("<br>")
if (name === objName) {
document.writeln('Same type!');
} else {
document.writeln('Different type');
}
</script>
</body>
</html>
lectureCodeExamples/Week2/JavaScriptIntroCode/SqrTable.html 0 → 100755
+ 42
− 0
View file @ ac797f99
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Square Root Table</title>
</head>
<body>
<script>
"use strict";
let currValue = 0,
maximumValue;
/* Reading a value from the user and verifying is correct */
do {
maximumValue = Number(prompt("Enter a value"));
if (maximumValue < 0) {
alert("Invalid value: " + maximumValue);
}
} while (maximumValue < 0);
/* Generating the table */
// document.writeln writes a string of text followed by a newline
// character to a document. Try also document.write(...)
document.writeln("<table border=\"2\">");
document.writeln("<caption><strong>Square Root Table</strong></caption>");
document.writeln("<tr><th>Number</th><th>Square Root</th></tr>");
while (currValue <= maximumValue) {
document.writeln("<tr><td>" + currValue + "</td><td>");
document.writeln(Math.sqrt(currValue) + "</td></tr>");
currValue = currValue + 1;
}
document.writeln("</table>");
</script>
</body>
</html>
lectureCodeExamples/Week2/JavaScriptIntroCode/TemplateJS.html 0 → 100755
+ 24
− 0
View file @ ac797f99
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JavaScript Program Template</title>
</head>
<body>
<script>
// "use strict"; Defines that JavaScript code should be executed in strict mode.
"use strict";
let value = 10;
console.log("value is: " + value);
document.writeln("Output available in the console");
/* Your JavaScript here */
</script>
</body>
</html>
lectureCodeExamples/Week2/JavaToyWebServer/bin/.gitignore 0 → 100644
+ 1
− 0
View file @ ac797f99
/toyWebServer/
lectureSlides/Week02/JavaScript2.pdf 0 → 100644
+ 0
− 0
View file @ ac797f99
File added
lectureSlides/Week02/JavaScriptIntro.pdf 0 → 100644
+ 0
− 0
View file @ ac797f99
File added
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment