My #javascriptmas experience and solutions

Francesco Luppi — Fri, 25 Dec 2020 12:43:10 +0000

Oh Oh Oh Merry Christmas to all!
This past few days I followed and practiced for 24 days with this beautiful series of challenges.

I'm talking about the 24 Days of Jascriptmas on Scrimba!

If you want to know more and try it yourself to see how well prepared you are on Javascript I'm suggesting you to take a chance on that and don't go further on this article just yet, so you don't spoil yourself the solutions ;)

In order to get the certificate to complete my journey, I have to create this post with my solutions, and if you want you can use it to compare them with the ones that you came up with.
Here we go!

Day 1: Candies

function candies(children, candy) {
    //  write code here.
    return result = Math.floor(candy/children) * children
}

Day 2: Deposit Profit

function depositProfit(deposit, rate, threshold) {
    //  write code here.
    let years = 0
    while (deposit < threshold){
        deposit += (deposit*20)/100
        years++
    }
    return years
}

Day 3: Chunky Monkey

function chunkyMonkey(values, size) {
    //  write code here.
    let result = []
    result.push(values.slice(0, size), values.slice(size, values.length+1))
    return result
}

Day 4: Century From Year

function centuryFromYear(num) {
    //  write code here.
    const r = num % 100, century = num / 100
    return (r === 0) ? century : Math.floor(century) + 1
}

Day 5: Reverse A String

function reverseAString(str) {
    //  write code here.
    return str.split('').reverse().join('')
}

Day 6: Sort by Length

function sortByLength(strs) {
    //  write code here.
    return strs = strs.sort((a, b)=> a.length - b.length)
}

Day 7: Count Vowel Consonant

function countVowelConsonant(str) {
  // write code here
  let vowels = ['a','e','i','o','u','y']
  return str.split('').reduce((acc,cur)=> vowels.includes(cur) ? acc + 1 : acc + 2, 0)
}

Day 8: The Rolling Dice

// Write your code here 👇
const dice = document.querySelector('.dice')
const num = document.querySelector('.num p')
dice.addEventListener('click',()=>{
    let numDice = Math.floor(Math.random() * (7 - 1)) + 1
    num.textContent = numDice
    dice.textContent = ''
    for(let i=1; i<=numDice;i++){
        let dot = document.createElement('div')
        dot.classList = 'dot'
        dice.appendChild(dot)
    }
})

body {
    background-color: #AEB8FE;
    height: 100vh;
    display: grid;
    place-content:center;
}

.dice {
    width: 90px;
    height: 90px;
    border-radius: 10px;
    background-color: #EFE5DC;
    cursor: pointer;
    display: grid;
    grid-template-columns: repeat( auto-fill, minmax(30px, 2fr) );
    grid-gap: 8px;
    place-content:center;
    padding: 5px;
}

.dot {
    width: 20px;
    height: 20px;
    max-width: 20px;
    max-height: 20px;
    border-radius: 15px;
    background-color: black;
    place-content: center;
    margin: 0 auto;
}

p{
    text-align: center;
    font-size: 2em;
    font-weight: bold;
    font-family: 'Lato', sans-serif;
    margin: 10px;
}

Day 9: Sum Odd Fibonacci numbers

function sumOddFibonacciNumbers(num) {
    //  write code here.
    if(num <= 0){
        console.error('Invalid input!')
        return NaN;
    }
    let answer = 2
    let a = 1, b = 1, c = 0
    while(a+b <= num){
        c = a+b
        a = b
        b = c
        if(c%2)
            answer += c
    }
    return answer
}

Day 10: Adjacent Elements Product

function adjacentElementsProduct(nums) {
    //  write code here.
    let pro = 0, max = 0
    for (let i=0; i<nums.length; i++){
        pro = nums[i]*nums[i+1]
        if(pro>max) max=pro
        console.log(pro)
    }
    return max
}

Day 11: Avoid Obstacles

function avoidObstacles(nums) {
    //  write code here.
    let numSorted = nums.sort((a, b) => a - b)
    for (let i=1; i<numSorted[numSorted.length-1]; i++) {
        if(numSorted.every((n) => n % i !== 0)) {
            return i;
        }
    }
}

Day 12: Valid Time

function validTime(str) {
    //  write code here.
    let hm = str.split(':')
    return ((parseInt(hm[0])>=0&&parseInt(hm[0])<=24) && (parseInt(hm[1])>=0&&parseInt(hm[1])<=60)) ?  true : false
}

Day 13: Extract Each Kth

function extractEachKth(nums, index) {
    //  write code here.
    return nums.filter(num=>num%index!=0)
}

Day 14: Maximal Adjacent Difference

function arrayMaximalAdjacentDifference(nums) {
    //  write code here.
    let dif = 0, max = 0
    for (let i=0; i<nums.length; i++){
        dif = Math.abs(nums[i]-nums[i+1])
        if(dif>max) max=dif
    }
    return max
}

Day 15: Carousel

const gallery = document.querySelector('.gallery')
const prev = document.querySelector('.previous')
const next = document.querySelector('.next')
let photos = document.querySelectorAll('.card')
let position = 0, current, i = 0

next.addEventListener('click', ()=>{
    if(i!=(photos.length-1)){
        gallery.style.transform  = 'translateX(' + (position-=220) + 'px)'
        ++i
    }else{
        next.style.opacity = 0.3
        prev.style.opacity = 1
    }
})
prev.addEventListener('click',()=>{
    if(i!=0){
        --i
        gallery.style.transform  = 'translateX(' + (position+=220) + 'px)'
    }else{
        prev.style.opacity = 0.3
        next.style.opacity = 1
    }
})

Day 16: Insert Dashes

function insertDashes(arr) {
    // write code here
    let newArr = arr.split(' ')
    return newArr[0].split('').join('-')+' '+newArr[1].split('').join('-')
}

Day 17: Different Symbols Naive

function differentSymbolsNaive(str) {
    //  write code here.
    let s = new Set(str.split(''))
    return s.size
}

Day 18: Array Previous Less

function arrayPreviousLess(nums) {
    //  write code here.
    let result = []
    for(let i = 0; i < nums.length; i++){
        if(nums[i] > nums[i-1]){
            result.push(nums[i-1])
        }else{
            result.push(-1)
        }
    }
    return result
}

Day 19: Alphabet Subsequence

function alphabetSubsequence(str) {
    //  write code here.
    for(let i=1; i<=str.length; i++){
        if (str.charCodeAt(i) >= str.charCodeAt(i+1) && str[i]!=str[i-1]) return false
        else return true
    }
}

Day 20: Domain Type

function domainType(domains) {
    //  write code here.
    let result = domains.map(domain=>{
        domainSingle = domain.split('.')
        if (domainSingle[(domainSingle.length-1)] === "org") return 'organization'
        else if (domainSingle[(domainSingle.length-1)] === "net") return 'network'
        else if (domainSingle[(domainSingle.length-1)] === "info") return 'information'
        else if (domainSingle[(domainSingle.length-1)] === "com") return 'commercial'
    })
    return result
}

Day 21: Sum Of Two

function sumOfTwo(nums1, nums2, value) {
    //  write code here.
    let result = false
    for(let i = 0; i<nums1.length; i++){
        for(let j=0; j<nums2.length; j++){
            console.log(nums1[i]+nums2[j])
            if((nums1[i]+nums2[j])===42){
                result = true
            }
        }
    }
    return result
}

Day 22: Extract Matrix Column

function extractMatrixColumn(matrix, column) {
    //  write code here.
    let result = []
    matrix.map(mat => result.push(mat[column]))
    return result
}

Day 23: Social Media Input

let counter = document.querySelector('#counterFooter')
let tweet = document.querySelector('#string')
let btn = document.querySelector('#btn')
tweet.addEventListener('keydown', (e)=>{
    let chr = 140 - tweet.value.length
    counter.textContent = chr + '/140'
    if(chr > 20)counter.classList.remove('ending')
    if(chr <= 20) counter.classList.add('ending')
    if(chr<=0) {
        btn.classList.add('buttonDisabled')
        if(e.key != 'Backspace'){
            tweet.blur()
        }
    }else{
        btn.classList.remove('buttonDisabled')
    }
})

.ending{
    color: red !important;
    font-weight: bold;
}

Day 24: Test Your Agility

//EDIT THIS FUNCTION
const spin = async () => {
  for (var i=0;i<101;i++) {
    if(i==100){
        i=0;
    }
    if(pushed == true){
        stop(i); //Trigger this function when the STOP button has been pushed
        break;
    }else{
        spinningElem.innerHTML = i;
        await sleep(75) //Paste this 
    }  
  }
}

//EDIT THIS FUNCTION
function stop(i){
    //WRITE YOUR CODE HERE
    var result = document.getElementById('result'); //display your result message here
    if(i===targetInt) result.textContent = 'Y E S! You did it'
    else if(i < targetInt) result.textContent =`Oh no! You missed it by ${targetInt-i}`
    else result.textContent =`Oh no! You missed it by ${i-targetInt}`

}

DEV Community: Francesco Luppi