web-dev-qa-db-fra.com

Erreur JavaScript: "n'est pas un constructeur"

J'utilise backbone.js avec jquery et underscore.js

Voici une partie de mon code (il ne fait rien encore). La chose étrange est qu’en frappant l’URL "/ # utilisateurs", il n’ya pas d’erreur. Le seul cas où l'erreur se produit est lorsque je clique ensuite pour accéder à un hachage différent, puis je clique en arrière pour accéder à "/ # utilisateurs". Voici une partie de mon code, avec la ligne qui reçoit l'erreur vers la fin Users = new Users(); l'erreur indique "Les utilisateurs ne sont pas des constructeurs":

var User = Backbone.Model.extend({
    url: function(){return 'api/user/id/' + this.id;}
});

var Users = Backbone.Collection.extend({
    model: User,
    url: function(){return 'api/users';},
    initialize: function() {
    }
});

var UsersView = Backbone.View.extend({
    initialize: function() {
        this.users = this.options.users;
        this.render();
    },

    render: function() {
        _(this.users).each(function(){
        //  $('#app').append('here');
        });

        var template = _.template($('#usersTemplate').text());

        $(this.el).html(template({users: this.users}));
        $('#app').html(this.el);
    }
});

var UserView = Backbone.View.extend({
    initialize: function() {
        this.user = this.options.user;
        this.render();
    },

    render: function() {

        var template = _.template("hello {{user.name}}");

        $(this.el).html(template({user: this.user.toJSON()}));
        $('#app').html(this.el);
    }
});

var Controller = Backbone.Controller.extend({
    routes: {
        'dashboard' : 'dashboard',
        'users' : 'showusers'
    },

    showuser: function(id) {
        UserList.fetch({
            success: function(){
                new UserView({user: User});
            },
            error: function(){
                alert('an error of sorts');
            }
        });
    },

    showusers: function() {
        Users = new Users();
        Users.fetch({
            success: function(Users) {
                new UsersView({users: Users});
            },
            error: function() {
            }
        });
    },

    dashboard: function() {
        Users = new Users;
        Users.fetch({
            success: function() {
                new UsersView({users: Users});
            },
            error: function() {
            }
        });
    }
});

$(document).ready(function(){
    var ApplicationController = new Controller;
    Backbone.history.start();
});

le code HTML d'accompagnement si vous êtes curieux:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Administration Panel</title>

    <!-- Framework -->
    <script src="/javascripts/jquery.min.js"></script>
    <script src="/javascripts/underscore.min.js"></script>
    <script src="/javascripts/backbone.js"></script>

    <!-- Application -->
    <script src="/javascripts/application.js"></script>

    <script id="usersTemplate" type="text/x-underscore-template">
        asdf
    </script>

</head>
<body>

<div>
<a href="#dashboard">Dashboard</a>
<a href="#users">Users</a>
<a href="#products">Products</a>
<a href="#orders">Orders</a>
<a href="#pages">Pages</a>
<a href="#settings">Settings</a>
</div>

<div id="app"></div>

</body>
</html>
javascriptjquerydebuggingbackbone.jsunderscore.js
11
Matthew

new ne peut être utilisé qu'avec une fonction en tant qu'opérande.

new {}  // Error: ({}) is not a constructor

Vérifiez le type de Users dans le contexte: il s'agit de non une fonction lorsque cette exception est déclenchée.

Code heureux

alert(typeof(Users)) devrait faire l'affaire. Le résultat devrait être "function" pour pouvoir être utilisé en tant que constructeur. Prenez note de ce que c'est dans le cas d'échec, et voir ci-dessous pour une raison.

Un scénario problématique (pour Users = new Users) peut être: un objet est construit à partir de la fonction Users, puis l'objet (maintenant pas une fonction/constructeur) est attribué à Users de sorte que le prochain new Users ira kaboom! (Regardez à la fois dans showusers et dashboard - ce comportement est-il vraiment destiné?)

Le code «correct» est probable: var users = new Users; users.blahblah(...); en d’autres termes, utilisez une nouvelle variable locale et ne pas écraser la variable/propriété globale Users.

La raison pour laquelle l'erreur est générée uniquement lors du passage à "#foobar" (a Fragment Identifier ) est qu'aucune nouvelle page n'est chargée et que, par conséquent, le code JavaScript n'est pas rechargé et le paramètre actuel (maintenant corrompu Users) utilisé. Kaboom!

Extrait de Identificateur de fragment :

Si l'élément ciblé est situé dans le document en cours, un agent utilisateur peut simplement le focaliser sans avoir à le recharger ...

22
user166390

Je pense que son erreur de syntaxe 

cela m'est arrivé quand j'ai essayé de return anonymous object dans ma fonction 

 var FalsEextension=false;
 ........
 ........
 return new  { FalsEextension, LargeFile };// wrong Syntax

et la syntaxe correcte est

 return { FalsEextension, LargeFile };

et vous pouvez l'utiliser comme ça

ObjectName.FalsEextension
0
Basheer AL-MOMANI