由浅到深了解JavaScript类第1/2页

2019-06-03 10:29:45于丽


>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
类作为一个对象时的属性与方法(不知道如何简洁地表达,因此用了这么长的题目)

        不知道在这里谈这个话题是否有点混人耳目,但又觉得不谈这篇文章就不算完整,因为文章目的就是要让人搞清楚类的方方面面。

        看了这一小节的题目,或许你会觉得奇怪,类就是类,怎么会“作为一个对象”呢?在JavaScript里,一切都是对象,包括类!对象可以有属性,可以有方法,类也同样可以有,但这个非常容易跟前边说到的静态属性与静态方法搞混了,因此要仔细看清楚两者的分别!

        定义一个类:
        function WuYouUser()
        {
                this.Name = "泣红亭";
        }

        定义类作为一个对象时的属性:

        WuYouUser.Url = "http://www.51js.com"; //静态属性的定义是:WuYouUser.prototype.Url = "http://www.51js.com";
        var Wo = new WuYouUser();
        document.write(WuYouUser.Url); //http://www.51js.com
        document.write(Wo.Url); //undefined,即未定义!注意这里的未定义

        从这里可以看出Url这个属性是WuYouUser自个所有,改变了它与其它类以及它的子类完全无关!

        引用类的属性只有一个办法,就是类名.属性名,改变它也一样。

        定义类作为一个对象时的方法:

        WuYouUser.ChangeUrl = function()
        {
                this.Url = "http://51js.com";
        }

        你或许会觉得奇怪,这里的this是什么?因为ChangeUrl这个方法是属于对象WuYouUser的,因此this指的就是WuYouUser本身!

        可以运行下边的代码试试:

        document.write(WuYouUser.Url); // http://www.51js.com
        WuYouUser.ChangeUrl();
        document.write(WuYouUser.Url); // http://51js.com

        明显ChangeUrl直接修改了WuYouUser.Url的值,因此后边才能输出http://51js.com

       
        如果你这一节看不明白,也不要着急,编程嘛,许多东东都只能意会不能言传,而且我又没口才,说不清楚,只要以后多写写代码,多用用类自然而然会体会到这一些,还有可以去看看JSVM的代码,里边几乎每个类都有用到类作为一个对象时的属性与方法。