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

adding lecrture content

parent 02f7f863
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
Showing
with 1006 additions and 0 deletions
lectureCodeExamples/Week3/JavaScript3Code/ArrayMethods.html 0 → 100755
+ 101
− 0
View file @ 5c96b132
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Array Methods</title>
</head>
<body>
<script>
"use strict";
main();
function printArray(data) {
var i;
for (i = 0; i < data.length; i++) {
document.writeln(data[i] + " ");
}
document.writeln("<br>");
}
function main() {
document.writeln("***** Creating Array *****<br>");
let languages = ["JavaScript", "Java", "PHP", "Python"];
document.writeln("Array of Languages: " + languages + "<br>")
document.writeln("Length: " + languages.length + "<br><br>");
document.writeln("***** After pushing C *****<br>");
languages.push("C");
document.writeln("Languages: " + languages.join() + "<br><br>"); /* Using join() */
document.writeln("***** After pop *****<br>");
let popped = languages.pop();
document.writeln("Popped element: " + popped + "<br>");
document.writeln("Languages: " + languages.join("*") + "<br><br>"); /* Using join() */
document.writeln("***** After shift *****<br>");
let shiftedElement = languages.shift();
document.writeln("Shifted element: " + shiftedElement + "<br>");
document.writeln("Languages: " + languages.join("---") + "<br><br>"); /* Using join() */
document.writeln("***** After unshift *****<br>");
languages.unshift(shiftedElement);
document.writeln("Languages: " + languages.join(",") + "<br><br>");
document.writeln("***** Finding index of Python *****<br>");
document.writeln("Languages: " + languages.join(",") + "<br>");
document.writeln("Index: " + languages.indexOf("Python") + "<br><br>");
document.writeln("***** Using splice *****<br>");
languages = ["JavaScript", "Java", "PHP", "Python", "Ruby", "C#"];
document.writeln("Languages: " + languages.join(",") + "<br>");
let start = 1, end = 3;
document.writeln("Using arguments " + start + ", " + end + "<br>");
let returnedValue = languages.splice(start, end);
document.writeln("Languages array after splice: " + languages.join(",") + "<br>");
document.writeln("Value returned by splice: " + returnedValue.join(",") + "<br><br>");
document.writeln("***** Using slice *****<br>");
languages = ["JavaScript", "Java", "PHP", "Python", "Ruby", "C#"];
document.writeln("Languages: " + languages.join(",") + "<br>");
start = 1, end = 3;
document.writeln("Using arguments " + start + ", " + end + "<br>");
returnedValue = languages.slice(start, end);
document.writeln("Languages array after slice: " + languages.join(",") + "<br>");
document.writeln("Value returned by slice: " + returnedValue.join(",") + "<br><br>");
document.writeln("***** Using reverse *****<br>");
let seasons = ["Fall", "Winter", "Spring", "Summer"];
document.writeln("Seasons: " + seasons.join(",") + "<br>");
seasons.reverse();
document.writeln("After reversing seasons array: " + seasons.join(", ") + "<br><br>");
document.writeln("***** Using concat *****<br>");
let part1 = [10, 20, 30], part2 = [40, 60];
document.writeln("Concatenating: " + part1.join() + " and " + part2.join() + "<br>");
let combined = part1.concat(part2);
document.writeln("Concatenating result: " + combined + "<br><br>");
document.writeln("***** Using fill *****<br>");
document.writeln("Filling array with value 100<br>");
let filled = new Array(4).fill(100);
document.writeln("Result: " + filled + "<br><br>");
}
</script>
</body>
</html>
lectureCodeExamples/Week3/JavaScript3Code/ArraySlice.html 0 → 100755
+ 44
− 0
View file @ 5c96b132
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Array Slice Example</title>
</head>
<body>
<script>
"use strict";
let arr = new Array();
arr.push({
name: 'Maryland'
});
arr.push({
name: 'Virginia'
});
arr.push({
name: 'Delaware'
});
document.writeln("<strong>Check console for array information</strong><br>");
console.log("\n\nOriginal array");
console.table(arr); /* Notice the use of console.table() */
let sliced = arr.slice(1, 3); /* Only VA and DE */
console.log("\n\nResult of slice 1, 3");
console.table(sliced);
/* Modifying entry of sliced */
sliced[0].name = 'Texas';
console.log("\n\nPrinting original and sliced array after ");
console.log("modification (Texas) (shows shallow copy)");
console.log("\n\nOriginal array");
console.table(arr);
console.log("\n\nsliced array");
console.table(sliced);
</script>
</body>
</html>
\ No newline at end of file
lectureCodeExamples/Week3/JavaScript3Code/BlockScope.html 0 → 100755
+ 52
− 0
View file @ 5c96b132
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Block Scope</title>
</head>
<body>
<script>
"use strict";
/* Try each of the following function calls */
document.writeln("<h2>Testing var and let</h2>");
// usingVar();
// usingLet();
// let answer = evaluateVar(200); document.writeln("|Answer is: " + answer +"<br>");
// let answer = evaluateLet(200); document.writeln("|Answer is: " + answer +"<br>");
function usingVar() {
for (var i = 1; i <= 4; i++) {
document.writeln(i + " ");
}
document.writeln("<br>value of i outside loop: " + i + "<br>");
}
function usingLet() {
for (let i = 1; i <= 4; i++) {
document.writeln(i + " ");
}
document.writeln("<br>Check console result");
document.writeln("<br>value of i outside loop: " + i + "<br>");
}
function evaluateVar(x) {
if (x >= 100) {
var y = x * 100;
document.writeln("Value in if: " + y);
}
return y;
}
function evaluateLet(x) {
if (x >= 100) {
let y = x * 100;
document.writeln("Value in if: " + y);
}
document.writeln("<br>Check console result");
return y; // Generates ReferenceError
}
</script>
</body></html>
\ No newline at end of file
lectureCodeExamples/Week3/JavaScript3Code/Const.html 0 → 100755
+ 26
− 0
View file @ 5c96b132
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>const example</title>
</head>
<body>
<script>
"use strict";
main();
function main() {
const MAX_TEMP = 4;
document.writeln("Contant value: " + MAX_TEMP + "<br>");
document.writeln("Check console")
MAX_TEMP = 6; // See console
}
</script>
</body>
</html>
lectureCodeExamples/Week3/JavaScript3Code/ForOf.html 0 → 100755
+ 28
− 0
View file @ 5c96b132
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>for</title>
</head>
<body>
<script>
"use strict";
document.writeln("***** Iterating Over Array *****<br>");
let languages = ["C++", "Fortran", "JavaScript"];
for (let lang of languages) {
document.writeln(lang + "<br>");
}
document.writeln("<br>");
document.writeln("***** Iterating Over String *****<br>");
let name = "Michael";
for (let letter of name) {
document.writeln(letter + "<br>");
}
</script>
</body>
</html>
\ No newline at end of file
lectureCodeExamples/Week3/JavaScript3Code/InstanceOf.html 0 → 100755
+ 39
− 0
View file @ 5c96b132
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>typeof and instanceof</title>
</head>
<body>
<script>
"use strict";
const myInfoObj = {
name: "John",
id: 10
};
const scoresArray = [10, 30];
document.writeln("<h2>instanceof examples</h2>");
document.writeln("myInfoObj instance of Object: " + (myInfoObj instanceof Object) + "<br>");
document.writeln("scoresArray instance of Object: " + (scoresArray instanceof Object) + "<br>");
document.writeln("scoresArray instance of Array: " + (scoresArray instanceof Array) + "<br>");
document.writeln("printArray instance of Function: " + (printSchoolName instanceof Function) + "<br><br>");
document.writeln("<h2>typeof examples</h2>");
document.writeln("typeof myInfoObj: " + typeof myInfoObj + "<br>");
document.writeln("typeof scoresArray: " + typeof scoresArray + "<br>");
document.writeln("typeof printSchoolName: " + typeof printSchoolName + "<br><br>");
document.writeln("<h2>Array.isArray</h2>");
document.writeln("Array.isArray(scoresArray): " + Array.isArray(scoresArray) + "<br>");
document.writeln("Array.isArray(printSchoolName): " + Array.isArray(printSchoolName) + "<br>");
function printSchoolName() {
document.writeln("UMCP");
}
</script>
</body></html>
\ No newline at end of file
lectureCodeExamples/Week3/JavaScript3Code/NaN.html 0 → 100755
+ 54
− 0
View file @ 5c96b132
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>NaN example</title>
</head>
<body>
<script>
"use strict";
main();
function main() {
let examScore = 84.5,
name = "Mary Smith", message = "";
message += "examScore is a not number: " + isNaN(examScore) + "<br>";
message += "window.isNaN(NaN): " + window.isNaN(NaN) + "<br>";
message += "Number.isNaN(NaN): " + Number.isNaN(NaN) + "<br>";
message += "empty string to number: " + Number("") + "<br>";
message += "string to number: " + Number(name) + "<br>";
message += "empty string is not a number: " + window.isNaN("") + "<br>";
message += "empty string is not a number: " + Number.isNaN("") + "<br><br>";
message += `"${name}" is not a number: ` + window.isNaN(name) + "<br>";
message += `"${name}" is not a number: ` + Number.isNaN(name) + "<br><br>";
message += "NaN == NaN: " + (NaN == NaN) + "<br>";
message += "NaN === NaN: " + (NaN === NaN) + "<br><br>";
message += "\"-24\" is a number: " + !isNaN("-24") + "<br>";
message += "\"+24\" is a number: " + !isNaN("+24") + "<br>";
message += "parseInt(\"24Hi\"): " + parseInt("24Hi") + "<br>";
message += "parseInt(\"Hi\"): " + parseInt("Hi") + "<br>";
message += "\"24Hi\" is a number: " + !isNaN("24Hi") + "<br>";
message += "Number(\"24Hi\"): " + Number("24Hi") + "<br>";
message += "\"24Hi\" is a number: " + !Number.isNaN("24Hi") + " -- strange? <br>";
message += "\"24Hi\" is a number: " + !window.isNaN("24Hi") + "<br>";
document.writeln(message);
}
</script>
</body>
</html>
lectureCodeExamples/Week3/JavaScript3Code/NoBlockScope.html 0 → 100755
+ 31
− 0
View file @ 5c96b132
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Scope example</title>
</head>
<body>
<script>
"use strict";
main();
function main() {
let value = 200; /* Try with 10 */
document.writeln("Result in main: " + evaluate(value));
}
function evaluate(x) {
/* y is hoisted */
document.writeln("Value of y in evaluate is: " + y + "<br>");
if (x >= 100) {
var y = x * 100;
document.writeln("Inside of if value of y is: " + y + "<br>");
}
return y; // Accessible
}
</script>
</body>
</html>
\ No newline at end of file
lectureCodeExamples/Week3/JavaScript3Code/NumericValues.html 0 → 100755
+ 47
− 0
View file @ 5c96b132
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Numeric Values</title>
</head>
<body>
<script>
"use strict";
let info = "NaN: " + Number.NaN + "<br>";
info += "Infinity: " + Infinity + "<br>";
info += "MAX_VALUE: " + Number.MAX_VALUE + "<br>";
info += "MIN_VALUE: " + Number.MIN_VALUE + "<br>";
info += "POSITIVE_INFINITY: " + Number.POSITIVE_INFINITY + "<br>";
info += "NEGATIVE_INFINITY: " + Number.NEGATIVE_INFINITY + "<br>";
info += "isFinite(100): " + isFinite(100) + "<br>";
info += "isFinite(null): " + isFinite(null) + "<br>";
info += "Number.isFinite(null): " + Number.isFinite(null) + "<br>";
document.writeln(info);
document.writeln("Result of 1/0: " + 1 / 0 + "<br>");
document.writeln("Result of 1/Infinity: " + 1 / Infinity + "<br>");
document.writeln("Result of Infinity/0: " + Infinity / 0 + "<br>");
document.writeln("Result of Infinity/Infinity: " + Infinity / Infinity +
"<br>");
document.writeln("Square root of negative value: " + Math.sqrt(-10) +
"<br>");
document.writeln("Square root of a string: " + Math.sqrt("Rose") + "<br>");
document.writeln("Floating-point values are approximations<br>");
let x = 1 / 7 + 4 / 7 + 2 / 7;
let y = (1 + 4 + 2) / 7;
document.writeln("Value of x: " + x + "<br>");
document.writeln("Value of y: " + y + "<br>");
if (x === y) {
document.writeln("Same value<br>");
} else {
document.writeln("Different values<br>");
}
</script>
</body>
</html>
\ No newline at end of file
lectureCodeExamples/Week3/JavaScript3Code/Sorting.html 0 → 100755
+ 93
− 0
View file @ 5c96b132
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Sorting</title>
</head>
<body>
<script>
"use strict";
main();
function main() {
document.writeln("***** Strings sorting *****<br>");
let names = ["Rose", "Bob", "Tom", "Albert"];
document.writeln("Original array: " + names.join() + "<br>");
names.sort(); /* Sorting */
document.writeln("After sorting array: " + names.join() + "<br><br>");
document.writeln("***** Numerical sorting (unicode code point order generates ");
document.writeln("unexpected result) *****<br>");
let scores = [30, 2, 4, 5];
document.writeln("Original array: " + scores.join() + "<br>");
scores.sort(); /* Sorting */
document.writeln("Wrong sort: " + scores.join() + "<br><br>");
document.writeln("***** Numerical sorting (using comparison function) *****<br>");
scores.sort(function(x, y) {
return x - y;
});
document.writeln("After sorting: " + scores.join() + "<br><br>");
document.writeln("***** Sorted names in descending order *****<br>");
names.sort(strCompareDescending);
document.writeln(names.join() + "<br><br>");
document.writeln("***** Sorting array of objects (students) by name *****<br>");
document.writeln("See console for results");
let students = [{
name: "John",
id: 3
},
{
name: "Peter",
id: 2
},
{
name: "Mary",
id: 10
}
];
students.sort(function(x, y) {
return strCompare(x.name, y.name);
});
console.log("\n\nResult of sorting students by name");
console.table(students);
document.writeln("<br>Using sort to randomize an array (reload the page several times)<br>");
let data = [2, 3, 4, 5];
document.writeln("Original array: " + data.join());
data.sort((x, y) => Math.random() - 0.5);
document.writeln("Randomize array: " + data.join());
}
function strCompareDescending(x, y) {
if (x < y) {
return 1;
} else if (x > y) {
return -1;
} else {
return 0;
}
}
function strCompare(x, y) {
if (x < y) {
return -1;
} else if (x > y) {
return 1;
} else {
return 0;
}
}
</script>
</body>
</html>
lectureCodeExamples/Week3/JavaScript3Code/TemplateLiteral.html 0 → 100755
+ 60
− 0
View file @ 5c96b132
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>JS Example</title>
</head>
<body>
<script>
"use strict";
main();
function getLetter(name, body, signature) {
let letter = `<br>Dear ${name}:
<br>
<br>
${body}
<br>
<br>
Sincerely
<br><br><br>
${signature}<hr>`;
alert(letter);
return letter;
}
function sum(x, y) {
return x + y;
}
function main() {
document.writeln("***** Interpolating Variable *****<br>");
let mascot = "turtle";
let message = `Fear the ${mascot}`;
document.writeln(message + "<br><br>");
document.writeln("<br>***** Generating Letter *****<br>");
document.writeln(getLetter("Mary", "How are you doing?", "Peter"));
document.writeln("***** Interpolating Expression and Function Call *****<br>");
let x = 20,y = 30;
let totalCost = `<br>Total Cost is ${x * y}`;
document.writeln(totalCost);
let sumResult = `<br>Sum is ${sum(x, y)}`;
document.writeln(sumResult);
document.writeln("***** Space in Template Literals Matters *****<br>");
const string = `Hello
terps!`;
document.writeln("<pre>" + string + "</pre>");
}
</script>
</body>
</html>
lectureCodeExamples/Week3/JavaScript3Code/TruthyFalsy.html 0 → 100755
+ 55
− 0
View file @ 5c96b132
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>JS Truthy Falsy Example</title>
<script src="https://cdn.jsdelivr.net/npm/lodash@4.17.15/lodash.min.js">
</script>
</head>
<body>
<script>
"use strict";
function isTruthy(value) {
(value) ? console.log(value + " is Truthy!"): console.log(value + " is Falsy!");
}
document.writeln("<h2>Check console for results</h2>");
console.log("********** FIRST SET (all falsy) **********");
isTruthy(false);
isTruthy(0);
isTruthy("");
isTruthy(null);
isTruthy(undefined);
isTruthy(NaN);
console.log("\n********** SECOND SET (all truthy) **********");
isTruthy("0");
isTruthy("false");
isTruthy({});
isTruthy([]);
isTruthy(Math.PI);
isTruthy("Hello everyone");
console.log("\n********** THIRD SET **********");
let date1 = new Date('2020-09-21T12:30:00');
let date2 = new Date('September 21, 2020 12:30:00')
isTruthy(date1);
isTruthy(date2);
console.log("date comparison");
isTruthy(date1 === date2 || date1 == date2);
console.log("date comparison using Lodash function");
/* Using Lodash function lib. isEqual performs deep comparison */
isTruthy(_.isEqual(date1, date2));
console.log("now");
let now = new Date();
isTruthy(now);
</script>
</body>
</html>
\ No newline at end of file
lectureCodeExamples/Week3/JavaScript4Code/AddingProperties.html 0 → 100755
+ 47
− 0
View file @ 5c96b132
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Adding Properties</title>
</head>
<body>
<script>
"use strict";
let sale = {};
/* Reading the items, number of items */
let wantAnotherItem, item, numberOfItems;
do {
item = prompt("Enter name of item you want to buy.");
numberOfItems = Number(prompt("Enter number of items you want to buy"));
/* Adding property */
if (sale[item] === undefined) { // IMPORTANT: Otherwise will remove previous value
sale[item] = numberOfItems;
} else {
sale[item] += numberOfItems;
}
wantAnotherItem = window.confirm("Do you want to buy another item?");
} while (wantAnotherItem);
/* Report about bought items */
let report = "Items bought\n";
/* Note:
The for...in statement iterates over all non-Symbol, enumerable properties of
an object */
for (let propertyName in sale) {
report += propertyName + "-->" + sale[propertyName] + "\n";
}
alert(report);
</script>
</body>
</html>
lectureCodeExamples/Week3/JavaScript4Code/ArrayEverySome.html 0 → 100755
+ 29
− 0
View file @ 5c96b132
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>JS Array every and some method Example</title>
</head>
<body>
<script>
"use strict";
// Index and array are optional
function isOdd(elem, index, array) {
return (elem % 2 === 1);
}
let atLeastOneOdd = [2, 6, 8, 1, 4].some(isOdd);
let allOdd1 = [2, 6, 8, 1, 4].every(isOdd);
let allOdd2 = [1, 3, 5, 9, 7].every(isOdd);
document.writeln("atLeastOneOdd: " + atLeastOneOdd + "<br>");
document.writeln("allOdd1: " + allOdd1 + "<br>");
document.writeln("allOdd2: " + allOdd2 + "<br>");
</script>
</body>
</html>
lectureCodeExamples/Week3/JavaScript4Code/ArrayForEachFindFindIndex.html 0 → 100755
+ 61
− 0
View file @ 5c96b132
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>JS forEach, find, findIndex</title>
</head>
<body>
<script>
"use strict";
document.writeln("***** Result of processing with forEach ");
document.writeln("(with 2-parameter function) *****<br>");
let fruits = ["apple", "pear", "banana", "orange", "plum", "grape"];
fruits[7] = "strawberry"; /* Added leaving undefined elements in between */
document.writeln("Original array: " + fruits.join() + "<br>");
fruits.forEach(function(elem, index) {
document.writeln("Index: " + index + ", Elem: " + elem + "<br>");
});
document.writeln("<br>**** Result of processing with forEach ");
document.writeln("(with with 1-parameter function) *****<br>");
fruits.forEach(function(elem) {
document.writeln("Elem: " + elem + "<br>");
});
document.writeln("<br>***** Result of processing with find ");
document.writeln(" finding fruit's name with minimum length) *****<br>");
fruits = ["apple", "pear", "banana", "orange", "plum", "grape"];
document.writeln("Original array: " + fruits.join() + "<br>");
let targetLength = 6; /* Try with 8 */
let result = fruits.find(function(elem) {
return elem.length >= targetLength;
});
if (result !== undefined) {
document.writeln("First fruit with length " + targetLength + " " + result);
} else {
document.writeln("Not found");
}
document.writeln("<br>");
document.writeln("<br>***** Result of processing with findIndex ");
document.writeln("finding fruit's name with minimum length) *****<br>");
fruits = ["apple", "pear", "banana", "orange", "plum", "grape"];
document.writeln("Original array: " + fruits.join() + "<br>");
targetLength = 6; /* Try with 8 */
let resultIndex = fruits.findIndex(function(elem) {
return elem.length >= targetLength;
});
if (resultIndex !== -1) {
document.writeln("First fruit with length " + targetLength + " is " + fruits[resultIndex]);
} else {
document.writeln("Not found");
}
document.writeln("<br>");
</script>
</body></html>
\ No newline at end of file
lectureCodeExamples/Week3/JavaScript4Code/ArrayMap.html 0 → 100755
+ 28
− 0
View file @ 5c96b132
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>JS Array map method Example</title>
</head>
<body>
<script>
"use strict";
document.writeln("***** Using map function to double values *****<br>");
let numbers = [2, 30, 44, 5];
let doubles = numbers.map(function(num) {
return num * 2;
});
document.writeln("Original array: " + numbers.join() + "<br>");
document.writeln("New array: " + doubles.join() + "<br><br>");
document.writeln("***** Using map function to triple values *****<br>");
let triples = numbers.map(n => n * 3);
document.writeln("Original array: " + numbers.join() + "<br>");
document.writeln("New array: " + triples.join());
</script>
</body></html>
\ No newline at end of file
lectureCodeExamples/Week3/JavaScript4Code/ArrowFunc.html 0 → 100755
+ 48
− 0
View file @ 5c96b132
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>JS Example</title>
</head>
<body>
<script>
"use strict";
let prod1 = function(x) {
return x * 3;
}
document.writeln("prod1(10): " + prod1(10) + "<br>");
let initialValue = () => 1000;
document.writeln("initialValue(): " + initialValue() + "<br>");
let prod2 = x => x * 2;
document.writeln("prod2(10): " + prod2(10) + "<br>");
let sum = (x, y, z) => x + y + z;
document.writeln("sum(10, 2, 4): " + sum(10, 2, 4) + "<br>");
let formatted = x => {
x++;
return `Value: ${x}`;
}
document.writeln("formatted(5): " + formatted(5) + "<br>")
let scores = [10, 1, 44, 200];
let sortedAttempt1 = scores.sort();
document.writeln("sortedAttempt1 (Wrong): " + sortedAttempt1 + "<br>");
let sortedAttempt2 = scores.sort((a, b) => a - b);
document.writeln("sortedAttempt2 (Correct): " + sortedAttempt2 + "<br>");
</script>
</body>
</html>
lectureCodeExamples/Week3/JavaScript4Code/DefaultParameters.html 0 → 100755
+ 48
− 0
View file @ 5c96b132
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>JS Example</title>
</head>
<body>
<script>
"use strict";
main();
function main() {
taskOldApproach();
task();
task("Rose");
task(25);
task("Kelly", 30, 20000);
document.writeln(greet('Welcome to CS', 'Chris'));
}
function taskOldApproach(name, age) {
name = name || "John"; /* Trick to define a default value */
age = age || 21;
document.writeln("Old approach: " + name + ' ' + age + "<br>");
}
function task(name = "John", age = 21, salary = special()) {
document.writeln(name + ' ' + age + ' ' + salary + "<br>");
}
function special() {
return 10000;
}
/* Parameters defined beforehand (to the left) are available to later
default parameters */
function greet(greeting, name, message = `Dear ${name}: ${greeting}`) {
return [greeting, name, message];
}
</script>
</body>
</html>
lectureCodeExamples/Week3/JavaScript4Code/Destructuring.html 0 → 100755
+ 60
− 0
View file @ 5c96b132
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>JS Destructuring Example</title>
</head>
<body>
<script>
"use strict";
main();
function main() {
/* Destructuring arrays */
let names = ["John", "Mary", "Paul"];
let [first, second] = names;
document.writeln("Original Array: " + names + "<br>");
document.writeln("First: " + first + ", " + "Second: " + second + "<br><br>");
document.writeln("***** Destructuring Object *****<br>");
/* Destructuring object */
let app = {
name: "mapApp",
developed: 1986
};
/* You must use the same property name; try name2 instead of name */
let {
name,
developed
} = app; /* Notice using { } */
document.writeln("Name: " + name + ", " + "Developed: " + developed + "<br><br>");
document.writeln("***** Destructuring Object in Function Call *****<br>");
/* function call */
myFunc(app);
function myFunc({developed}){
document.writeln("In Funcntion: Developed: " + developed + "<br><br>");
}
document.writeln("***** Destructuring Object in Function Call *****<br>");
/* function call */
myFunc2(app);
function myFunc2({name: yourName}){
document.writeln("YourName: " + yourName + "<br><br>");
}
document.writeln("***** Swapping Values *****<br>");
/* swap */
let a = 100,
b = 200;
[b, a] = [a, b];
document.writeln(a + ", " + b + "<br>");
}
</script>
</body>
</html>
\ No newline at end of file
lectureCodeExamples/Week3/JavaScript4Code/JSONExample.html 0 → 100755
+ 55
− 0
View file @ 5c96b132
<!doctype html>
<head lang="en">
<meta charset="utf-8" />
<title>JS JSON Example</title>
<style>
h2 {text-decoration: underline}
</style>
</head>
<body>
<script>
"use strict";
main();
function main() {
let obj = {
"name": "Mary",
"age": 45,
"salary": 20000.00,
"employed": true,
"boss": null,
"cars": ["toyota", "honda"],
"friends": [{
"fname": "Peter"
}, {
"fname": "Luisa"
}]
};
document.writeln("<h2>JSON String (After stringify Object)</h2>");
let str = JSON.stringify(obj);
document.writeln(str);
document.writeln("<h2>After Parsing String</h2>")
let newObj = JSON.parse(str);
for (let prop in newObj) {
document.writeln(prop + "--> " + newObj[prop] + "<br>");
}
document.writeln("<h2>Check console to see object corresponding to following string</h2>");
let secondObjStr = `{
"school": "UMCP",
"zipCode": 20742
}`;
document.writeln("String: " + secondObjStr + "<br>");
let secondObj = JSON.parse(secondObjStr);
console.log(secondObj);
console.table(secondObj);
}
</script>
</body>
</html>
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