zoukankan      html  css  js  c++  java
  • js创建对象的几种方式

    简写

      作为一个java程序员,习惯了java创建对象严格的语法方式,看到js灵活创建对象的方式,难免有些困惑,现在就来总结下js创建对象的几种方式

    1、第一种json的方式 (推荐),比较通俗易懂

        <script>      
            var Cat={}; //JSON  
            Cat.name="jacky、";//添加属性并赋值  
            Cat.age=22;  
            Cat.sayHello=function(){  
                alert("hello"+Cat.name+",今年"+Cat["age"]+"岁了");//可以使用"."的方式访问属性
            }  
            Cat.sayHello();//调用对象的方法(函数)  
           或
         var clock={
           hour:12,
          minute:12,
          second:12,
           showTime:function()
          { 
          alert(this.hour+":"+this.minute+":"+this.second);
          }
       }
     clock.showTime();//调用
        </script>  

    2、构造函数

    //无参构造函数
    <script>
            function Person(){  
                  
            }  
            var personOne=new Person();//定义一个function,如果有new关
            键字去"实例化",那么该function可以看做是一个类  
            personOne.name="梦想之舟";  
            personOne.hobby="正在敲代码";  
            personOne.work=function(){  
                alert(personOne.name+"is"+personOne.hobby);  
            }  
            personOne.work();  
    </script>       
        <!---用有参数构造函数-->  
        <script>  
            function Pet(name,age,hobby){  
                this.name=name;//this作用域:当前对象  
                this.age=age;  
                this.hobby=hobby;  
                this.eat=function(){  
                    alert("我叫"+this.name+",我今年"+this.age+"岁了,我喜欢"+this.hobby);  
                }  
            }  
              
            var hehe=new Pet("王鹏程",22,"打篮球");//实例化创建对象  
            hehe.eat();  
        </script>  

    3、使用工厂方式创建对象

    <script>  
           var dog = new Object();  
           dog.name="旺财";  
           dog.age=3;  
           dog.work=function(){  
                alert("我是"+dog.name+"汪汪汪......"+"我今年"+dog.age+"岁了");  
           }  
           dog.work();  
    </script> 

    4、使用原型的方式

        <script>  
            function Dog(){  
                  
            }  
            Dog.prototype.name="旺财";  
            Dog.prototype.eat=function(){  
                alert(this.name+"是个吃货");  
            }  
            var wangcai = new Dog();  
            wangcai.eat();  
        </script>  

    5、混合方式(构造+原型)

    <!--混合模式(原型和构造函数)-->  
        <script>  
            function Car(name,price){  
                this.name=name;  
                this.price=price;  
            }  
            Car.prototype.sell=function(){  
                alert("我是"+this.name+",我现在卖"+this.price+"万元");  
            }  
            var camry = new Car("宝马",22);  
            camry.sell();  
        </script> 
  • 相关阅读:
    团队项目冲刺第十天
    gradle文件配置
    idea无Android项目
    php第二次实验报告
    最长回文字串(hdu 3068)
    优先队列实现哈弗曼最小权值
    最小生成树 克鲁斯卡尔(Kruskal)算法求最小生成树
    背包问题------ 分类: ACM 2015-08-03 20:57 1人阅读 评论(0
    Cent Savings (DP) 分类: ACM dp 2015-08-0
    Judging Troubles (multiset查找) 分类: ACM STL
  • 原文地址:https://www.cnblogs.com/520playboy/p/6897834.html
Copyright © 2011-2022 走看看