javascript的类、委托、事件

很多javascript新手都觉得javascript的类、委托、事件很神秘，当你看下面几段代码后，你会觉得它也不过如此，和其他的面向对象的语言没什么差别。

 javascript中的类：

javascript中的类
function Person(name, age) {
            this._name = name;
            this._age = age;
            //对应Name的Get,Set方法,这个和Java的属性写法很像。
            this.getName = function() {
                return this._name
            };
            this.setName = function(name) {
                this._name = name;
            }
            //对应Age的Get,Set方法
            this.getAge = function() {
                return this._age;
            }
            this.setAge = function(age) {
                this._age = age;
            }
            //显示Person的信息方法
            this.show = function() {
                alert("Name:" + this.getName() + "; Age:" + this.getAge());
            }
        }

        //空构造方法
        var p1 = new Person();
        p1.setName("Southsea");
        p1.setAge(23);
        p1.show();

        //带参的构造方法
        var p2 = new Person("Southsea", 23);
        p2.show();
        
        //注：Javascript中没有真正的方法重载

 

看起来很简单吧。

下面我们把Pererson类的show方法加一个参数，让它具有委托的功能。

 

委托
        function Person(name, age) {
            this._name = name;
            this._age = age;
            //对应Name的Get,Set方法,这个和Java的属性写法很像。
            this.getName = function() {
                return this._name
            };
            this.setName = function(name) {
                this._name = name;
            }
            //对应Age的Get,Set方法
            this.getAge = function() {
                return this._age;
            }
            this.setAge = function(age) {
                this._age = age;
            }
            //显示Person的信息方法
            this.show = function(delegate) {
                if (delegate) {
                    delegate(this);
                }
            }//只有这段与上面的不同。
        }

        //订阅Person类的show
        function showPerson(p) {
            alert("Name:" + p.getName() + "; Age:" + p.getAge());
        }

        var p = new Person("Southsea", 23);
        p.show(showPerson); //别写成p.show(showPerson());哦

 

javascript中的事件

事件
        function Person(name, age) {
            this._name = name;
            this._age = age;
            //对应Name的Get,Set方法,这个和Java的属性写法很像。
            this.getName = function() {
                return this._name
            };
            this.setName = function(name) {
                this._name = name;
            }
            //对应Age的Get,Set方法
            this.getAge = function() {
                return this._age;
            }
            this.setAge = function(age) {
                this._age = age;
            }
            this.onShow = null;//加了onshow事件
            //显示Person的信息方法
            this.show = function() {
                if (this.onShow) {
                    this.onShow(this);
                }
            }
        }

        //订阅Person类的show
        function showPerson(p) {
            alert("Name:" + p.getName() + "; Age:" + p.getAge());
        }

        var p = new Person("Southsea", 23);
        p.onShow = showPerson; //千万别写成p.onShow = showPerson();
        p.show(); 

 

委托和事件都看起来很简单吧。

javascript的动态类，它的格式是与JSON一样的。

 

动态类
        var person = {
            "Name": "Southsea",
            "Age": 23, "show": function() {
                alert("Name:" + person.Name + "; Age:" + person.Age);
            }
        };
        person.show();

 

上面的几段代码是不是看起来很简单呀，希望这编文章对你有一定的帮助。。。

转载于:https://www.cnblogs.com/SouthSea/archive/2008/11/18/1335812.html