Question

这是我第一次为JS创建OOP。我遵循了一些教程，但我无法解决这个问题。我知道这个问题，但我不知道解决方案

function NewApp(name){
    this.name = name;
    this.currentPage = 1;
    this.customObjectWithMethods = //init with options and so on
}

NewApp.prototype.logic = function(){
// Note 1.  
    var app = this
    //Note 3.
    this.customObjectWithMethods.method{
        if(app.currentpage < 3)
            // Note 2.  
            app.navigate(app.logic)
    }
}

NewApp.prototype.navigate = function(sender){
    var app = this;
    this.customObjectWithMethods.method{
        app.currentpage++;
        this.method(function() {
            return app.currentPage === 2;
        }, sender(), this.terminate);
    } 
}

注1：我需要创建一个引用，因为在此之后，this没有继续工作以引用当前对象。
注2：检查后我想在另一个方法中执行一些逻辑并重复当前函数，但是当该函数再次运行时它会中断方法（this.customObjectWithMethods），因为this不存在。
注3：这是它破坏的地方因为＆＃34;这个＆＃34;第一次不是第二次工作。

使用this - 关键字会变得非常复杂，这让我觉得我的设计可能存在缺陷。

这个问题有什么解决方案，还是我应该重构一下？

Answer 1

一些语法错误＆amp;风格问题 - 这是一个简短的修正

var myFunction = function(){
    //code here
};

var mySecondFunction = function(){
    //code here
};

function NewApp(name){
this.name = name;
this.currentPage = 1;
this.customObjectWithMethods = function(){}; //empty function so calling doesnt resolve in error

}

NewApp.prototype.logic = function(){

   this.customObjectWithMethods.method = mySecondFunction.bind(this);
}

NewApp.prototype.navigate = function(sender){

    this.customObjectWithMethods.method = myFunction.bind(this);

}

我已将2个函数移到构造函数Function之外，因此每次调用构造函数时都不会重新创建它们。

使用_.bind（this）将“this”-reference传递到函数的范围内（我认为这比创建另一个var更漂亮）。

与

var reff = new NewApp('namename');

您现在就可以开始调用您的函数了：

ref.logic();

也许这种方法适合你？

Answer 2

肯定会变得复杂，this关键字并不总是引用主要对象，而是引用它的范围，请查看Scope and this in JavaScript以获取更多信息。

这是你的方法，制作一个包含你的构造函数的变量，并将这两个方法添加到这个变量中，之后你可以调用你的函数：

var newApp = function newApp(name){
    this.name = name;
    this.currentPage = 1;

    //Make a reference to your object here
    var THIS = this;

    this.logic = function(){ 
        var sender = this;

        THIS.customObjectWithMethods.method = function(){
            if(THIS.currentpage < 3) 
                THIS.navigate(sender);
        }
    }

    this.navigate = function(sender){
        this.customObjectWithMethods.method = function(){
            THIS.currentpage++;
            this.method(function() {
                return THIS.currentPage === 2;
            }, sender(), this.terminate);
        } 
    }    

}

这是如何使用构造函数及其方法：

var app = newApp("Test");

//Call the first method
app.customObjectWithMethods();

//Thenn call the second one
app.logic();

从另一个上下文调用方法时，`this`是未定义的

2 个答案: