简单理解创建对象的三种方式

500 阅读2分钟

这是我参与8月更文挑战的第13天,活动详情查看:8月更文挑战

在 JavaScript中, 创建对象的方式有多种,下面简单介绍一下三种,帮助理解和拓展。

 1、调用构造函数创建对象

调用构造函数创建对象,该方式是先创建一个构造函数,然后再实例化出一个对象

var obj = new Object();
// 创建一个人的对象

var person = new Object();
person.name = "小甜";
person.age = 23;
person.eat = function () {

//在当前这个对象的方法中是可以访问当前这个对象的属性的值
console.log("我叫" + this.name + "," + "我爱吃火锅");
};

person.eat();

2、工厂模式创建对象

工厂模式创建对象,考虑到在ECMAScript种无法创建类,开发人员就发明了一种函数,用函数来封装以特定接口创建对象的细节,如下面例子所示

//工厂模式创建对象
function cObj(name,age) {

    var obj = new Object(); // 创建对象

    //添加属性
    obj.name = name;
    obj.age = age;

    //添加方法
    obj.eat = function () {
        console.log("我叫" + this.name + ",,," + this.age + "岁" + ",,," + "爱吃火锅");
    };
    return obj;
}

//创建人的对象
var luzp = cObj("小哥",27);
luzp.eat();

//创建一个人的对象
var lut = cObj("小甜",30);
lut.eat();

函数cObj()能够根据接受的参数来构建一个包含所有必要信息的对象。可以无数次地调用这个函数,而每次它都会返回一个包含三个属性一个方法的对象。

3、自定义构造函数创建对象

自定义构造函数创建对象,从而定义自定义对象属性和方法

// Person () 其实就是一个函数
function Person(name,age) {
    this.name = name;
    this.age = age;
    this.eat = function () {
      console.log("我叫" + this.name + "和小哥认识的时候我" + this.age + "," + "我们都爱吃火锅");
    };
}

//创建对象
var lut = new Person("小甜",23);
console.log(lut.name);
lut.eat();

注意:自定义构造函数在创建对象的时候,产生以下四个事件

  • new 对象的时候,会在内存中申请一个空间,存储创建的新的对象
  • 把 this 设置为当前的对象
  • 设置对象的属性和方法的值
  • 把 this 这个对象返回

4、字面量的方式创建对象

var lut={

    name: "小甜",
    age: 23,
    place: "小寨",

    meet:function () {
        console.log(this.age + "岁的时候" + "和小哥" + "相遇与" + this.place);
    },

    eat:function () {
        console.log("都爱吃火锅");
    }
};

lut.meet();
lut.eat();