"Uncaught TypeError : undefined가 함수가 아닙니다."- Beginner Backbone.js Application

Question

백본으로 아주 간단한 앱을 설정 중이며 오류가 발생합니다.

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

이 오류가 크롬 Inspector에서 (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(); 
    } 
}; 

내 작업 파일 index.haml 것

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

= yield :javascript 

모델/과제 .js

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

col lections/tasks.js

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

라우터/

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

을 tasks.js 그리고 여기에 내가 모든 파일을 호출하고있어 증거이다 (나는 생각한다) :

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

어떤 아이디어 잘 될 것입니다. 감사!

Answer 1

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

이 오류 메시지는 전체적인 이야기입니다. 이 줄에서 함수를 실행하려고합니다. 그러나 실행되는 모든 것은 기능이 아닙니다! 대신 undefined입니다.

그래서 example_app.js 라인 7에 있습니까? 다음과 같이 표시됩니다.

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

해당 행에서 실행되는 함수는 하나뿐입니다. 우리는 그 문제를 발견했다! ExampleApp.Collections.Tasks은 undefined입니다. 즉,이 컬렉션의 모든 코드가 있다면, 그 근본 원인은 바로 여기

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

:

는 그래서이 선언되는 위치에서보기를 할 수 있습니다. Tasks이라는 전역 변수에 생성자를 할당합니다. 그러나 당신은 그것을 나중에 ExampleApp.Collections 객체에 추가하지 마십시오. 나중에 그 객체를 기대합니다.

이렇게 변경하면 좋을 것입니다.

올바른 이름과 줄 번호가 무엇인지 파악하는 것이 중요합니다. 오류를 바이너리로 간주하지 마십시오 (작동하는지 또는 작동하지 않는지). 대신 오류 메시지를 읽으면 대부분의 경우 오류 메시지 자체가 실제 문제를 찾기 위해 추적해야하는 중요한 단서를 제공합니다. 표현이 복잡 할 수

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

:이 기능을 실행하면 자바 스크립트에서

---

,이 같은 평가입니다. 따라서 undefined is not a function을 보면 표현식이 함수 객체를 반환하지 않았다는 의미입니다. 그래서 당신이 실행하려고하는 것이 왜 기능이 아닌지를 알아 내야 만합니다.

그리고이 경우에는 당신이 생각한 곳에 뭔가 넣지 않았기 때문입니다.