How to execute js only on certain pages?

Question

JavaScript

Here everyone glues all the js into a single minified file.
And how to execute its pieces only on certain pages?
After all, on each page its functions are called, its widgets, its events are initialized.
It seems that it's okay - after all, if there are no elements, then nothing is initialized, but ... What is it? Will all the code be re-executed every time the link is clicked (assuming we don't have a spa)?

Answer 1

And in this matter it will help you for example:
requirejs.org
browserify.org

Answer 2

What does it mean to be initialized?
Initializes nothing if selector:
[data-toggle="modal"]none
That is, only the selector is searched.
Or are you talking about some other initializations?

Answer 3

It's a weird question, but I'll try to answer.
Example from backend in php. In the template, you make a script tag, you pass it from the controller, or whatever you have there is the name of the page.

<script>
var currentPage = <?=$this->pageName?>; // Например $this->pageName == "first"
</script>

In js you do something like this:

var pages = {};
pages.first = function() {
    // тут код который должен вызываться на первой странице.
}
pages.second = function() {
    // тут код который должен вызываться на второй странице.
}
// потом вызываете код нужной страницы.
pages[currentPage]();

Answer 4

Here is a good article on this topic, with examples:
https://blog.lisogorsky.ru/js-css-individual-inclusion