Javascript模块模式:在嵌套函数中调用函数

时间:2013-05-16 17:40:47

标签: javascript jquery function

我有这样的代码:

var SEVERINU = SEVERINU || {};

SEVERINU.AutoGallery = {
    galleryImagesNames: new Array(),

    findImages: function () {
        var dirToResearch = this.galleryName;

        $.post(
            "_php/get-files.php", {
            dir: dirToResearch,
            ext: this.fileExtension
        }, function (data) {
            var pliki = $.parseJSON(data);
            console.log(data);
            for (var i in pliki) {
                this.galleryImagesNames.push(pliki[i]); // problem !
            }
        });

    },
}

这一行:this.galleryImagesNames.push(pliki[i]);给了我一些问题。

它说他找不到var galleryImagesNames等。

如果我要“深入”,如何调用函数var?

4 个答案:

答案 0 :(得分:3)

只需将当前this保存到其他变量中,这样就不会在函数内部被覆盖。

var SEVERINU = SEVERINU || {};

SEVERINU.AutoGallery = {
  galleryImagesNames : new Array(),

  findImages : function(){
        var self = this; // keep current value of this in variable named self
        var dirToResearch = this.galleryName;

        $.post(
            "_php/get-files.php",
            {
                dir: dirToResearch,
                ext: this.fileExtension
            },
            function(data){
                var pliki = $.parseJSON(data);
                console.log(data);
                for(var i in pliki){
                    // call the method using self variable instead of this that got overwritten
                    self.galleryImagesNames.push(pliki[i]); 
                }
            }
        );

    },

}

答案 1 :(得分:1)

实际上是因为你的$.post的范围与对象的其他部分不同。试试这个:

findImages : function(){
    var dirToResearch = this.galleryName;
    var gImageNames = this.galleryImagesNames;
    $.post(
        "_php/get-files.php",
        {
            dir: dirToResearch,
            ext: this.fileExtension
        },
        function(data){
            var pliki = $.parseJSON(data);
            console.log(data);
            for(var i in pliki){
                gImageNames.push(pliki[i]); // we have access to this variable
            }
        }
    );

},

答案 2 :(得分:1)

由于您在匿名函数中,因此您必须再次引用this关键字。或直接使用它:

SEVERINU.AutoGallery.galleryImagesNames.push(pliki[i]);

通常,当您需要多次引用SEVERINU.AutoGallery时,最好将其存储在以下变量中:

var that = SEVERINU.AutoGallery; // or "self" or something you prefer

for (var i in pliki) {
    that.galleryImagesNames.push(pliki[i]);
}

原因是因为访问对象命名空间时javascript往往很慢。你走的越深越慢。您创建的引用越多,它就越慢,因为必须首先解析函数作用域才能访问下一个/上一个作用域。

答案 3 :(得分:1)

您还可以使用$.proxy传递上下文。

var SEVERINU = SEVERINU || {};

SEVERINU.AutoGallery = {
 galleryImagesNames : new Array(),

 findImages : function(){
    var dirToResearch = this.galleryName;

    $.post(
        "_php/get-files.php",
        {
            dir: dirToResearch,
            ext: this.fileExtension
        },
        $.proxy(function(data){ //Set up for the context to be passes for this function.
            var pliki = $.parseJSON(data);
            console.log(data);
            for(var i in pliki){
                this.galleryImagesNames.push(pliki[i]); // problem solved. now this doesn't refer to ajax context
            }
        },this) <-- Pass the context here
    );

},
}
  

$ .sages获取一个函数并返回一个始终具有特定上下文的新函数。