If you don't have that much Javascript, you can go with modules.

(function($) {
 var Module = {

    'common': {
      init: function() {
             xxx
      },
      finalize: function() {
             xxx
      }
    },

    'home': {
      init: function() {
        xxx
     }
    },
  };
})(jQuery);

However as I am using babel and browserify and some ES6 sugar, I am going a more modular way.

app.js

My main javascript file, which requires or imports (es6 way) my components. Example:

import Slider from './Components/Slider'

var mainSlider = new Slider('.carousel')
mainSlider.up()

const magConfig = {
    slidesToShow: 5,
    slidesToScroll: 1,
    ....
}


var magazinSlider = new Slider('.magazin-listing', magConfig )
magazinSlider.up()

Components/Slider.js

import slick from 'slick-carousel'
import $ from 'jquery'
import _ from 'underscore'

class Slider {

  constructor(selector, settings) {
    let defaultSettings = {
     // Some slider settings....

    }

    this.settings = defaultSettings

     // Some other constructor code....

  }

  up() {

    $(this.selector).slick(this.settings)
  }

  down() {
    $(this.selector).slick('unslick')
  }
}

export default Slider

It's actually a bit more work, but it's cleaner and you can reuse stuff easy.

ToggleMenu

import $ from 'jquery';

const selector = '.mobile-trigger';
const navigation = '.main__navigation__content';

class MobileMenu {
  constructor() {
    $(selector).on('click', (e) => {
      $(navigation).toggleClass('main__navigation--open')
    })
  }
}

export default new MobileMenu()