diff --git a/javascript2/week1/inclass/ex1.html b/javascript2/week1/inclass/ex1.html new file mode 100644 index 00000000..1814a7ed --- /dev/null +++ b/javascript2/week1/inclass/ex1.html @@ -0,0 +1,11 @@ + + + + + + Super Title + + + + + \ No newline at end of file diff --git a/javascript2/week1/inclass/ex1.js b/javascript2/week1/inclass/ex1.js new file mode 100644 index 00000000..f79a7606 --- /dev/null +++ b/javascript2/week1/inclass/ex1.js @@ -0,0 +1,16 @@ +const dishes = ["Pizza", "Falafel", "Dal"] + +// add UL tag +const ulTag = document.createElement("ul") + +// add many LI tags +for(dish of dishes) { + const liTag = document.createElement("li") + // add data to element + liTag.innerText = dish + // Workspace manipulation + ulTag.appendChild(liTag) +} + +// DOM manipulation +document.body.appendChild(ulTag) \ No newline at end of file diff --git a/javascript2/week1/inclass/ex2.html b/javascript2/week1/inclass/ex2.html new file mode 100644 index 00000000..552c3bab --- /dev/null +++ b/javascript2/week1/inclass/ex2.html @@ -0,0 +1,11 @@ + + + + + + Super Title + + + + + \ No newline at end of file diff --git a/javascript2/week1/inclass/ex2.js b/javascript2/week1/inclass/ex2.js new file mode 100644 index 00000000..0a37de29 --- /dev/null +++ b/javascript2/week1/inclass/ex2.js @@ -0,0 +1,45 @@ +const podcasts = [{ + name: 'The mystery om of Johan Klausen Varbourg', + imageUrl: 'https://picsum.photos/536/354' +}, +{ + name: 'Tips about dogs with small legs', + imageUrl: 'https://picsum.photos/536/354' +}, +{ + name: 'You, me, we and us', + imageUrl: 'https://picsum.photos/536/354' +}, +{ + name: 'Breakfast news - Dinner edition' +} +]; + +function attachImageToElement(imageUrl, element) { + const imgTag = document.createElement("img") + imgTag.src = imageUrl + element.appendChild(imgTag) +} + +// create list +const ulTag = document.createElement("ul") + +for(podcast of podcasts) { + // create many list items + const liTag = document.createElement("li") + + // handle name, create, add data, attach + const h1Tag = document.createElement("h1") + h1Tag.innerText = podcast.name + liTag.appendChild(h1Tag) + + // handle image, create, add data, attach + if(podcast.imageUrl) { + attachImageToElement(podcast.imageUrl, liTag) + } + + ulTag.appendChild(liTag) +} + +// append to the dom +document.body.appendChild(ulTag) \ No newline at end of file diff --git a/javascript2/week1/inclass/ex3.html b/javascript2/week1/inclass/ex3.html new file mode 100644 index 00000000..3ad169d4 --- /dev/null +++ b/javascript2/week1/inclass/ex3.html @@ -0,0 +1,12 @@ + + + + + + Super Title + + + + + + \ No newline at end of file diff --git a/javascript2/week1/inclass/ex3.js b/javascript2/week1/inclass/ex3.js new file mode 100644 index 00000000..c8a161be --- /dev/null +++ b/javascript2/week1/inclass/ex3.js @@ -0,0 +1,5 @@ +const buttonTag = document.getElementById("eventButton") + +buttonTag.addEventListener("click", function(event){ + event.target.innerText = "Button clicked!" +}) \ No newline at end of file diff --git a/javascript2/week1/inclass/ex4.html b/javascript2/week1/inclass/ex4.html new file mode 100644 index 00000000..0b3791c1 --- /dev/null +++ b/javascript2/week1/inclass/ex4.html @@ -0,0 +1,28 @@ + + + + + + Super Title + + + +

Hack your future

+

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus euismod et ex at molestie. In et nunc nec sapien imperdiet dapibus. Aliquam augue tortor, faucibus sit amet vehicula ultricies, sollicitudin ut sem. Pellentesque viverra aliquet ultricies. Proin odio ligula, tincidunt eu augue ut, convallis interdum diam. Donec aliquet vulputate ligula. Nulla convallis quis magna at pellentesque. Nullam dictum iaculis facilisis. Cras placerat mauris arcu, et ullamcorper mi sodales et. +

+

+ Morbi turpis enim, egestas quis arcu ac, ornare lacinia nisi. Nam a dui at neque condimentum dignissim eget a eros. Nunc nec dolor consequat mi euismod elementum ac id metus. Suspendisse id ullamcorper arcu. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Curabitur rhoncus, dolor euismod consequat tempus, erat augue molestie diam, quis posuere mi ipsum id nisi. Nullam ex nunc, volutpat quis tristique quis, scelerisque sit amet purus. Phasellus vitae urna nulla. +

+

+ Mauris eu rutrum neque. In at porta ligula, eu suscipit tellus. Etiam ac lacus suscipit, maximus nisl sed, sodales tellus. Quisque nec pretium dui, nec interdum justo. Curabitur fringilla imperdiet fermentum. Sed eget fermentum sapien, in vestibulum nisl. Morbi viverra tellus eget orci luctus, quis efficitur orci sodales. Nullam in egestas risus. Curabitur id ante lectus. +

+

+ Proin quis dignissim leo. Pellentesque sagittis malesuada mauris ut ultrices. Pellentesque finibus elementum fermentum. Etiam ornare egestas lorem, in lacinia tellus tincidunt eget. Quisque et arcu volutpat, convallis ex eu, vehicula enim. Ut nec malesuada orci, eu congue sem. Sed at ante id purus finibus congue a ac orci. Donec sed ligula eleifend, convallis sem vitae, tempus lorem. Nullam molestie vestibulum libero. Maecenas consectetur vitae turpis sit amet varius. Donec pharetra ullamcorper diam non fermentum. Nam vitae volutpat orci, sed tristique libero. Aliquam erat volutpat. Donec a enim id magna gravida congue sed sed nisl. Etiam quis tortor ac arcu pellentesque pretium at quis felis. Sed posuere id tortor auctor posuere. +

+

+ Quisque maximus elementum posuere. Pellentesque sagittis imperdiet blandit. Interdum et malesuada fames ac ante ipsum primis in faucibus. Suspendisse potenti. Curabitur dignissim elit eu risus congue rutrum. Ut at vulputate massa, varius sollicitudin lorem. Mauris eu ante odio. Mauris vel fringilla velit. Aenean tempus neque mauris, quis hendrerit urna maximus eu. Mauris lorem ex, iaculis id nunc sit amet, luctus faucibus nibh. Nullam et justo dapibus, vehicula neque non, cursus turpis. Integer et erat pulvinar, semper nisl eu, venenatis erat. Aenean eget magna non urna finibus aliquam. Vivamus commodo ut velit et placerat. Aliquam ut erat sagittis, venenatis ante eget, euismod dolor. +

+ + + \ No newline at end of file diff --git a/javascript2/week1/inclass/ex4.js b/javascript2/week1/inclass/ex4.js new file mode 100644 index 00000000..a1400024 --- /dev/null +++ b/javascript2/week1/inclass/ex4.js @@ -0,0 +1,14 @@ +const buttonTag = document.getElementById("eventButton") +const body = document.body +let isDarkMode = false + +buttonTag.addEventListener("click", function(){ + if(!isDarkMode) { + body.style.backgroundColor = "black" + body.style.color = "white" + } else { + body.style.backgroundColor = "white" + body.style.color = "black" + } + isDarkMode = !isDarkMode +}) \ No newline at end of file diff --git a/javascript2/week1/inclass/inclass1.html b/javascript2/week1/inclass/inclass1.html new file mode 100644 index 00000000..eea7902c --- /dev/null +++ b/javascript2/week1/inclass/inclass1.html @@ -0,0 +1,15 @@ + + + + + + Super Title + + + Hi this is Peter +

This is a heading

+

This is a heading number two

+ + + + \ No newline at end of file diff --git a/javascript2/week1/inclass/inclass1.js b/javascript2/week1/inclass/inclass1.js new file mode 100644 index 00000000..7e59d693 --- /dev/null +++ b/javascript2/week1/inclass/inclass1.js @@ -0,0 +1,23 @@ +// body tag +const body = document.body +console.log(body) + +// different ways of getting elements +// const notUsed = document.querySelector("h1") +const h1Tag = document.getElementById("heading") +const h1TagByClass = document.getElementsByClassName("bold") +console.log(h1Tag) +console.log(h1TagByClass) + +// Change properties +h1Tag.innerText = "Soccer training Wednesday"; +h1Tag.style.backgroundColor = 'blue'; + +// append new element to DOM +const divTag = document.createElement('div'); +divTag.innerText = "new div"; +document.body.appendChild(divTag) + +// Change img propertie +const logo = document.getElementById('logo'); +logo.src = "https://assets.fontsinuse.com/static/use-media-items/15/14246/full-2048x768/56fc6e1d/Yahoo_Logo.png?resolution=0"; \ No newline at end of file diff --git a/javascript2/week1/inclass/inclass2.html b/javascript2/week1/inclass/inclass2.html new file mode 100644 index 00000000..7076df01 --- /dev/null +++ b/javascript2/week1/inclass/inclass2.html @@ -0,0 +1,13 @@ + + + + + + Super Title + + + + + + + \ No newline at end of file diff --git a/javascript2/week1/inclass/inclass2.js b/javascript2/week1/inclass/inclass2.js new file mode 100644 index 00000000..0aad2bda --- /dev/null +++ b/javascript2/week1/inclass/inclass2.js @@ -0,0 +1,12 @@ +const buttonTag = document.getElementById("eventButton") +const otherButtonTag = document.getElementById("otherEventButton") + +const body = document.body + +function changeColor(event) { + console.log(event) + event.target.style.backgroundColor = 'red'; +} + +buttonTag.addEventListener('click', changeColor); +otherButtonTag.addEventListener('click', changeColor); \ No newline at end of file diff --git a/javascript2/week2/inclass/ex1.js b/javascript2/week2/inclass/ex1.js new file mode 100644 index 00000000..cf0a2b15 --- /dev/null +++ b/javascript2/week2/inclass/ex1.js @@ -0,0 +1,59 @@ +function randomIntFromInterval(min, max) { + return Math.floor(Math.random() * (max - min + 1) + min); +} +function generateListings(numberOfListings) { + const listings = []; + + const listingType = ['House', 'Apartment', 'Shed', 'Dorm', 'Farm']; + const listingFacilities = ['Parkering', 'Elevator', 'Altan', 'Have', 'Husdyr']; + + for (let i = 0; i < numberOfListings; i++) { + const listing = {}; + const randomTypeIndex = randomIntFromInterval(0, listingType.length - 1); + const numberOfFacilities = randomIntFromInterval(1, listingFacilities.length - 1); + const facilities = []; + for(let i = 0; i < numberOfFacilities; i++) { + const randomIndexFacilities = randomIntFromInterval(0, listingFacilities.length - 1); + const randomFacility = listingFacilities[randomIndexFacilities]; + + if (!(facilities.includes(randomFacility))) { + facilities.push(randomFacility); + } + } + + listing.type = listingType[randomTypeIndex]; + listing.facilities = facilities; + listing.price = randomIntFromInterval(1, 10000); + listing.hasGarden = Boolean(randomIntFromInterval(0, 1)); + listing.size = randomIntFromInterval(12, 1000); + listing.img = `https://loremflickr.com/200/200/${listing.type}` + + listings.push(listing); + } + + return listings; +} + +const listings = generateListings(37); + +listings.forEach(listing => { + console.log(listing.size) +}) + +const prices = listings + .map(listing => listing.prices) +console.log(prices) + +const cheapListings = listings + .filter(listing => listing.price < 5000) +console.log(cheapListings) + +const expensivePrices = listings + .filter(listing => listing.price > 5000) + .map(listing => listing.price) +console.log(expensivePrices) +const expensivePrices2 = prices.filter(price => price > 5000) + +const parkingListings = listings + .filter(listing => listing.facilities.includes("Parkering")) +console.log(parkingListings) \ No newline at end of file diff --git a/javascript2/week2/inclass/ex2.html b/javascript2/week2/inclass/ex2.html new file mode 100644 index 00000000..72cee833 --- /dev/null +++ b/javascript2/week2/inclass/ex2.html @@ -0,0 +1,43 @@ + + + + + + Listings + + + + + +
+

+ Listings +

+
+
+
Filter options
+

Some quick example text to build on the card title and make up the bulk of the card's content.

+
+
+ +
+
+ + + + + + + + + + + + + +
#TypeFacilitiesPricehas Garden?SizeImage
+
+
+ + + \ No newline at end of file diff --git a/javascript2/week2/inclass/ex2.js b/javascript2/week2/inclass/ex2.js new file mode 100644 index 00000000..e39510a2 --- /dev/null +++ b/javascript2/week2/inclass/ex2.js @@ -0,0 +1,131 @@ +function randomIntFromInterval(min, max) { + return Math.floor(Math.random() * (max - min + 1) + min); +} +function generateListings(numberOfListings) { + const listings = []; + + const listingType = ['House', 'Apartment', 'Shed', 'Dorm', 'Farm']; + const listingFacilities = ['Parkering', 'Elevator', 'Altan', 'Have', 'Husdyr']; + + for (let i = 0; i < numberOfListings; i++) { + const listing = {}; + const randomTypeIndex = randomIntFromInterval(0, listingType.length - 1); + const numberOfFacilities = randomIntFromInterval(1, listingFacilities.length - 1); + const facilities = []; + for(let i = 0; i < numberOfFacilities; i++) { + const randomIndexFacilities = randomIntFromInterval(0, listingFacilities.length - 1); + const randomFacility = listingFacilities[randomIndexFacilities]; + + if (!(facilities.includes(randomFacility))) { + facilities.push(randomFacility); + } + } + + listing.type = listingType[randomTypeIndex]; + listing.facilities = facilities; + listing.price = randomIntFromInterval(1, 10000); + listing.hasGarden = Boolean(randomIntFromInterval(0, 1)); + listing.size = randomIntFromInterval(12, 1000); + listing.img = `https://loremflickr.com/200/200/${listing.type}` + + listings.push(listing); + } + + return listings; +} +const tableBodyTag = document.getElementById("tableBody") +const listings = generateListings(1000); + +// Filter listings +const filter = { + type: 'farm', + facilities: ['Parkering', 'Husdyr'], + minPrice: 1500, + maxPrice: 8000, + hasGarden: false, + minSize: 50, + maxSize: 700 +}; + +// add filter do DOM with id filter +const filterTag = document.getElementById("filter") +// JSON stringify with line breaks and spaces +filterTag.innerHTML = JSON.stringify(filter, null, 2) + + +// const filterListings = (listings, filter) => { +// const filteredItems = listings +// .filter(listing => listing.type.toLowerCase() === filter.type) +// .filter(listing => listing.price >= filter.minPrice) +// return filteredItems +// } + +const filterListings = (listings, filter) => { + const allowedKeys = ["type", "facilities", "minPrice", "maxPrice", "hasGarden", "minSize", "maxSize"] + const filteredKeys = Object.keys(filter).filter(element => allowedKeys.includes(element)) + console.log(filteredKeys) + + const filterFunctions = { + type: listing => listing.type.toLowerCase() === filter.type.toLowerCase(), + // next line is a bit more complicated, but it works + // it checks if every element in filter.facilities is included in listing.facilities + // for filter.facilities.every see: + // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/every + facilities: listing => filter.facilities.every(facility => { + const listingFacilities = listing.facilities.map(facility => facility.toLowerCase()) + const filterFacility = facility.toLowerCase() + return listingFacilities.includes(filterFacility) + }), + minPrice: listing => listing.price >= filter.minPrice, + maxPrice: listing => listing.price <= filter.maxPrice, + hasGarden: listing => listing.hasGarden === filter.hasGarden, + minSize: listing => listing.size >= filter.minSize, + maxSize: listing => listing.size <= filter.maxSize, + } + + filteredKeys.forEach(key => { + listings = listings.filter(filterFunctions[key]) + }) + + return listings +} + + +const filteredItems = filterListings(listings, filter); + +// Functions +const resetTable = () => { + tableBodyTag.innerHTML = "" +} + +const appendElement = (elementTag, innerText, trTag) => { + const tag = document.createElement(elementTag) + tag.innerText = innerText + trTag.appendChild(tag) +} + +const renderTableBody = (listings) => { + resetTable() + + listings.forEach((listing, i) => { + const trTag = document.createElement("tr") + const cells = [ + {tag:"th", content: i + 1}, + {tag:"td", content: listing.type}, + {tag:"td", content: listing.facilities}, + {tag:"td", content: listing.price}, + {tag:"td", content: listing.hasGarden}, + {tag:"td", content: listing.size}, + {tag:"td", content: listing.img}, + + ] + cells.forEach(cell => { + appendElement(cell.tag, cell.content, trTag) + }) + + tableBodyTag.appendChild(trTag) + }); + +} + +renderTableBody(filteredItems) \ No newline at end of file diff --git a/javascript2/week2/inclass/inclass1.js b/javascript2/week2/inclass/inclass1.js new file mode 100644 index 00000000..1d60cfa9 --- /dev/null +++ b/javascript2/week2/inclass/inclass1.js @@ -0,0 +1,61 @@ +apples = [ + {weight: 175, color: 'red', isPeeled: false, price: 0.5}, + {weight: 180, color: 'yellow', isPeeled: false, price: 0.6}, + {weight: 155, color: 'green', isPeeled: false, price: 0.4}, + {weight: 230, color: 'pink', isPeeled: false, price: 0.8}, + {weight: 140, color: 'red', isPeeled: false, price: 0.3}, + {weight: 200, color: 'yellow', isPeeled: false, price: 0.7}, + {weight: 165, color: 'green', isPeeled: false, price: 0.5}, + {weight: 250, color: 'pink', isPeeled: false, price: 0.9} +] + +// console.log weight +for (let i = 0; i < apples.length; i++) { + const apple = apples[i]; + console.log(`${i}, ${apple.weight}`) +} + +// Peel the apples, peeling an apple reduces it's weight by 5g +const peeledApples = [] +for (let i = 0; i < apples.length; i++) { + const apple = apples[i]; + apple.weight -= 5 + apple.isPeeled = true + peeledApples.push(apple) +} +console.log("peeledApples:") +console.log(peeledApples) + +// Whats the total price of each apple? weight * price +const totalPrices = [] +for (let i = 0; i < apples.length; i++) { + const apple = apples[i]; + const totalPrice = apple.weight * apple.price + totalPrices.push(totalPrice) +} +console.log("totalPrices:") +console.log(totalPrices) + +// Only select green apples +const greenApples = [] +for (let i = 0; i < apples.length; i++) { + const apple = apples[i]; + if (apple.color === "green") { + greenApples.push(apple) + } +} +console.log("greenApples:") +console.log(greenApples) + +// Whats the price of all peeled green apples? +const peeledGreenApples = [] +for (let i = 0; i < apples.length; i++) { + const apple = apples[i]; + if(apple.color === "green") { + apple.weight -= 5 + apple.isPeeled = true + peeledGreenApples.push(apple) + } +} +console.log("peeledGreenApples:") +console.log(peeledGreenApples) \ No newline at end of file diff --git a/javascript2/week2/inclass/inclass2.js b/javascript2/week2/inclass/inclass2.js new file mode 100644 index 00000000..f4defe15 --- /dev/null +++ b/javascript2/week2/inclass/inclass2.js @@ -0,0 +1,53 @@ +apples = [ + {weight: 175, color: 'red', isPeeled: false, price: 0.5}, + {weight: 180, color: 'yellow', isPeeled: false, price: 0.6}, + {weight: 155, color: 'green', isPeeled: false, price: 0.4}, + {weight: 230, color: 'pink', isPeeled: false, price: 0.8}, + {weight: 140, color: 'red', isPeeled: false, price: 0.3}, + {weight: 200, color: 'yellow', isPeeled: false, price: 0.7}, + {weight: 165, color: 'green', isPeeled: false, price: 0.5}, + {weight: 250, color: 'pink', isPeeled: false, price: 0.9} +] + +// console.log weight +apples.forEach((apple, i) => { + console.log(apple.weight) +}); +apples.forEach(console.log) + +// Peel the apples, peeling an apple reduces it's weight by 5g +const peeledApples = apples.map(apple => { + apple.weight -= 5 + apple.isPeeled = true + return apple +}) +console.log("peeledApples:") +console.log(peeledApples) + +// Whats the total price of each apple? weight * price +const totalPrices = apples.map(apple => { + return apple.weight * apple.price +}) +console.log("totalPrices:") +console.log(totalPrices) + +// Only select green apples +const greenApples = apples.filter(apple => apple.color === 'green') +console.log("greenApples:") +console.log(greenApples) + +// Whats the price of all peeled green apples? +const peeledGreenApples = apples.filter(apple => apple.color === 'green') + .map(apple => { + apple.weight -= 5 + apple.isPeeled = true + return apple + }) +console.log("peeledGreenApples:") +console.log(peeledGreenApples) + +// sort intro, other array function +const numbers = [5,2,3,4,5,20,6,7] +const sortedNumbers = numbers.sort() +console.log(numbers) +console.log(sortedNumbers) \ No newline at end of file diff --git a/javascript2/week2/inclass/inclass3.html b/javascript2/week2/inclass/inclass3.html new file mode 100644 index 00000000..67ac6bf7 --- /dev/null +++ b/javascript2/week2/inclass/inclass3.html @@ -0,0 +1,69 @@ + + + + + + Hungry For Apples? + + + + + +
+

+ + + + + Hungry For Apples? + + + + +

+ +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+
+ + + + + + + + + + + +
#WeightColorPriceTotal Price
+
+
+ + + \ No newline at end of file diff --git a/javascript2/week2/inclass/inclass3.js b/javascript2/week2/inclass/inclass3.js new file mode 100644 index 00000000..4464dc85 --- /dev/null +++ b/javascript2/week2/inclass/inclass3.js @@ -0,0 +1,71 @@ +apples = [ + {weight: 175, color: 'red', isPeeled: false, price: 0.5}, + {weight: 180, color: 'yellow', isPeeled: false, price: 0.6}, + {weight: 155, color: 'green', isPeeled: false, price: 0.4}, + {weight: 230, color: 'pink', isPeeled: false, price: 0.8}, + {weight: 140, color: 'red', isPeeled: false, price: 0.3}, + {weight: 200, color: 'yellow', isPeeled: false, price: 0.7}, + {weight: 165, color: 'green', isPeeled: false, price: 0.5}, + {weight: 250, color: 'pink', isPeeled: false, price: 0.9} +] +defaultOptions = { + color: 'all' +} + +// Form elements +const radioElements = document.getElementById("radioForm").appleRadios +const tableBodyTag = document.getElementById("tableBody") + +// Functions +const resetTable = () => { + tableBodyTag.innerHTML = "" +} + +const appendElement = (elementTag, innerText, trTag) => { + const tag = document.createElement(elementTag) + tag.innerText = innerText + trTag.appendChild(tag) +} + +const renderTableBody = (apples, options) => { + resetTable() + + if(options.color !== 'all') { + apples = apples.filter(apple => apple.color === options.color) + } + + apples = apples.map(apple => { + apple.totalPrice = apple.weight * apple.price + return apple + }) + + apples.forEach((apple, i) => { + const trTag = document.createElement("tr") + const cells = [ + {tag:"th", content: i + 1}, + {tag:"td", content: apple.weight}, + {tag:"td", content: apple.color}, + {tag:"td", content: apple.price}, + {tag:"td", content: apple.totalPrice}, + + ] + cells.forEach(cell => { + appendElement(cell.tag, cell.content, trTag) + }) + + tableBodyTag.appendChild(trTag) + }); + +} + +radioElements.forEach(element => { + element.addEventListener("change", event => { + const options = { + color: event.target.value + } + renderTableBody(apples, options) + }) +}) + +// main +renderTableBody(apples, defaultOptions) \ No newline at end of file diff --git a/javascript2/week3/inclass/anonymousFunctions.js b/javascript2/week3/inclass/anonymousFunctions.js new file mode 100755 index 00000000..464e0f24 --- /dev/null +++ b/javascript2/week3/inclass/anonymousFunctions.js @@ -0,0 +1,24 @@ +function multBy2(x){ + // body of the function + // scope of the function + return 2 * x +} + +console.log(typeof multBy2) +console.log(typeof multBy2(4)) // HERE WE CALL/EVALUATE THE FUNCTION +console.log(multBy2) +console.log(multBy2(4)) + + +const multBy2AsVariable = x => 2 * x +console.log(typeof multBy2AsVariable) + + +// anonymous function! +const arrayOfNumbers = [1, 2, 3, 4] +const mappedValues = arrayOfNumbers.map(x => 4 * x) // anonymous function +console.log(mappedValues) + +const arrayOtherNumbers = [6, 7, 8, 9] +const otherMappedValues = arrayOtherNumbers.map(multBy2) // named function` +console.log(otherMappedValues) \ No newline at end of file diff --git a/javascript2/week3/inclass/every_some.js b/javascript2/week3/inclass/every_some.js new file mode 100644 index 00000000..77c5e1d2 --- /dev/null +++ b/javascript2/week3/inclass/every_some.js @@ -0,0 +1,11 @@ +const array = [True, True, True] + +// array[0] && array[1] && array[2] +if(array.every(x => x)){ + console.log("Waiting for...") +} + +// array[0] || array[1] || array[2] +if(array.some(x => x)){ + console.log("... Pizza") +} \ No newline at end of file diff --git a/javascript2/week3/inclass/exercise1.html b/javascript2/week3/inclass/exercise1.html new file mode 100644 index 00000000..52d326a2 --- /dev/null +++ b/javascript2/week3/inclass/exercise1.html @@ -0,0 +1,36 @@ + + + + + + + + + + + + \ No newline at end of file diff --git a/javascript2/week3/inclass/exercise2.html b/javascript2/week3/inclass/exercise2.html new file mode 100644 index 00000000..1dfba0d4 --- /dev/null +++ b/javascript2/week3/inclass/exercise2.html @@ -0,0 +1,64 @@ + + + + + + + +
+ + + \ No newline at end of file diff --git a/javascript2/week3/inclass/functionInFunction.js b/javascript2/week3/inclass/functionInFunction.js new file mode 100755 index 00000000..7a203685 --- /dev/null +++ b/javascript2/week3/inclass/functionInFunction.js @@ -0,0 +1,20 @@ +const action = (x, y, callback) => { + const result = callback(x, y); + return result; +} + +const add = (x, y) => x + y; +const sub = (x, y) => x - y; + +console.log(add) +console.log(add(4, 4)) +console.log(sub) +console.log(sub(8, 4)) +console.log(action) + +// named function into action +console.log( action(8, 8, add) ) +console.log( action(16, 2, sub) ) + +// // anonymous function into action +console.log( action(8, 8, (x, y) => x * y) ) \ No newline at end of file diff --git a/javascript2/week3/inclass/setInterval.html b/javascript2/week3/inclass/setInterval.html new file mode 100755 index 00000000..5555640b --- /dev/null +++ b/javascript2/week3/inclass/setInterval.html @@ -0,0 +1,40 @@ + + + + + + + + + + \ No newline at end of file diff --git a/javascript2/week3/inclass/setTimeout.html b/javascript2/week3/inclass/setTimeout.html new file mode 100755 index 00000000..f240dde6 --- /dev/null +++ b/javascript2/week3/inclass/setTimeout.html @@ -0,0 +1,26 @@ + + + + + + + + + \ No newline at end of file diff --git a/javascript2/week3/inclass/setTimeoutWithParameters.html b/javascript2/week3/inclass/setTimeoutWithParameters.html new file mode 100644 index 00000000..0ca03432 --- /dev/null +++ b/javascript2/week3/inclass/setTimeoutWithParameters.html @@ -0,0 +1,25 @@ + + + + + + + + + \ No newline at end of file