Backbone.js constructor/initialize Router

The Backbone.js constructor/initialize Router is used when we create a new router. We can pass routes hash directly as an option. It takes one parameter which is an object which is passed to initialize the function.

Syntax:

new Router( options )

Parameter:

option: This parameter is an object which is passed to initialize the function.

Example1: In this example, we will illustrate The Backbone.js constructor/initialize Router. Here we will use the constructor and initialize the Router which will with the new operator. On match of URL, we write some text on output.

HTML

<!DOCTYPE html>

<head>
    <title>BackboneJS constructor/initialize Router</title>
    <script src=
"https://code.jquery.com/jquery-2.1.3.min.js" 
            type="text/javascript">
    </script>
    <script src=
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.2/underscore-min.js" 
            type="text/javascript">
    </script>
    <script src=
"https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.2/backbone-min.js" 
            type="text/javascript">
    </script>
</head>

<body style="text-align:center;" id="body">
    <h1 style="color: green;">
        GeeksforGeeks
    </h1>
    <h3>BackboneJS constructor/initialize Router</h3>
    <script type="text/javascript">
        var Router = Backbone.Router.extend({
            routes: {
                '': 'link'
            },
            link: function () {
                document.write("Router has been constructed");
            }
        });
        var router = new Router();
        Backbone.history.start();    
    </script>
</body>

</html>

Output:

Backbone.js constructor / initialize Router

Example2: In this example, we will construct a new Router and pass arguments to initialize the function.

HTML

<!DOCTYPE html>

<head>
    <title>BackboneJS constructor/initialize Router</title>
    <script src=
"https://code.jquery.com/jquery-2.1.3.min.js" 
            type="text/javascript">
    </script>
    <script src=
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.2/underscore-min.js" 
            type="text/javascript">
    </script>
    <script src=
"https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.2/backbone-min.js" 
            type="text/javascript">
    </script>
</head>

<body style="text-align:center;" id="body">
    <h1 style="color: green;">
        GeeksforGeeks
    </h1>
    <h3>BackboneJS constructor/initialize Router</h3>
    <script type="text/javascript">
        var Router = Backbone.Router.extend({
            initialize: function (a) {
                document.write(`Hello ${a['name']} 
                        your router successfully created`);
            }
        });
        var router = new Router({ name: "Geeks" });
        Backbone.history.start();  
    </script>
</body>

</html>

Output:

Reference: https://backbonejs.org/#Router-constructor

Backbone.js constructor/initialize Router

Explore