我刚开始学习模块化设计原则,我相信我不理解我的一种方法的背景。在控制台中,我得到Uncaught TypeError: Cannot read property 'val' of undefined - line 19
。我正在使用Firebase,如果这很重要的话。
这是我的代码:
(function(){
var UpdateTable = {
resources: Resources,
init: function(){
this.cacheDom();
this.render();
this.update(snapshot); // Changed this line ///
},
render: function(){
this.resources.on('value', this.update);
},
cacheDom: function(){
this.$table = $('#resourceTable');
},
update: function(snapshot){
console.log(snapshot.val());
for(var resource in this.resources){
this.$table.append('<tr><td>' + this.resources[resource].name + '</td><td>' + this.resources[resource].language + '</td></tr>');
}
}
};
UpdateTable.init();
})();
答案 0 :(得分:1)
如果你想真正实现模块化,我建议将snapshot
作为模块的参数传递。这将解决您的问题。
(function(snapshot){ // <----- Here I receive snapshot from the invoker
var UpdateTable = {
resources: Resources,
init: function(){
this.cacheDom();
this.render();
this.update(snapshot); // Changed this line ///
},
render: function(){
this.resources.on('value', this.update);
},
cacheDom: function(){
this.$table = $('#resourceTable');
},
update: function(snapshot){
console.log(snapshot.val());
for(var resource in this.resources){
this.$table.append('<tr><td>' + this.resources[resource].name + '</td><td>' + this.resources[resource].language + '</td></tr>');
}
}
};
UpdateTable.init();
})(snapshot); // <---- Here I am passing snapshot from global context to the module context
答案 1 :(得分:0)
您指定更新应该采用参数 - shapshot - 但是不能在init()中传递它。当你给函数一个参数时,它是一个隐式变量声明。
var args = 1;
function f(args) {
console.log(args);
}
f();
// => 'undefined'
相反,你想:
var args = 1;
function f() {
console.log(args); // args now looks to the outer scope
}
f();
// => 1
或
var args = 1;
function f(args) {
console.log(args);
}
f(args); // args is explicitly passed in
// => 1