“Uncaught TypeError: undefined n'est pas une fonction” - Débutant Backbone.js Application

Je suis la mise en place est assez simple application avec la colonne vertébrale, et j'obtiens une erreur.

Uncaught TypeError: undefined is not a function example_app.js:7
ExampleApp.initialize example_app.js:7
(anonymous function)

C'est l'endroit où l'erreur s'affiche dans l'Inspecteur de Chrome (fichier init - example_app.js):

var ExampleApp = {
  Models: {},
  Collections: {},
  Views: {},
  Routers: {},
  initialize: function() {
    var tasks = new ExampleApp.Collections.Tasks(data.tasks);
    new ExampleApp.Routers.Tasks({ tasks: tasks });
    Backbone.history.start();
  }
};

Voici mes tâches de l'index.haml fichier

- content_for :javascript do
  - javascript_tag do
    ExampleApp.initialize({ tasks: #{raw @tasks.to_json} });

= yield :javascript

modèles /task.js

var Task = Backbone.Model.extend({});

collections /tasks.js

var Tasks = Backbone.Collection.extend({
    model: Task,
    url: '/tasks'
});

routeurs /tasks.js

ExampleApp.Routers.Tasks = Backbone.Router.extend({
    routes: {
        "": "index"
    },

    index: function() {
        alert('test');
        //var view = new ExampleApp.Views.TaskIndex({ collection: ExampleApp.tasks });
        //$('body').html(view.render().$el);
    }
});

Et voici la preuve que je vais appeler tous les fichiers (je pense):

<script src="/assets/jquery.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery_ujs.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery-ui.js?body=1" type="text/javascript"></script>
<script src="/assets/underscore.js?body=1" type="text/javascript"></script>
<script src="/assets/backbone.js?body=1" type="text/javascript"></script>
<script src="/assets/backbone-support/support.js?body=1" type="text/javascript"></script>
<script src="/assets/backbone-support/composite_view.js?body=1" type="text/javascript"></script>
<script src="/assets/backbone-support/swapping_router.js?body=1" type="text/javascript"></script>
<script src="/assets/backbone-support.js?body=1" type="text/javascript"></script>
<script src="/assets/example_app.js?body=1" type="text/javascript"></script>
<script src="/assets/easing.js?body=1" type="text/javascript"></script>
<script src="/assets/modernizr.js?body=1" type="text/javascript"></script>
<script src="/assets/models/task.js?body=1" type="text/javascript"></script>
<script src="/assets/collections/tasks.js?body=1" type="text/javascript"></script>
<script src="/assets/views/task_view.js?body=1" type="text/javascript"></script>
<script src="/assets/views/tasks.js?body=1" type="text/javascript"></script>
<script src="/assets/views/tasks_index.js?body=1" type="text/javascript"></script>
<script src="/assets/routers/tasks.js?body=1" type="text/javascript"></script>
<script src="/assets/tasks/index.js?body=1" type="text/javascript"></script>
<script src="/assets/tasks/task.js?body=1" type="text/javascript"></script>
<script src="/assets/application.js?body=1" type="text/javascript"></script>

Des idées serait génial. Merci!

  • Ce qui est sur la ligne 12 de pears_planner.js? Vous ne comprennent pas que le code, mais le message d'erreur dit que c'est l'endroit où vous problème. en fait, j'irais jusqu'à dire que c'est probablement le seul code pertinent pour cette question.
  • Désolé, que devrait dire la ligne 7 (j'ai eu quelques commentaires dans une version). Alors que ce serait le initializer: var tasks = new ExampleApp.Collections.Tasks(data.tasks);
  • Attendre, alors que l'erreur est erroné? Parce que le code que vous venez de mettre dans ce commentaire a aucune mention de PearsPlanner.initialize c'est là votre erreur semble venir de la... nous aider à vous Aider, l'homme... Poster le message d'erreur et le code, le message d'erreur fait référence.
  • Je suis désolé, oui, l'erreur a été de mal. J'ai préféré ne pas avoir le nom de mon application dans un tas d'endroits publiquement, mais j'ai manqué un. Voir mes modifications...
InformationsquelleAutor jake | 2012-11-21
  1. 80

    Uncaught TypeError: undefined n'est pas une fonction example_app.js:7

    Ce message d'erreur raconte toute l'histoire. Sur cette ligne, vous essayez d'exécuter une fonction. Cependant, tout ce qui est en cours d'exécution n'est pas une fonction! Au lieu de cela, il est undefined.

    Donc ce qui est sur example_app.js la ligne 7? Ressemble à ceci:

    var tasks = new ExampleApp.Collections.Tasks(data.tasks);

    Il n'y a qu'une seule fonction en cours d'exécution sur cette ligne. Nous avons trouvé le problème! ExampleApp.Collections.Tasks est undefined.

    Permet donc de regarder où est déclarée:

    var Tasks = Backbone.Collection.extend({
    model: Task,
    url: '/tasks'
});

    Si c'est tout le code pour cette collection, alors la cause est juste ici. Vous affectez le constructeur de variable globale, appelée Tasks. Mais vous ne vous l'ajouter à la ExampleApp.Collections objet, un lieu, plus tard, vous l'attendez.

    Changement que cela, et je parie que vous souhaitez être bon.

    ExampleApp.Collections.Tasks = Backbone.Collection.extend({
    model: Task,
    url: '/tasks'
});

    Voir comment les noms propres et les numéros de ligne sont en essayant de se faire? Jamais, jamais, jamais l'égard des erreurs binaires (cela fonctionne ou pas). Au lieu de lire l'erreur, dans la plupart des cas, le message d'erreur lui-même vous donne la critique d'indices que vous devez suivre pour trouver la vraie question.

    En Javascript, lors de l'exécution d'une fonction, il est évalué comme:

    expression.that('returns').aFunctionObject(); //js
execute -> expression.that('returns').aFunctionObject //what the JS engine does

    Que l'expression peut être complexe. Alors, quand vous voyez undefined is not a function cela signifie que l'expression ne renvoie pas à un objet de fonction. Donc, vous avez à comprendre pourquoi ce que vous essayez d'exécuter n'est pas une fonction.

    Et dans ce cas, c'est parce que vous n'avez pas mis quelque chose où vous ne l'auriez pensé.

    • Ne jamais copier le code aveuglément si vous êtes en train d'apprendre. Lire et essayer de comprendre ce que vous copiez. Si vous ne savez pas ce qu'est une chose, qu'elle le cherche. Débogage d'un programme que vous ne comprenez pas est un moyen rapide pour vous donner envie de jeter votre clavier une fenêtre.
    • en effet. Dans mon cas, cela a été causé par un aveugle copie de $.noConflict().
    • Puis-je mettre une case comme if (this.props && this.props.callBack) { this.props.callBack(); }
    InformationsquelleAutor Alex Wayne