Javascript 方法不返回变量

Javascript method is not returning a variable

本文关键字：变量 返回 方法 Javascript      更新时间：2023-09-26

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

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

它会打印正常。关于为什么这不起作用的任何建议将不胜感激，谢谢。

您需要

返回实例的作用域this：

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

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

看起来你正在尝试模仿一个类，其中，那些应该是"私有的"。我想你会想要：

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是"私有"的，这意味着无法在其范围之外访问它们。提供的方法允许通过调用它们来访问。如果您要使用类似 getGoal 的东西，则无需使用 this.goal = goal; .privatePercent根据 privateCurrent 和 privateGoal 的值动态计算百分比。

你正在将变量赋值为函数的属性(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

你需要使用闭包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());

这始终是函数((中的值，如果你在哪里调用this.goal(如上所述(，这与简单地调用目标相同

Goal 之所以有效，是因为 goal 在每个函数的闭包(传递给函数的目标参数(中定义。其他的不起作用，因为它们没有被引用，他们关键字这个(这不像某些语言那样可选(。不幸的是，由于它的工作方式，我们不能简单地将其添加到每个子函数的 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 变量，我们在第一次调用函数时捕获我们希望的值，然后对其进行操作。

相关文章：