"未捕获类型错误:未定义不是一个函数" - 初级应用Backbone.js的 [英] "Uncaught TypeError: undefined is not a function" - Beginner Backbone.js Application

查看:150
本文介绍了"未捕获类型错误:未定义不是一个函数" - 初级应用Backbone.js的的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我设置了​​骨干pretty简单的应用程序,而我得到一个错误。

 未捕获类型错误:未定义不是一个函数example_app.js:7
ExampleApp.initialize example_app.js:7
(匿名函数)

这是那里的错误显示Chrome检查(init文件 - example_app.js)了:

  VAR ExampleApp中= {
  楷模: {},
  类别:{},
  浏览次数:{},
  路由器:{},
  初始化:功能(){
    VAR任务=新ExampleApp.Collections.Tasks(data.tasks);
    新ExampleApp.Routers.Tasks({任务:任务});
    Backbone.history.start();
  }
};

这是我的任务index.haml文件

   -  content_for:JavaScript的做
   - javascript_tag做
    ExampleApp.initialize({任务:#{生@ tasks.to_json}});=收益率:JavaScript的

模型/ task.js

  VAR任务= Backbone.Model.extend({});

集合/ tasks.js

  VAR任务= Backbone.Collection.extend({
    型号:任务,
    网址:'/任务
});

路由器/ tasks.js

  ExampleApp.Routers.Tasks = Backbone.Router.extend({
    路线:{
        :指数
    },    指数:功能(){
        警报('测试');
        // VAR视图=新ExampleApp.Views.TaskIndex({集合:ExampleApp.tasks});
        // $('身体')HTML(view.render()$ EL)。
    }
});

而这里的证明,我打电话的所有文件(我认为)的:

 <脚本的src =/资产/ jquery.js和身体= 1?类型=文/ JavaScript的>< / SCRIPT>
<脚本的src =/资产/ jquery_ujs.js体= 1?类型=文/ JavaScript的>< / SCRIPT>
<脚本的src =/资产/ jQuery的-ui.js体= 1?类型=文/ JavaScript的>< / SCRIPT>
<脚本的src =/资产/ underscore.js体= 1?类型=文/ JavaScript的>< / SCRIPT>
<脚本的src =/资产/ Backbone.js的身体= 1?类型=文/ JavaScript的>< / SCRIPT>
<脚本的src =/资产/骨干支撑/ support.js体= 1?类型=文/ JavaScript的>< / SCRIPT>
<脚本的src =/资产/骨干支撑/ composite_view.js体= 1?类型=文/ JavaScript的>< / SCRIPT>
<脚本的src =/资产/骨干支撑/ swapping_router.js体= 1?类型=文/ JavaScript的>< / SCRIPT>
<脚本的src =/资产/骨干网support.js体= 1?类型=文/ JavaScript的>< / SCRIPT>
<脚本的src =/资产/ example_app.js体= 1?类型=文/ JavaScript的>< / SCRIPT>
<脚本的src =/资产/ easing.js体= 1?类型=文/ JavaScript的>< / SCRIPT>
<脚本的src =/资产/ modernizr.js体= 1?类型=文/ JavaScript的>< / SCRIPT>
<脚本的src =/资产/模型/ task.js体= 1?类型=文/ JavaScript的>< / SCRIPT>
<脚本的src =/资产/收藏/ tasks.js体= 1?类型=文/ JavaScript的>< / SCRIPT>
<脚本的src =/资产/视图/ task_view.js体= 1?类型=文/ JavaScript的>< / SCRIPT>
<脚本的src =/资产/视图/ tasks.js体= 1?类型=文/ JavaScript的>< / SCRIPT>
<脚本的src =/资产/视图/ tasks_index.js体= 1?类型=文/ JavaScript的>< / SCRIPT>
<脚本的src =/资产/路由器/ tasks.js体= 1?类型=文/ JavaScript的>< / SCRIPT>
<脚本的src =/资产/任务/ index.js体= 1?类型=文/ JavaScript的>< / SCRIPT>
<脚本的src =/资产/任务/ task.js体= 1?类型=文/ JavaScript的>< / SCRIPT>
<脚本的src =/资产/ application.js中体= 1?类型=文/ JavaScript的>< / SCRIPT>

任何想法将是巨大的。谢谢!


解决方案

  

未捕获类型错误:未定义不是一个函数example_app.js:7


此错误消息道出了原委。在这一行,您要执行的功能。然而,无论是正在执行的是不是一个功能!相反,它是未定义

那么,什么是对 example_app.js 7号线?看起来是这样的:

  VAR任务=新ExampleApp.Collections.Tasks(data.tasks);

有只有一个正在上线运行的功能。我们发现的问题! ExampleApp.Collections.Tasks 未定义

所以,让我们看看一个声明,其中:

  VAR任务= Backbone.Collection.extend({
    型号:任务,
    网址:'/任务
});

如果这是所有code此集合,然后根本原因就在这里。您指定的构造函数中的全局变量,名为任务。但是你从来没有把它添加到 ExampleApp.Collections 的对象,以后你希望它是一个地方。

更改了这一点,而且我敢打赌,你会很不错的。

  ExampleApp.Collections.Tasks = Backbone.Collection.extend({
    型号:任务,
    网址:'/任务
});

请参阅多么重要的正确名称和行号都搞清楚了这一点?永远不要把错误的二进制(它工作,或者没有)。相反,读取错误,在大多数情况下,错误消息本身给你你需要跟踪通过找到真正的问题关键线索。


在Javascript中,当你执行一个功能,它的评估,如:

 前pression.that('回报')aFunctionObject()。 // JS
执行 - >前pression.that('回报')。aFunctionObject // JS引擎做什么

这前pression可能很复杂。所以当你看到不确定是不是一个函数这意味着前pression未返回函数对象。所以,你必须弄清楚为什么你正在尝试执行不是一个函数。

在这种情况下,那是因为你没有把东西,你以为你做到了。

I'm setting up a pretty simple app with backbone, and I'm getting an error.

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

This is where the error is showing up in Chrome Inspector (init file - 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();
  }
};

Here's my tasks index.haml file

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

= yield :javascript

models / task.js

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

collections / tasks.js

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

routers / 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);
    }
});

And here's proof that I'm calling all of the files (I think):

<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>

Any ideas would be great. Thanks!

解决方案

Uncaught TypeError: undefined is not a function example_app.js:7

This error message tells the whole story. On this line, you are trying to execute a function. However, whatever is being executed is not a function! Instead, it's undefined.

So what's on example_app.js line 7? Looks like this:

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

There is only one function being run on that line. We found the problem! ExampleApp.Collections.Tasks is undefined.

So lets look at where that is declared:

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

If that's all the code for this collection, then the root cause is right here. You assign the constructor to global variable, called Tasks. But you never add it to the ExampleApp.Collections object, a place you later expect it to be.

Change that to this, and I bet you'd be good.

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

See how important the proper names and line numbers are in figuring this out? Never ever regard errors as binary (it works or it doesn't). Instead read the error, in most cases the error message itself gives you the critical clues you need to trace through to find the real issue.


In Javascript, when you execute a function, it's evaluated like:

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

That expression can be complex. So when you see undefined is not a function it means that expression did not return a function object. So you have to figure out why what you are trying to execute isn't a function.

And in this case, it was because you didn't put something where you thought you did.

这篇关于&QUOT;未捕获类型错误:未定义不是一个函数&QUOT; - 初级应用Backbone.js的的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆