JavaScript面向对象实现

JavaScript面向对象实现

一：面向对象三大特征

 继承，封装，多态！

二：JavaScript自定义对象

 创建对象的方式：

方式1，对象初始化器方式；

<script type="text/javascript">
var marry={
name:"marry",
age:2,
getMarry:function (){
alert("我是"+this.name+"今年"+this.age+"岁了！");
},
action:function(){
alert("哈哈哈");
}
};
alert(marry.name);
alert(marry.age);
marry.getMarry();
marry.action();
</script>

方式2，构造函数方式；

<script type="text/javascript">
    function Dog(name,age){
        this.name=name;
        this.age=age;
        this.getDog=function(){
            alert("我是"+this.name+"今年"+this.age+"岁了！");
            };    
        this.action=function(){
            alert("会跑，会跳！");
        };
    };
    var dog=new Dog("二狗",1);
    alert(dog.name);
    alert(dog.age);
    dog.getDog();
    dog.action();
</script>

对象属性定义：

私有属性；对象属性；类属性；

<script type="text/javascript">
    function C(){
        this.objPro="对象属性";
        C.prototype.objPro2="对象属性2";
        var pro="私有属性";
        function fun2(){
            alert(pro);
        };
        return fun2();
        
    }
    C.classpro="类属性";
    var c=new C();
    alert(c.objPro);
    alert(c.objPro2);
    alert(C.classpro);
    var result=C;
    result(); 
    </script>

对象方法定义：私有方法；实例方法；类方法；

<script type="text/javascript">
    function C(){
        var privateFunc=function(){
            alert("私有方法！");
        };
        privateFunc();
        this.func=function(){
            alert("对象方法1");
        };
        C.prototype.func2=function(){
            alert("对象方法2");
        }
    }
    C.classFunc=function(){
        alert("类方法！");
    }
    C.classFunc();
    var c=new C();
    c.func();
    c.func2();
    </script>

三：JavaScript实现封装特性

 

四：JavaScript实现继承特性

 Apply()实现属性和方法的继承；

 

<script type="text/javascript">
    function Animal(name,age){
        this.name=name;
        this.age=age;
        this.func=function(){
            alert("我是"+this.name+"今年"+this.age+"岁了！");
        };
        this.action=function(){
            alert("跳，跑！");
        }
    }
    function Dog(name,age){
        Animal.apply(this, [name,age]);
    }
    var dog=new Dog("二狗",3);
    alert(dog.name);
    alert(dog.age);
    dog.func();
    dog.action();
    </script>

Prototype实现原型的继承；

 

<script type="text/javascript">
    function Animal(name,age){
        this.name=name;
        this.age=age;
        this.func=function(){
            alert("我是"+this.name+"今年"+this.age+"岁了！");
        };
        this.action=function(){
            alert("跳，跑！");
        }
    }
    function Dog(name,age){
        Animal.apply(this, [name,age]);
    }
    Dog.prototype=new Animal();
    var dog=new Dog("二狗",3);
    alert(dog.name);
    alert(dog.age);
    dog.func();
    dog.action();
    </script>

五：JavaScript实现多态特性

 JavaScript模拟多态实现！

<script type="text/javascript">
    function Animal(){
        this.say=function(){
            alert("我是动物");
        };
    }
    function Dog(){
        this.say=function(){
            alert("我是狗");
        };
    }
    function Cat(){
        this.say=function(){
            alert("我是猫");
        };
    }
    Dog.prototype=new Animal();
    Cat.prototype=new Animal();
    function say(animal){
        if(animal instanceof Animal){
            animal.say();
        }
    } 
    var dog=new Dog();
    var cat=new Cat();
    dog.say();
    cat.say();
    </script>