在比较正常功能和即时功能时,我对范围感到困惑。 这是一个例子:
var num=5;
var x=3;
doubleNum = function(){
num = num*x
x++;
return num;
};
console.log(doubleNum());//15
console.log(doubleNum());//60
console.log(doubleNum());//300
这是一个普通函数,num和x是全局定义的,可由doubleNum访问,因此更新了num和x。
var num=5;
var x=3;
doubleNum = function(){
num = num*x
x++;
return num;
}();
console.log(doubleNum);//15
console.log(doubleNum);//15
console.log(doubleNum);//15
但是,如果我定义一个立即函数并以同样的方式调用它,我会得到不同的答案。即使我希望有相同的输出 我错过了必要的东西吗?或者我理解了一些错误的概念? 请帮忙。 提前致谢。 Jsfiddle
答案 0 :(得分:5)
因为doubleNum
不是对函数的引用,而是保留匿名函数调用的结果。
在第一种情况下,您为doubleNum
分配了一个函数,并且每次通过doubleNum()
调用它时,您都会更改其中的超出范围变量并返回num
。你这样做3
次。您的代码等同于
var num=5;
var x=3;
doubleNum = function(){
num = num*x; // Every call will affect the outscoped num
x++; // Every call will affect the outscoped x
return num;
};
var val = doubleNum(); // Call changes the values and returs a new result
console.log(val);
val = doubleNum(); // Call changes the values and returs a new result
console.log(val);
val = doubleNum(); // Call changes the values and returs a new result
console.log(val);
在第二种情况下,您为doubleNum
分配单一呼叫匿名功能的结果。函数值已经计算过一次,并将结果分配给doubleNum
。您的代码等同于
var num=5;
var x=3;
var doubleNum;
var myFunction = function(){
num = num*x;
x++;
return num;
};
doubleNum = myFunction(); // Only one call
console.log(doubleNum);
console.log(doubleNum);
console.log(doubleNum);
答案 1 :(得分:0)
我是否错过了必要的东西?
仅在第二种情况中,doubleNum
的值已经计算,因为函数在定义后立即被调用。
另一方面,在第一种情况下,只有function
定义被分配给doubleNum
而不是它的调用结果。
答案 2 :(得分:0)
立即函数调用仅被评估一次。您正在为doubleNum分配一个值而不是立即函数。要达到类似的效果,请尝试使用类和getter。
class ClassName {
constructor(){
this.num = 5;
this.x = 3;
}
get doubleNum() {
this.num = this.num*this.x++;
return this.num;
}
}
var double = new ClassName();
console.log(double.doubleNum);//15
console.log(double.doubleNum);//30
console.log(double.doubleNum);//300