JS 面向对象之神奇的prototype(2)


<script>
function classA()
{
this.a = 100;
this.b = 200;
this.c = 300;

this.reset = function()
{
for(var each in this)
{
delete this[each];
}
}
}
classA.prototype = new classA();

var a = new classA();
alert(a.a);
a.a *= 2;
a.b *= 2;
a.c *= 2;
alert(a.a);
alert(a.b);
alert(a.c);
a.reset(); //调用reset方法将a的值恢复为默认值
alert(a.a);
alert(a.b);
alert(a.c);
</script>


利用prototype还可以为对象的属性设置一个只读的getter,从而避免它被改写。下面是一个例子:

复制代码 代码如下:


<script>
function Point(x, y)
{
if(x) this.x = x;
if(y) this.y = y;
}
Point.prototype.x = 0;
Point.prototype.y = 0;

function LineSegment(p1, p2)
{
//私有成员
var m_firstPoint = p1;
var m_lastPoint = p2;
var m_width = {
valueOf : function(){return Math.abs(p1.x - p2.x)},
toString : function(){return Math.abs(p1.x - p2.x)}
}
var m_height = {
valueOf : function(){return Math.abs(p1.y - p2.y)},
toString : function(){return Math.abs(p1.y - p2.y)}
}
//getter
this.getFirstPoint = function()
{
return m_firstPoint;
}
this.getLastPoint = function()
{
return m_lastPoint;
}

this.length = {
valueOf : function(){return Math.sqrt(m_width*m_width + m_height*m_height)},
toString : function(){return Math.sqrt(m_width*m_width + m_height*m_height)}
}
}
var p1 = new Point;
var p2 = new Point(2,3);
var line1 = new LineSegment(p1, p2);
var lp = line1.getFirstPoint();
lp.x = 100; //不小心改写了lp的值,破坏了lp的原始值而且不可恢复
alert(line1.getFirstPoint().x);
alert(line1.length); //就连line1.lenght都发生了改变
</script>


将this.getFirstPoint()改写为下面这个样子:

复制代码 代码如下:


this.getFirstPoint = function()
{
function GETTER(){};
GETTER.prototype = m_firstPoint;
return new GETTER();
}


则可以避免这个问题,保证了m_firstPoint属性的只读性。

复制代码 代码如下:


<script>
function Point(x, y)
{
if(x) this.x = x;
if(y) this.y = y;
}
Point.prototype.x = 0;
Point.prototype.y = 0;

function LineSegment(p1, p2)
{
//私有成员
var m_firstPoint = p1;
var m_lastPoint = p2;
var m_width = {
valueOf : function(){return Math.abs(p1.x - p2.x)},
toString : function(){return Math.abs(p1.x - p2.x)}
}
var m_height = {
valueOf : function(){return Math.abs(p1.y - p2.y)},
toString : function(){return Math.abs(p1.y - p2.y)}
}
//getter
this.getFirstPoint = function()
{
function GETTER(){};
GETTER.prototype = m_firstPoint;
return new GETTER();
}
this.getLastPoint = function()
{
function GETTER(){};
GETTER.prototype = m_lastPoint;
return new GETTER();
}

this.length = {
valueOf : function(){return Math.sqrt(m_width*m_width + m_height*m_height)},
toString : function(){return Math.sqrt(m_width*m_width + m_height*m_height)}
}
}
var p1 = new Point;
var p2 = new Point(2,3);
var line1 = new LineSegment(p1, p2);
var lp = line1.getFirstPoint();
lp.x = 100; //不小心改写了lp的值,但是没有破坏原始的值
alert(line1.getFirstPoint().x);
alert(line1.length); //line1.lenght不发生改变
</script>


实际上,将一个对象设置为一个类型的原型,相当于通过实例化这个类型,为对象建立只读副本,在任何时候对副本进行改变,都不会影响到原始对象,而对原始对象进行改变,则会影响到副本,除非被改变的属性已经被副本自己的同名属性覆盖。用delete操作将对象自己的同名属性删除,则可以恢复原型属性的可见性。下面再举一个例子:

复制代码 代码如下:


<script>
function Polygon()
{
var m_points = [];

m_points = Array.apply(m_points, arguments);

function GETTER(){};
GETTER.prototype = m_points[0];
this.firstPoint = new GETTER();

this.length = {
valueOf : function(){return m_points.length},
toString : function(){return m_points.length}
}

this.add = function(){
m_points.push.apply(m_points, arguments);
}

this.getPoint = function(idx)
{
return m_points[idx];
}

this.setPoint = function(idx, point)
{
if(m_points[idx] == null)
{
m_points[idx] = point;
}
else
{
m_points[idx].x = point.x;
m_points[idx].y = point.y;
}
}
}
var p = new Polygon({x:1, y:2},{x:2, y:4},{x:2, y:6});
alert(p.length);
alert(p.firstPoint.x);
alert(p.firstPoint.y);
p.firstPoint.x = 100; //不小心写了它的值
alert(p.getPoint(0).x); //不会影响到实际的私有成员
delete p.firstPoint.x; //恢复
alert(p.firstPoint.x);

p.setPoint(0, {x:3,y:4}); //通过setter改写了实际的私有成员
alert(p.firstPoint.x); //getter的值发生了改变
alert(p.getPoint(0).x);
</script>


注意,以上的例子说明了用prototype可以快速创建对象的多个副本,一般情况下,利用prototype来大量的创建复杂对象,要比用其他任何方法来copy对象快得多。注意到,用一个对象为原型,来创建大量的新对象,这正是prototype pattern的本质。
下面是一个例子:

复制代码 代码如下:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wdfjdz.html