As a follow up of my previous blog post on arrow functions, I thought I would create a little playground for you all to practice!
How does it work?
- Open the browser console (on Chrome/Mac
option
+command
+i
but you can also right click and use "inspect" option). - Copy the initial function and see what it returns.
- Transform it into an arrow function and run it in the console.
- Go to the readme and check the answer to your question in the hidden field.
NOTE: I intended the answers to be included in this blog post but it seems that DEV does not react to <details>
tag, sadly.
[1] Two arguments
Transform this function:
function sum(num1, num2){
return num1 + num2
}
sum(40,2)
sum(42,0)
console.log("the answer to everything is", sum(42,0))
Check the answer here.
[2] One argument
Transform this function that tells you how long a string is:
function stringLength(str){
console.log(`the length of "${str}" is:`, str.length)
}
let longestCityNameInTheWorld = "Taumatawhakatangihangakoauauotamateaturipukakapikimaungahoronukupokaiwhenuakitanatahu"
stringLength(longestCityNameInTheWorld)
Check the answer here.
[3] One argument, pt.2
Let's change the previous function a bit to include a variable and a return statement:
function stringLength(str){
let length = str.length
console.log(`the length of "${str}" is:`, length)
return str.length
}
stringLength("willynilly")
Check the answer here.
[4] One argument
Transform this function that selects a random element from the array and concatenates it to your name:
let alerts = ["Hey, you are awesome", "You are so wonderful", "What a marvel you are", "You're so lovely", "You're so sweet that I'd think you're a sweet potato -- and I LOOOOVE POTATOES"]
function showAlert(name){
alert(alerts[(Math.floor(Math.random()*alerts.length))] + `, ${name}!`)
}
showAlert("you ball of fluff")
Check the answer here.
[5] Nested functions
Transform this function that rotates elements in your browser + remember about transforming also the traditional function in the .map
:
function oneTwoThreeRotate(){
Array.prototype.slice.call(document.querySelectorAll('div,p,span,img,a,body')).map(function(tag){
tag.style['transform'] = 'rotate(' + (Math.floor(Math.random() * 3) - 1) + 'deg)';
})
}
oneTwoThreeRotate()
Check the answer here.
Cover photo from Pexels.
Top comments (0)