全球变量应该避免吗？ [英] Should global variables be avoided?

问题描述

学习Javascript并对全局变量提出疑问。从我的阅读中，大多数人建议不要使用它们。但是，在基于类的javascripting中，这个不成文的规则是否仍适用？例如：

Learning Javascript and have a question about global variables. From my reading, most recommend not to use them. However, in class based javascripting, does this unwritten rule still apply? For instance:

var width = 0;
var height = 0;

<!-- constructor -->
function Rectangle(){}

<!-- getters/setters -->
Rectangle.prototype.getWidth = function(){
    return width;   
}

Rectangle.prototype.setWidth = function(w){
    width = w;  
}

Rectangle.prototype.getHeight = function(){
    return height;  
}

Rectangle.prototype.setHeight = function(h){
    height = h; 
}

<!-- methods -->
Rectangle.prototype.area = function(){
    return height * width;  
}

var myRect = new Rectangle();
myRect.setWidth(5);
myRect.setHeight(4);
console.log(myRect.area()); //20
console.log(myRect.getWidth()); //5
myRect.setWidth(10);
console.log(myRect.getWidth()); //10
console.log(myRect.area()); //40

我熟悉Java以及为类，属性和类使用访问修饰符的能力方法。是因为Javascript中不存在访问修饰符，应避免使用全局变量吗？

I'm familiar with Java and the ability to use access modifiers for classes, properties and methods. Is it because access modifiers do not exist in Javascript that globals should be avoided?

推荐答案

您可能会使用此代码

You would probably use this code instead

<!-- constructor -->
var Rectangle = function(w, h) {
    this.width = w || 0;
    this.height = h || 0;
}

<!-- getters/setters -->
Rectangle.prototype.getWidth  = function( ) { return this.width;  }
Rectangle.prototype.setWidth  = function(w) { this.width = w;    }
Rectangle.prototype.getHeight = function()  { return this.height;      }
Rectangle.prototype.setHeight = function(h) { this.height = h;    }

<!-- methods -->
Rectangle.prototype.area = function(){
    return this.height * this.width;  
}

var myRect = new Rectangle(5, 4);
console.log(myRect.area()); //20
console.log(myRect.getWidth()); //5
myRect.setWidth(10);

1. 宽度和高度应为 this.width 和 this.height ，否则您将修改全局宽度和高度变量，这些值不会绑定到Rectangle的单个实例。


2. 最好使用函数表达式而不是构造函数的函数声明： var Rectangle = function（w，h）{...} 而不是函数Rectangle（）{...} 。


3. 你也可以将所有代码包装在一个立即自行执行的内容中函数，以完全避免全局命名空间污染（看看jAndy答案）


4. 对象的初始宽度和高度可以在构造函数中传递进行初始化（否则宽度和高度设置为0 - 或其他任何值 - 默认情况下。）


5. 这些规则绝对是写的（参见 Javascript：D.Crockford的好部分）。

1. width and height should be this.width and this.height, otherwise you will modify the global width and height variables and those values won't be tied to the single instance of Rectangle.
2. it's better use a function expression than a function declaration for the constructor function: var Rectangle = function(w, h) { ... } rather than function Rectangle() { ... }.
3. You can also wrap all code inside an immediately self executed function so to completely avoid the global namespace pollution (look at jAndy answer)
4. Initial width and height of your object can be passed in the constructor function for initialization (otherwise width and height are set to 0 - or other any value - by default).
5. These rule are definitely written (see for reference Javascript : the good parts by D.Crockford).

这篇关于全球变量应该避免吗？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！