Execute code after calling each function

Question

I have a function scrolltobottom()that runs after each function is executed.

How can I reorganize the code so that I do not need to type scrolltobottom()everywhere?

Preferably without using jQuery.

async function initBot () {
  let botui = BotUI('homepage-bot', {
    vue: Vue
  })

  let scrolltobottom = () => {
    let ele = document.getElementById('botui')
    document.body.scrollTop = ele.clientHeight
  }

  await botui.message.bot({"Hello"})
  await scrolltobottom()

  await botui.message.bot({"Do you like apple or orange?"})
  await scrolltobottom()

  await botui.message.button({"Orange", "Apple"})
  await scrolltobottom()
}

Answer 1

You can create a decorator function

function decorateWith(targetFn, fn){
  return function(){
    targetFn.apply(this, arguments);
    fn();
  }
}

[ botui.message.bot,
  botui.message.button ]
  .forEach(fn => decorateWith(fn, scrolltobottom));