js创建对象的几种方式

Posted 坏~牧羊人

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了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> 

 

以上是关于js创建对象的几种方式的主要内容,如果未能解决你的问题,请参考以下文章

JS创建对象的几种方式

javascript(js)创建对象的模式与继承的几种方式

JS创建对象的几种方式

js-JavaScript常见的创建对象的几种方式

js-JavaScript常见的创建对象的几种方式

js创建对象的几种方式