日积月累---JS面向对象(1)

最新推荐文章于 2025-01-23 22:03:10 发布

Ganker

最新推荐文章于 2025-01-23 22:03:10 发布

阅读量664

点赞数 1

CC 4.0 BY-SA版权

分类专栏：日积月累文章标签：面向对象 js

本文链接：https://blog.youkuaiyun.com/aasswwe/article/details/19088643

日积月累专栏收录该内容

2 篇文章

订阅专栏

本文深入探讨JavaScript中封装和多态的概念，通过实例详细解释了方法和属性的封装，以及如何通过重写和重载实现多态，并提供了一些扩展属性的方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一. 封装

1、方法的封装

            var WebSite = {
                Add: function() {
                    alert("Add");
                },
                Del: function(id) {
                    alert("Del:" + id);
                }
            };

要用的时候直接调用

WebSite.Add();

这样做的好处是，条理清晰，尤其是方法多了的时候要找方法只要找到它的对象就可以了。

还可以这样写：

            var WebSite = {};
            WebSite.Product = {
                Add: {
                    AddId: function() {
                        alert("addId");
                    }
                }
            };

调用：

WebSite.Product.Add.AddId();

可以无限扩张下去。

2、属性的封装

 var WebSite = function() {
                var obj = new Object;
                obj.id = "1";
                obj.name = "Ganker";
		return obj;
            };
            var id = WebSite.id;
            var name = WebSite.name;

二.修改变量的属性（多态）

多态有二种方式，重写，重载。

1.重写

                var sd = new Date;
                alert(sd.toString());

结果：

把“toString”方法改一下

Date.prototype.toString = function() {
                return this.getFullYear() +"_"+ this.getMonth();
            };

然后再运行结果就变成了

当然这种方法不仅能用来修改属性值，也可以用来添加属性

           //给"String"类型的变量添加"AddNum"属性
            String.prototype.AddNum = function(num) {
                return this + "_" + num;    
            };

调用：

                var str = "Ganker";
                var s = str.AddNum (1);
                alert(s);

结果：Ganker_1

其他类型的扩展

            Number.prototype.XXXX
            Date.prototype.XXXX
            Array.prototype.XXXX
            Object.prototype.XXXX

只要这几种变量吧？

还有一种很好玩的写法

            var WebSite = {
                Show: function () {  }
            };
            //扩展方法
            WebSite.Show.prototype.Type= function () {
                return "s";
            };
            var str= new WebSite.Show();//实例化
            alert(str.Type());

2.重载

因为js方法里面设定参数时是没有限定类型的，所以当不传参数的时候，方法就默认传的参数是null，所以可以运用这点来实现重载。

            function Test(a) {
                var str="";
                if (a != null) {str += a;}
                alert(str);
            }

调用

  Test();//返回""
  Test(1);//返回"1"

当然也有局限性，就是说如果有多个参数的话，无法指定只传某些特定参数。

            function Test(a, b, c) {
                var str="";
                if (a != null) {str += "a";}
                if (b != null) { str += "b"; }
                if (c != null) { str += "c"; }
                alert(str);
            }
            Test();//返回""
            Test(1);//返回"a"
            Test(1, 2);//返回"ab"
            Test(1, 2, 3);//返回"abc"

如果只想传第二个参数或者第三个参数，怎么办？

"Test(,2);" 这样？对不起，不的行。

"Test(null,2);" 这样是可以的，虽然第一个参数传的是null，但还是算传了值。

所以刚才说的局限性就在这里，如果要传第二个参数，那就必须要把第一个参数传过去。