callback_hell

by LITSAKI

HTML

<div id="food-container">

</div>

JavaScript

(() => {

    const ingredients = {
        pasta: 'melissa',
        mincedMeat:"beef",
        sauce:"tomato"
    };
    
    const texts = {
         cookPasta: "i will be cooked",
         boilPasta: "i am boiled",
         drainPasta: "i am drained",
         addButter:"butter is being added on me",
         putOnPlate:"i landed on the plate",
         cookMincedMeat: "meat will be cooked",
         defreezeMeat: "minced meat is defrozen",
         chopOilMeat: "chop and oil meat"
    }
    
    const createChildElement = (text) => {
       let childEl = document.createElement('div');
       childEl.innerText = text;
       document.getElementById('food-container').appendChild(childEl);
    }
    
    const cookPasta = (ingredients,callback) => {
        if (typeof callback === 'function') 
            callback(ingredients);
    }
    
    const boilPasta = (pasta, callback) => {
        if (typeof callback === 'function') 
           console.log(texts.boilPasta);
           createChildElement(texts.boilPasta);
            callback(pasta);
    }
    
     const drainPasta = (pasta, callback) =>{
        if (typeof callback === 'function') 
           console.log(texts.drainPasta);
           createChildElement(texts.drainPasta);
           callback(pasta);
    }
    
     const addButter = (pasta, callback) => {
        if (typeof callback === 'function') 
             console.log(texts.addButter);
                createChildElement(texts.addButter);
             callback(pasta);
    }
    
     const putOnPlate = (food) =>{
            createChildElement(texts.putOnPlate);
    }
    
    const cookMincedMeat = (meat, callback) => {
          if (typeof callback === 'function') 
             console.log(texts.cookMincedMeat);
                createChildElement(texts.cookMincedMeat);
             callback(meat);
    }
    
    const defreezeMeat = (mincedMeat, callback) =>{
     if (typeof callback === 'function') 
            ...