我'我尝试将模块模式与构造函数结合起来,但似乎我是'我看着什么。 实例化两个对象并显示它们的属性后,实例var'似乎引用了同一个对象。
这是我放在一起的一个小例子。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>test</title>
<script type="text/javascript">
var guidUtils = {
/* Generates a simple UUID/GUID based on some randomisation.
*
*/
guidGenerator:function () {
var S4 = function () {
return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
};
return (S4() + S4() + "-" + S4() + "-" + S4() + "-" + S4() + "-" + S4() + S4() + S4());
}
};
var Car = (function () {
// private variables and functions
var thiz;
var ID = 'bar';
var model;
var setID = function(id){
ID = id;
};
var getID = function(){
return ID;
};
var setModel = function(pModel){
model = pModel;
};
var getModel = function(){
return model;
};
// constructor
var Car = function (pModel) {
thiz=this;
ID = guidUtils.guidGenerator();
model = pModel;
init();
};
//intialisation
function init(){
}
// prototype
Car.prototype = {
constructor: Car,
getID: getID,
getModel: getModel
};
// return Car
return Car;
})();
function show() {
var car1 = new Car("audi");
var car2 = new Car("BMW");
var car1div = document.getElementById("car1");
var car2div = document.getElementById("car2");
car1div.innerHTML=car1.getID()+" is a "+car1.getModel();
car2div.innerHTML=car2.getID()+" is a "+car2.getModel();
}
</script>
</head
<body>
<a onclick="show()" href="javascript:void(0);">show</a>
<div id="car1"></div>
<div id="car2"></div>
</body>
</html>
结果是:
有些人可以解释我到底在哪里吗?做出错误的假设?
答案 0 :(得分:3)
var thiz;
etc...
// constructor
var Car = function (pModel) {
thiz=this;
etc...
是问题所在。这会创建一种静态变量,由类的所有实例共享。所有实例方法和属性都必须绑定到原型this
。例如:
var Car = function (pModel) {
this.ID = guidUtils.guidGenerator();
this.model = pModel;
this.init();
};
// Removed: "var setID = " Instead, bind it to the prototype:
Car.prototype.setId = function(id){
this.ID = id;
};
另见: