JavaScript ES5 模拟实现“继承”

本文尝试用JavaScript（ES 5）模拟实现，面向对象语言中的“继承”机制。

继承/覆写父类的方法，追加子类自身特有的方法，一个都不少。

Input模拟“父类”

先用js中的一等公民function仿写一个Input类。

function Input(maxlen) {
	var value = "";
	this.getMaxLen = function() {
		return maxlen;
	}
	this.value = function(v) {
		if(v == undefined) {
			return value;
		} else {
			value = v;
		}
	}
	return this;
}

这个Input类能够指定最大输入长度，能够通过value()方法存/取内部的值。

NumberInput模拟“子类”

function NumberInput(min, max, maxlen) {
	var base = Input(maxlen);
	// “继承”了Input中的getMaxLen()方法
    
    // 追加子类自身的方法getMin()
	base.getMin = function() {
		return min;
	}
    // 追加子类自身的方法getMax()
	base.getMax = function() {
		return max;
	}
    
	// 要覆写value()方法之前，留存父类的value()方法
    // 便于需要的时候调用。
	var _supperValue = base.value;
	base.value = function(v) {
		if(typeof v === 'number') {
			_supperValue(v);
		} else {
			var v = _supperValue()||'0';
			return parseInt(v);
		}
	}
	return base;
}

NumberInput“子类”，不光实现了自己特有的getMin()/getMax()方法，还继承了父类的getMaxLen()方法，并且覆写了父类的value()方法。这不就是实现了面向对象语言中的继承么！

验证代码

var x = NumberInput(1, 100, 10);
x.getMaxLen();//10
x.getMin();//1
x.getMax();//100
x.value();//0
x.value(88);
x.value();//88