JavaScript错误：＆QUOT;不是构造＆QUOT; [英] JavaScript error: "is not a constructor"

查看：153 发布时间：2016/7/30 15:49:42 javascript jquery debugging backbone.js underscore.js

本文介绍了JavaScript错误：＆QUOT;不是构造＆QUOT;的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我使用Backbone.js的使用jQuery和underscore.js沿

下面是我的一些code的（它没有做任何事情）。奇怪的是，在打的网址/＃用户不存在错误。错误发生的唯一的一次是当我然后点击去一个不同的哈希值，然后单击后退去/＃用户。这里是我的code的一部分，与朝端接收错误的行用户=新用户（）; 错误说用户不是构造函数：

  VAR用户= Backbone.Model.extend（{
    网址：函数（）{return'指令API /用户/ ID /'+ this.id;}
}）;VAR用户= Backbone.Collection.extend（{
    模式：用户，
    网址：函数（）{return'指令API /用户';}，
    初始化：功能（）{
    }
}）;VAR UsersView = Backbone.View.extend（{
    初始化：功能（）{
        this.users = this.options.users;
        this.render（）;
    }，    渲染：功能（）{
        _（this.users）。每个（函数（）{
        // $（'＃应用程序）追加（'这里'）;
        }）;        VAR模板= _.template（$（'＃usersTemplate）文本（））;        $（this.el）的.html（模板（{用户：this.users}））;
        $（'＃应用程序）HTML（this.el）;
    }
}）;VAR UserView = Backbone.View.extend（{
    初始化：功能（）{
        this.user = this.options.user;
        this.render（）;
    }，    渲染：功能（）{        VAR模板= _.template（你好{{user.name}}）;        $（this.el）的.html（模板（{用户：this.user.toJSON（）}））;
        $（'＃应用程序）HTML（this.el）;
    }
}）;VAR控制器= Backbone.Controller.extend（{
    路线：{
        仪表盘：仪表盘，
        用户：showusers
    }，    showuser：功能（ID）{
        UserList.fetch（{
            成功：函数（）{
                新UserView（{用户：用户}）;
            }，
            错误：函数（）{
                警报（'的各种各样的错误'）;
            }
        }）;
    }，    showusers：功能（）{
        用户=新用户（）;
        Users.fetch（{
            成功：功能（用户）{
                新UsersView（{用户：用户}）;
            }，
            错误：函数（）{
            }
        }）;
    }，    仪表板：功能（）{
        用户=新用户;
        Users.fetch（{
            成功：函数（）{
                新UsersView（{用户：用户}）;
            }，
            错误：函数（）{
            }
        }）;
    }
}）;$（文件）。就绪（函数（）{
    VAR的ApplicationController =新的控制器;
    Backbone.history.start（）;
}）;

随行的HTML，如果你很好奇：

 ＆LT;！DOCTYPE HTML＆GT;
＆LT; HTML LANG =ENGT＆;
＆LT; HEAD＆GT;
    ＆LT;间的charset =UTF-8＆GT;
    ＆LT;标题＆GT;管理面板＆LT; /标题＆GT;    ＆LT;！ - 框架 - ＆GT;
    ＆LT;脚本的src =/ JavaScript的/ jquery.min.js＆GT;＆LT; / SCRIPT＆GT;
    ＆LT;脚本的src =/ JavaScript的/ underscore.min.js＆GT;＆LT; / SCRIPT＆GT;
    ＆LT;脚本的src =/ JavaScript的/ Backbone.js的＆GT;＆LT; / SCRIPT＆GT;    ＆所述;！ - 应用 - ＆GT;
    ＆LT;脚本的src =/ JavaScript的/ application.js中＆GT;＆LT; / SCRIPT＆GT;    ＆LT;脚本ID =usersTemplate类型=文/ X-下划线模板＆GT;
        ASDF
    ＆LT; / SCRIPT＆GT;＆LT; /头＆GT;
＆LT;身体GT;＆LT; DIV＆GT;
＆LT; A HREF =＃仪表盘＆GT;仪表及LT; / A＆GT;
＆LT; A HREF =＃用户＆GT;用户＆LT; / A＆GT;
＆LT; A HREF =＃产品＆GT;产品＆LT; / A＆GT;
＆LT; A HREF =＃订单＆GT;订单＆LT; / A＆GT;
＆LT; A HREF =＃页＆GT;网页和LT; / A＆GT;
＆LT; A HREF =＃设置＆gt;设置＆LT; / A＆GT;
＆LT; / DIV＆GT;＆LT; DIV ID =应用程序＆GT;＆LT; / DIV＆GT;＆LT; /身体GT;
＆LT; / HTML＆GT;

解决方案

新只能用一个函数作为操作使用。

 新{} //错误：（{}）不是构造函数

检查用户的类型方面：它的不的时引发异常一个功能

快乐编码

警报（typeof运算（用户））应该做的伎俩。其结果应该是功能可被用作一个构造函数。注意到它是在失败的情况下什么，请参见下面的一个原因。

一个有问题的情况下（对用户=新用户）可能是：一个对象从功能构造用户然后将对象（现在不是一个函数/构造函数）被分配回用户所以接下来的新用户将去 KABOOM （看在这两个 showusers 和仪表！ - 是行为的真正的打算？）

正确的code可能是： VAR用户=新用户; users.blahblah（...）;也就是说，使用一个新的局部变量的不覆盖的全局变量的用户/属性。

在回归到#foobar只是产生错误（片段标识符）的原因没有新的页面实际加载，因此，JavaScript不是重新加载和当前的（现在的腐败用户）正在使用。 KABOOM！

片段标识符摘录：

如果目标元件位于当前文档中，用户代理可能只是关注目标元素，而无需重新加载它...

I'm using backbone.js along with jquery and underscore.js

Here's some of my code (it doesn't do anything yet). The strange thing is that upon hitting the url "/#users" there isn't an error. The only time the error happens is when I then click to go to a different hash and then click back to go to "/#users". Here's part of my code, with the line that receives the error toward the end Users = new Users(); the error says "Users is not a constructor":
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();
});
the accompanying html if you're curious:
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Administration Panel</title>

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

    
    <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>
解决方案
new can only be used with a Function as the operand.
new {}  // Error: ({}) is not a constructor
Check the type of Users in context: it is not a Function when that exception is raised.

Happy coding

alert(typeof(Users)) ought to do the trick. The result should be "function" to be usable as a constructor. Take note of what it is in the failing case, and see below for a reason.

One problematic scenario (for Users = new Users) may be: an object is constructed from the Function Users and then the object (now not a Function/constructor) is assigned back to Users so the next new Users will go kaboom! (Look in both showusers and dashboard -- is that behavior really intended?)

The 'correct' code is likely: var users = new Users; users.blahblah(...); that is, use a new local variable and do not overwrite the global Users variable/property.

The reason the error is only generated when "going back" to "#foobar" (a Fragment Identifier) is that no new page is actually loaded and thus the JavaScript is not reloaded and the current (now corrupt Users) is being used. kaboom!

Excerpt from Fragment Identifier:

If the targeted element is located in the current document, a user agent may simply focus the targeted element without having to reload it ...

这篇关于JavaScript错误：＆QUOT;不是构造＆QUOT;的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文

JavaScript错误：＆QUOT;不是构造＆QUOT; [英] JavaScript error: "is not a constructor"

问题描述

相关文章

前端开发最新文章

热门教程

热门工具

登录关闭

JavaScript错误：＆QUOT;不是构造＆QUOT; [英] JavaScript error: &quot;is not a constructor&quot;

问题描述

相关文章

前端开发最新文章

热门教程

热门工具

登录 关闭

JavaScript错误：＆QUOT;不是构造＆QUOT; [英] JavaScript error: "is not a constructor"

登录关闭