js 创建对象 经典模式全面了解

JS创建对象-经典模式

在JavaScript中，对象是实例化一个类的一种方式。JS有很多种方式来创建对象，经典模式是其中一种，也是​​最基础的一种，但是在ES6中已经有了更加方便的方式来实现创建对象。

经典方式

那么什么是经典方式呢？经典方式指的是使用构造函数来实现创建对象。

构造函数创建对象

构造函数实际上就是普通的JS函数，在使用构造函数创建对象的时候，我们使用了'new'关键字去创建一个实例，如下：

function Animal(name, type) {   //构造函数
    this.name = name;
    this.type = type;
    this.say = function () {    //公共方法
        console.log(`My name is ${this.name}, I'm a ${this.type}.`);
    };
}
let cat = new Animal('Tom', 'Cat');   //实例
cat.say();    // My name is Tom, I'm a Cat.

首先定义了一个构造函数 Animal，并且在构造函数里定义了两个属性，name、type和一个公共方法 say()，注意，这个公共方法是每一个使用该构造函数创建的实例都会共享的。

当我们使用'new'关键字创建一个实例的时候，会创建一个对象，并且这个新对象的原型会链接到构造函数的原型(Animal.prototype)，因此，在这个实例中能够访问到原型上的方法和属性。

可以通过instanceof来判断该对象是否是通过该构造函数的实例创建的。

console.log(cat instanceof Animal); //true

原型方式创建对象

在使用构造函数定义一个对象的时候，公共方法可能会占用过多的内存，因为每一个实例都会创建一个相同的方法，但是JS中有一个更加高效的方式来处理这种问题，那就是原型方式。

首先我们通过构造函数定义一个对象，然后通过给该构造函数的原型 prototype 添加属性和方法，来实现共享这些属性和方法。这些属性和方法都可以通过实例(实例.proto)来访问。

function Animal(name, type) {    //构造函数
    this.name = name;
    this.type = type;
}
Animal.prototype.say = function () {   //原型方法
    console.log(`My name is ${this.name}, I'm a ${this.type}.`);
};

let dog = new Animal('Lucy', 'Dog');  //实例
dog.say();    //My name is Lucy, I'm a Dog.
console.log(dog instanceof Animal);   //true

Object.create()方式

我们还可以使用ES5中的Object.create()方法来创建一个对象实例，这种方式实际上是采用了原型式继承的一种比较常见的方式。

let Animal = {   //基础对象
    name: '',
    type: '',
    say() {
        console.log(`My name is ${this.name}, I'm a ${this.type}.`);
    }
}

let dog = Object.create(Animal);  //创建实例对象
dog.name = 'Lucy';
dog.type = 'Dog';
dog.say();   //My name is Lucy, I'm a Dog.
console.log(dog instanceof Animal);   //false

在这个例子中，我们定义了一个基础对象Animal，然后使用Object.create()方法来生成一个新的实例dog，实际上就是在生成一个新的对象，并且原型链上指向了Animal对象，在这个实例中可以访问到Animal对象上的所有属性和方法。