JS创建对象的几种方式整理

javascript是一种“基于prototype的面向对象语言“,与java有非常大的区别,无法通过类来创建对象。那么,既然是面象对象的,如何来创建对象呢?

一:通过“字面量”方式创建对象

方法:将成员信息写到{}中,并赋值给一个变量,此时这个变量就是一个对象

列如:

var person={"name":"abc","age":22,work:function(){console.loh(1)}}

如果{ }中为空,则将创建一个空对象:

var person={}

演示代码:

<script>

  var person={
     name:"wqc",
     age:22,
    intro:function(){console.log(1)}
};

 person.intro();
</script>
 我们还可以给对象丰富成员信息。
  对象.成员名称 = 值;
  对象[成员名称] = 值;
也可以获取对象的成员信息。
  对象.成员名称;
  对象[成员名称];
丰富成员信息:
<script>

var person={
     name:"wqc",
     age:22,
     intro:function(){
         console.log(1);
    }
    
 }
person.class=22;//丰富成员变量
</script>

二、通过“构造函数”方式创建

方法:

var person=new 函数名();

比如:var person=new object();

 

<script>
    function person(){
        this.name="xiaoming";
        this.age=22;
        this.intro=function(){
            console.log(2)
        }
    }
    var per=new person();
    per.intro();
</script>

三、通过object方式创建。

 

var obj=new Object()

方法:先通过object构造器new一个对象,再往里丰富成员信息。\

 

 <script type="text/javascript">
2 var person = new Object();
3 person.name = "dongjc";
4 person.age = 32;
5 person.Introduce = function () {
6         alert("My name is " + this.name + ".I'm " + this.age);
7     };
8 person.Introduce();
9 </script>

 第五种:原型创建对象模式 

 

function Person(){}
Person.prototype.name = 'Nike';
Person.prototype.age = 20;
Person.prototype.jbo = 'teacher';
Person.prototype.sayName = function(){
 alert(this.name);
};
var person1 = new Person();
person1.sayName();

使用原型创建对象的方式,可以让所有对象实例共享它所包含的属性和方法。

第六种:使用工厂模式创建对象

 

function createPerson(name,age,job){
 var o = new Object();
 o.name = name;
 o.age = age;
 o.job = job;
 o.sayName = function(){
  alert(this.name); 
 };
 return o; 
}
var person1 = createPerson('Nike',29,'teacher');
var person2 = createPerson('Arvin',20,'student');

在使用工厂模式创建对象的时候,我们都可以注意到,在createPerson函数中,返回的是一个对象。那么我们就无法判断返回的对象究竟是一个什么样的类型。于是就出现了第二种创建对象的模式。

第七种:组合使用构造函数模式和原型模式

 

function Person(name,age,job){
 this.name =name;
 this.age = age;
 this.job = job;
}
Person.prototype = {
 constructor:Person,
 sayName: function(){
 alert(this.name);
 };
}
var person1 = new Person('Nike',20,'teacher');

 

 

posted @ 2018-08-29 23:44  YSE!  阅读(190)  评论(0编辑  收藏  举报