JS面向对象

最新推荐文章于 2024-10-16 17:24:41 发布

KangLiangBin

最新推荐文章于 2024-10-16 17:24:41 发布

阅读量346

点赞数

本文介绍JavaScript中通过工厂模式、构造函数模式及对象模式三种方式模拟面向对象编程的概念和实践。重点讲解如何创建对象实例，包括使用工厂模式进行对象创建过程的抽象、构造函数模式结合this关键字实现对象实例化，以及利用Object.create()方法创建继承特定原型的新对象。

面向对象的语言的特点之一就是具有类的概念，而在js并没有像Java中用来说明类的关键字class，而通过类可以创建多个具有相同属性和方法的对象，但是我们可以利用JS的特点，去模仿着实现类的作用。

工厂模式
构造函数模式
对象模式

工厂模式

我们可以通过工厂模式（主要借助了关键字new）抽象具体创建一个对象的过程，在使用时只需关注结果，而不需要关注具体的实现细节

例如：

function createOneCar(name, price){
    var car = new Object();
    car.name = name;
    car.price = price;
    car.start = function(){
        alert(car.name + ",启动了!");
    };
    car.stop = function(){
        alert(car.name + ",刹车了!");
    };
    return car;
}
 1
2
3
4
5
6
7
8
9
10
11
12
 1
2
3
4
5
6
7
8
9
10
11
12

那么如何去创建对象呢？
例如：

var benzCar = createOneCar("benz", "20");
alert(benzCar.start);
 1
2
 1
2

构造函数模式

这里我们可以自己去定义构造函数，需要借助this关键字来完成

例如：

function Car(){
    this.name = name;
    this.price = price;
    this.start = function(){
        alert(this.name + ",启动了!");
    };
    this.stop = function(){
        alert(this.name + ",刹车了!");
    };
}
 1
2
3
4
5
6
7
8
9
10
 1
2
3
4
5
6
7
8
9
10

创建自定义的对象的方式需要利用“new”来实现，例如：

var newCar = new Car("benz", 18);
alert(newCar.price);
 1
2
 1
2

对象模式

这种方法的实现借助的是Object.create()方法，这个方法可以接受两个参数，第二参数是可选的，一个就是“模板”（用做新对象原型的对象）

例如：

var person = {
    name : "Dear_mr",
    friend : "shelby", "Greg", "Linda"
};
 1
2
3
4
 1
2
3
4

下面使用Object.create()方法
例如：

var onePerson = Object.create(person);
 1
 1

如果两个参数呢？：

var anotherPerson = Object.create(person, {
    name:{
        value:"MR_"
    }
});
 1
2
3
4
5
 
  
 
 1
2
3
4
5

用上面的方法的指定的属性name就会被覆盖