通过例子说明如何为JavaScript的私有成员属性添加getter

月影

1. <script>
   
2. function List()
   
3. {
   
4. 
   
5.          var m_members = []; //私有成员
   
6. 
   
7.          m_members = Array.apply(m_members, arguments);
   
8. 
   
9.          this.length = {
   
10.                    valueOf:function(){
    
11.                             return m_members.length;
    
12.                    },
    
13.                    toString:function(){
    
14.                             return m_members.length;
    
15.                    }
    
16.          }
    
17. 
    
18.          this.toString = function()
    
19.          {
    
20.                    return m_members.toString();
    
21.          }
    
22. 
    
23.          this.add = function()
    
24.          {
    
25.                    m_members.push.apply(m_members, arguments);
    
26.          }
    
27. }
    
28. //alert(List);
    
29. var list = new List(1,2,3);
    
30. alert(list);
    
31. alert(list.length);
    
32. list.add(4,5,6);
    
33. alert(list);
    
34. alert(list.length);
    
35. </script>

复制代码运行代码另存代码

Rimifon

经常看到月儿:L定义valueOf方法，能不能跟大家说一下，什么情况下会用到valueOf？

使用toString来做js的getter，有一个缺点是，获取某个对象的下级属性时，不会引发这个对象的"getter"。

另外，将该对象赋值给另外一个变量的时候，也不会引发这个getter。

[ 本帖最后由 Rimifon 于 2007-4-7 17:11 编辑 ]

月影

原帖由 Rimifon 于 2007-4-7 16:53 发表
经常看到月儿:L定义valueOf方法，能不能跟大家说一下，什么情况下会用到valueOf？

使用toString来做js的getter，有一个缺点是，获取某个对象的下级属性时，不会引发这个对象的"getter"。

另外，将该对象赋 ...

对象的getter通过另一种方法来模拟
可以考考你...用什么来模拟比较合适 ^^

winter

prototype
不过还是想要真正的getter

winter

1. <script>
   
2. function List()
   
3. {
   
4. 
   
5.          var m_members = []; //私有成员
   
6. 
   
7.          m_members = Array.apply(m_members, arguments);
   
8.          
   
9.          function Member(){};
   
10.          Member.prototype=m_members
    
11.          this.members = new Member();
    
12.          this.toString = function()
    
13.          {
    
14.                    return m_members.toString();
    
15.          }
    
16. 
    
17.          this.add = function()
    
18.          {
    
19.                    m_members.push.apply(m_members, arguments);
    
20.          }
    
21. }
    
22. //alert(List);
    
23. var list = new List(1,2,3);
    
24. alert(list);
    
25. alert(list.members.length);
    
26. list.add(4,5,6);
    
27. alert(list);
    
28. alert(list.members.length);
    
29. </script>

复制代码运行代码另存代码

月影

winter答对咯 ^^

再来个更清晰的例子...

1. <script>
   
2. function Polygan()
   
3. {
   
4.         var m_points = [];
   
5. 
   
6.         m_points = Array.apply(m_points, arguments);
   
7. 
   
8.         function GETTER(){};
   
9.         GETTER.prototype = m_points[0];
   
10.         this.firstPoint = new GETTER();
    
11. 
    
12.         this.length = {
    
13.                 valueOf : function(){return m_points.length},
    
14.                 toString : function(){return m_points.length}
    
15.         }
    
16. 
    
17.         this.add = function(){
    
18.                 m_points.push.apply(m_points, arguments);
    
19.         }
    
20. 
    
21.         this.getPoint = function(idx)
    
22.         {
    
23.                 return m_points[idx];
    
24.         }
    
25. }
    
26. var p = new Polygan({x:1, y:2},{x:2, y:4},{x:2, y:6});
    
27. alert(p.length);
    
28. alert(p.firstPoint.x);
    
29. alert(p.firstPoint.y);
    
30. p.firstPoint.x = 100; //不小心写了它的值
    
31. alert(p.getPoint(0).x);  //不会影响到实际的私有成员
    
32. delete p.firstPoint.x; //恢复
    
33. alert(p.firstPoint.x);
    
34. </script>

复制代码运行代码另存代码

月影

另外...关注一下prototype的另类用法：

1. <script>
   
2. function classA()
   
3. {
   
4.         this.a = 100;
   
5.         this.b = 200;
   
6.         this.c = 300;
   
7. 
   
8.         this.reset = function()
   
9.         {
   
10.                 for(var each in this)
    
11.                 {
    
12.                         delete this[each];
    
13.                 }
    
14.         }
    
15. }
    
16. classA.prototype = new classA();
    
17. 
    
18. var a = new classA();
    
19. alert(a.a);
    
20. a.a *= 2;
    
21. a.b *= 2;
    
22. a.c *= 2;
    
23. alert(a.a);
    
24. alert(a.b);
    
25. alert(a.c);
    
26. a.reset();
    
27. alert(a.a);
    
28. alert(a.b);
    
29. alert(a.c);
    
30. </script>

复制代码运行代码另存代码

anbert

简单的东西被搞复杂了

winter

reset放在prototype上比较好吧

hksar

有趣

1. <script>
   
2. function classA()
   
3. {
   
4.         this.a = 100;
   
5.         this.b = 200;
   
6.         this.c = 300;
   
7.                     this.list=new Array(this.a,this.b,this.c);
   
8.         this.reset = function()
   
9.         {
   
10.                 for(var each in this)
    
11.                 {
    
12.                         delete this[each];
    
13.                 }
    
14.         }
    
15. }
    
16. classA.prototype = new classA;
    
17. 
    
18. var a = new classA;
    
19. var b = new classA;
    
20. a.list.push(1,2,3);
    
21. b.list.push(4,5,6);
    
22. alert(a.list);
    
23. alert(b.list);
    
24. a.reset();
    
25. alert(a.list);
    
26. alert(b.list);
    
27. </script>

复制代码运行代码另存代码

[ 本帖最后由 hksar 于 2007-4-7 21:20 编辑 ]

風雲

1. 输入a值：<input id=ipt>
   
2. <input type=button onclick="ins.a = document.all.ipt.value" value="设置">
   
3. <input type=button onclick="alert(ins.a)" value="获取">
   
4. <script>
   
5. var ins = new Class1;
   
6. function Class1()
   
7. {
   
8.     var _class = this;
   
9.     this. a = {"Value" : ""};
   
10.     (function set_a(value)
    
11.     {
    
12.         if(value !== _class.a)
    
13.         {
    
14.             alert("a被更改了。");
    
15.             value.Value = _class.a;
    
16.             _class.a = value;
    
17.         }
    
18.         setTimeout(function(){set_a(value)});
    
19.     })(this.a);
    
20.     this.a.toString = function()
    
21.     {
    
22.         alert("您获取了a");
    
23.         return _class.a.Value;
    
24.     }
    
25. }
    
26. </script>

复制代码运行代码另存代码

ttyp

说白了就是利用对象的默认值机制，引用型对象的默认值是先看有没有实现toString函数，有些值类型的变量是看valueOf函数

民工精髓

原帖由 Rimifon 于 2007-4-7 16:53 发表
经常看到月儿:L定义valueOf方法，能不能跟大家说一下，什么情况下会用到valueOf？

使用toString来做js的getter，有一个缺点是，获取某个对象的下级属性时，不会引发这个对象的"getter"。

另外，将该对象赋 ...

给一个对象实现valueOf方法，那么它就直接拥有了可以当作数值来运算的特性，这个东西可以用在比较大小之类的地方，省得写排序函数～

Rimifon

测试了一下，toString实际上已经实现了valueOf。

1. <script>
   
2. var insValue = new Class1;
   
3. alert([insValue, insValue + 1]);
   
4. var insString = new Class2;
   
5. alert([insString, insString + 1]);
   
6. function Class1()
   
7. {
   
8.     this.a = 5;
   
9.     this.valueOf = new Function("return this.a");
   
10. }
    
11. function Class2()
    
12. {
    
13.     this.a = 5;
    
14.     this.toString = new Function("return this.a");
    
15. }</script>

复制代码运行代码另存代码

Rimifon

1. <script>
   
2. var ins = new Class1;
   
3. alert([ins, ins + 1, ins == "a", ins == 10]);
   
4. delete ins.valueOf;
   
5. alert([ins, ins + 1, ins == "a", ins == 10]);
   
6. function Class1()
   
7. {
   
8.     this.a = "a";
   
9.     this.valueOf = new Function("return parseInt(this.a, 16)");
   
10.     this.toString = new Function("return this.a");
    
11. }</script>

复制代码运行代码另存代码

[ 本帖最后由 Rimifon 于 2007-4-9 09:33 编辑 ]

效果

原帖由 Rimifon 于 2007-4-9 09:14 发表
测试了一下，toString实际上已经实现了valueOf。
var insValue = new Class1;
alert();
var insString = new Class2;
alert();
function Class1()
{
    this.a = 5;
    this.valueOf = new Function( ...

R版说得不错
我也测了一下

1. <SCRIPT LANGUAGE="JavaScript">
   
2. <!--
   
3.         function class1()
   
4.         {
   
5.                 var a="a";
   
6.                 this.toString=function(){return "b";}
   
7.         }
   
8.         var t=new class1();
   
9.         alert(t.valueOf());
   
10. //-->
    
11. </SCRIPT>

复制代码运行代码另存代码

Rimifon

月影老是拿出这个“valueOf”在大家眼前晃来晃去，难道是为了提醒大家不要忽略valueOf的存在？:lol

winter

嘿嘿 我跟月影老大学的第一个东西就是这个^^

民工精髓

测试了一下，toString实际上已经实现了valueOf。

关于这个，我觉得从结果上看，toString跟valueOf一致，是因为js的自动类型转换。刚才想了半天，想要举个反例，没想出来:L

呃，我说个不太确切的吧，复数，假设有一个Complex，它的toString是按照格式输出a+bi这样，valueOf假设取的是它这个点到坐标原点的距离r，那么，Complex的实例就可以直接用比较操作符来判断大小。

唉，表达能力极其差劲:funk: :Q

winter

1. <SCRIPT LANGUAGE="JavaScript">
   
2. <!--
   
3. alert(Function.prototype.valueOf==Array.prototype.valueOf);
   
4. alert(Function.prototype.toString==Array.prototype.toString);
   
5. 
   
6. function ClassA()
   
7. {
   
8.     this.valueOf=function(){return "a";}
   
9.     this.toString=function(){return "A";}
   
10. }
    
11. alert(new ClassA+"");
    
12. alert(new ClassA);
    
13. //-->
    
14. </SCRIPT>

复制代码运行代码另存代码

这个应该这样理解
toString是用于输出的
valueOf是用于运算的，在不强制指定valueOf时 它默认返回toString