我的代码一直告诉我我创建的对象未定义。
我正在加载几个 JS 文件然后调用函数但它出错了
错误:
Uncaught TypeError: Cannot read property 'setListenUrl' of undefined
代码如下:
<script src="{{ URL::asset('javascript/chat.js') }}"></script>
<script>
$(function() {
chatbox.setListenUrl('{{ URL::route('chat.listen') }}');
chatbox.setSendURL('{{ URL::route('chat.send') }}');
@if(Auth::check())
chatbox.setAuth(true);
@endif
@if(isset($game))
chatbox.setGame('{{ $game }}');
@endif
chatbox.init();
});
</script>
聊天.js
var chatbox = {
...
}
完整脚本代码 http://pastebin.com/7LhWq01U
最佳答案
您正在使用 chatbox
在您分配给 chatbox
的对象字面量中,这不起作用,因为聊天框尚未定义。
那个 Uncaught Error 使得你的整个 chat.js
的执行脚本停止,这就是为什么 chatbox
也是undefined
在以下脚本中。
因此,从 chat.js
的第 17 行开始, 你必须找到一种方法来引用 $chatbox
在你的对象的多个地方。
当您想在对象字面量中引用先前定义的属性时,这是 JavaScript 中的常见问题。
但问题是你不能,所以现在最快的解决办法是声明一个 $chatbox
。对象外部的变量并从内部引用它。
既然左右声明全局变量肯定是不好的做法,这个问题可以通过以下两种方式更好地解决:
构造函数
您创建一个 constructor function然后使用关键字 new
创建对象的实例.这提供了对象初始化代码的封装,并允许您在需要时轻松创建多个聊天框对象。
function Chatbox() {
var $chatbox = $('.chatbox');
this.$chatbox = $chatbox;
this.$input = $chatbox.find('.input input');
//...
}
var chatbox = new Chatbox();
如果您知道您的对象不会有多个实例,那么构造函数模式不会提供太多,可能只是额外的语法负担,因此您可以使用更轻的封装技术:
立即调用的函数表达式(IIFE)
您将所有对象初始化代码放在一个匿名函数中,该函数在最后返回对象,并在变量声明语句中调用该函数,该语句还封装了您在初始化对象时需要声明的任何变量。
var chatbox = (function() {
var $chatbox = $('.chatbox');
return {
$chatbox: $chatbox,
$input: $chatbox.find('.input input'),
// ^ This references the outer $chatbox variable, not this
// object's $chatbox property.
};
})();
关于Javascript 对象未定义,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34701426/