Javascript方法未返回变量

Question

我对Java有点陌生。 我正在做一个工作项目，但在获取返回百分比的方法时遇到了一些麻烦。

function campaignProgress(goal, current){
    this.goal = goal;
    this.current = current; 
    this.percent =  Math.floor(current / goal  * 100);

    this.getGoal = function(){
        return goal;
    }
    this.getCurrent = function(){
        return current;
    }
    this.getPercent = function(){   
        return percent;
    }
}


var totalProgress = new campaignProgress(1.70, 1.064);

当我在html文件中调用它时，我在标题和使用的正文中引用了.js文件；

<script type="text/javascript">

        document.write(totalProgress.getGoal());

        document.write(totalProgress.getPercent());

</script>

getGoal（）方法工作正常，但getPercent（）不返回任何内容。 我可以这样引用百分比变量；

totalProgress.percent

它会很好地打印。 感谢您提供有关为何无法正常工作的任何建议。

Answer 1

您需要通过实例范围返回this ：

this.getGoal = function(){
    return this.goal;
}
this.getCurrent = function(){
    return this.current;
}
this.getPercent = function(){   
    return this.percent;
}

由于关闭了构造函数参数，因此返回了goal和current 。 但是，如果在构造函数运行后更改它们，则它们将返回错误的值。 这对于percent变量很明显。

Answer 2

您正在将变量分配为函数的属性（ this.goal ），但是在检索它们时，您尝试获取局部变量。 这应该解决它：

function campaignProgress(goal, current){
    this.goal = goal;
    this.current = current; 
    this.percent =  Math.floor(current / goal  * 100);

    this.getGoal = function(){
        return this.goal;
    }
    this.getCurrent = function(){
        return this.current;
    }
    this.getPercent = function(){   
        return this.percent;
    }
}

这里的另一个问题是您是否使用new创建此“函数类”的实例？ 否则，分配this.goal会将这些变量分配给全局范围。

var c = campaignProgress(1, 3);
console.log(c);//undefined
console.log(window.goal);//1

与

var c = new campaignProgress(1, 3)
console.log(c);//instance
console.log(window.goal);//undefined

Answer 3

看来您正在尝试模仿一个班级，那里的班级应该是“私人的”。 我想你想要：

function campaignProgress(goal, current){
    var privateGoal = goal,
        privateCurrent = current;

    this.getGoal = function(){
        return privateGoal;
    };
    this.setGoal = function(g){
        privateGoal = g;
    };
    this.getCurrent = function(){
        return privateCurrent;
    };
    this.setCurrent = function(c){
        privateCurrent = c;
    };
    this.getPercent = function(){   
        return Math.floor(privateCurrent / privateGoal  * 100);
    };
}

var tp = new campaignProgress(1.70, 1.064);
console.log(tp.getGoal(), tp.getCurrent(), tp.getPercent());
tp.setCurrent(1.111);
console.log(tp.getGoal(), tp.getCurrent(), tp.getPercent());

演示： http : //jsfiddle.net/twVNN/2/

这将导致privateGoal和privateCurrent为“私有”，这意味着无法在其范围之外访问它们。 提供的方法允许通过调用它们来进行访问。 使用this.goal = goal; 如果您要使用诸如getGoal东西，则是不必要的。 privatePercent根据privateCurrent和privateGoal的值动态计算百分比。

Answer 4

您需要使用闭包var that = this;

function campaignProgress(goal, current) {
    this.goal = goal;
    this.current = current; 
    this.percent =  Math.floor(current / goal  * 100);

    var that = this;
    this.getGoal = function() {
        return that.goal;
    }
    this.getCurrent = function(){
        return that.current;
    }
    this.getPercent = function(){   
        return that.percent;
    }
}


var totalProgress = new campaignProgress(1.70, 1.064);
console.log(totalProgress.getGoal());
console.log(totalProgress.getPercent());

这始终是function（）中的值，如果您在何处调用this.goal（如上所述），则与简单地调用目标相同

Answer 5

目标之所以有效，是因为目标是在每个函数的闭包（传递给函数的目标参数）中定义的。 其他的则无效，因为未使用关键字关键字this来引用它们（这与某些语言几乎没有选择性）。 不幸的是，由于它的工作方式，我们不能简单地将其添加到每个子函数的return语句中（由于我们不使用原型，因此其值可能会根据所处的位置而变化。从调用这些函数）。 因此，以粗体使用更改。

function campaignProgress(goal, current){
    var self = this;
    this.goal = goal;
    this.current = current; 
    this.percent =  Math.floor(current / goal  * 100);

    this.getGoal = function(){
        return self.goal;
    }
    this.getCurrent = function(){
        return self.current;
    }
    this.getPercent = function(){   
        return self.percent;
    }
}

通过使用self变量，当我们第一次调用该函数，然后对其进行操作时，我们便捕获了我们想要的值。