JavaScript module dependency management technique

Question

JavaScript module dependency management technique

Just starting out with JavaScript, I'm attempting to incorporate a JavaScript library/sdk. I've familiarized myself with common patterns and currently considering using the revealing module pattern. To provide a concrete example, let's imagine a scenario where there is a library where people can rent books. This library will offer 2 objects to the application - library and rented_books. To simplify, let's assume this library only keeps track of rented books, not available books.

My plan is to create a file named library.js and place the complete module for the library object within it. Similarly, I will create another module called book.js for the book object. Now, I have a couple of questions:

How can I establish the relationship between these two objects? Should I use 'new' on the book object when a user wants to rent a book?
How can I ensure that the book module is loaded before the library object?

Essentially, I'm unsure about the process of creating a library in this manner. Any resources or articles that explain this concept would be greatly appreciated.

javascript design-patterns javascript-objects

Answer 1

Answer №1

If you're unsure about something, try the following approach:

Inside book.js

var bookFunctions = { // write your methods here }

Inside lib.js

var library = { // write your methods here }
library = Object.create(bookFunctions);

You can now access any function from book.js in lib.js

As for your second concern:

$.getScript("firstScript").done(function() {
    $.getScript("secondScript").done(function() {
        $.getScript("thirdScript").done(function() {
            alert("scripts loaded");
        });
    });
});

Please note, this is just one way to address your issues and there may be other alternatives available as well.

Answer 2

If you're unsure about something, try the following approach:

Inside book.js

var bookFunctions = { // write your methods here }

Inside lib.js

var library = { // write your methods here }
library = Object.create(bookFunctions);

You can now access any function from book.js in lib.js

As for your second concern:

$.getScript("firstScript").done(function() {
    $.getScript("secondScript").done(function() {
        $.getScript("thirdScript").done(function() {
            alert("scripts loaded");
        });
    });
});

Please note, this is just one way to address your issues and there may be other alternatives available as well.

JavaScript module dependency management technique

Answer №1

Similar questions

Leveraging ES6 in Vue.js

What is causing my ajax request to malfunction?

Sending an ArrayBuffer from Angular to Electron results in the window crashing

Issue with React Redux: Passing down a component's method to its children results in an undefined error

Creating a custom map using React and Leaflet

The redirect link to Facebook Messenger is functional on desktop browsers but experiences difficulties on mobile browsers

Is it possible to initiate a series of node tasks in a predetermined sequence?

Error: Undefined Function [Thinkster.io's Angular Tutorial Chapter 4]

Dealing with errors in Express.js within the service or controller layers

javascript popup appears twice in IE when using PHP

Isotopes - filtering with masonry layout and jQuery

Incapable of retrieving data from MongoDB due to a failure in fetching results using streams in Highland.js

The script fails to execute upon the loading of the view

Pressing the Enter key will result in data fetched from JSON being logged multiple times

What is preventing me from assigning a value of false to my JavaScript variable?

Guide to obtaining ngPrime autocomplete text when the button is clicked within Angular 6

How to use the route.navigate() method in Angular 9 to open a URL in a new tab with a query string

How can I modify this section of the code in Google Script to retrieve all columns?

identifying the element targeted on dynamically created links with the help of jquery

Generate a new entry and its linked data simultaneously