在JS中实现静态变量/函数

静态变量/方法

静态变量/方法,一般来说是独立於对象的存在,它不属於任何一个具体的对象,它属於每一特定类的所有对象。也可以认为是属於一个类的。静态变量一般用於常数,或者存储某一类的所有对象需要共有的变量。
学JS的时候发现,与JAVA,C++相比,JS并没有明确定义静态的声明或使用方法。虽然没有说,但仍然需要,比如一个很经典的需要就时用静态变量统计一个类被实例化了几次。

静态变量的实现

因为 Function 本身也可以看作是对象,那么就可以尝试给这个对象添加一个常量。例如:

1
2
3
4
function A() {

}
A.count = 0;

那这个 count 变量就可以看作是专属於 A 的一个变量,而不属於任何一个 A 的对象。比如var a = new A(); console.log(a.count);,此时浏览器的控制台就很清楚地说,对於 a 来说 count 属於 undefined。
变量定义好了,接着就时如何实现每一次实例化 count 就会自动加 1 的操作了。如果要每一次实例化的时候 count 加一,就相当於每一次执行函数 A 的时候就要执行 count++; 的操作。所以可以将语句放在函数里:

1
2
3
4
5
function A() {
A.count ++;
// count ++;
}
A.count = 0;

注意注释掉的语句,因为如果没有指定 A, 也没有使用 var 声明 count, 那麽JS 会把这个 count 当作是全局变量,很有可能发生由於undefined引起的错误。
现在可以测试一下效果了:

1
2
3
4
5
6
7
8
9
A.count = 0;
function A() {
A.count ++;
}

var a = new A();
var a = new A();
var a = new A();
console.log(A.count);

在浏览器里运行可以发现,控制台正确的输出了结果3.
顺便一提的是,A.count = 0;这条语句既可以写在 function A的定义之前,也可以写在其函数定义之後。因为 JS 有 Hoisting 机制 (可以参考 Here)。函数的声明会被自动调到顶端,因此不必过分纠结写在函数定义前或定义之後的问题。

静态方法的实现

其实知道了JS中静态变量的实现,那麽实现静态方法也是很简单的事了。根据同样的方法,向函数 A 添加一个方法即可:

1
2
3
4
5
6
7
8
9
function A() {
}
A.sayho = function() {
console.log("Ho!");
}

A.sayho();
var a = new A();
a.sayho();

此时,也就可以看见控制台输出了一句 “Ho!”。同样,因为这属于静态方法,不属于任何一个具体的实例,因此对于实例化的变量 a 来说,sayho() 方法是未定义的,会报出一个 a.sayho is not a function的错误。