谈谈面向对象

 

相信不少人也迷惑面向对象是什么？该怎么理解？这是一个令人相当头疼的问题，以前有个大神给我讲过，在这里整理一下，留作纪念，希望能帮到大家，也欢迎各位大牛指导。

所谓对象，无赖的理解就是万物皆对象，一般在大型项目中必须要使用面向对象编程(OOP)。优点是能够更好地建立模型，使代码更加清晰，易于维护，当然逼格也更高了(PS：不管大小公司面试必须会问面向对象，瞬间就觉得高大上了;)一般来说越是逼格高的东西就越是不好理解。面向对象需要较强的思维形象化能力，面向过程易于理解，但是面向对象对于初学者确实有点难以理解；

之前看过一些教程，粗浅的讲了一些，最后总结一下，大致就是，把函数里面的方法转化成属性，函数里面的行为(嵌套的函数)转化为方法，再把事件对象改写成this。但是呢，这样说毕竟有些抽象，过于笼统，所以作为前端小白的我整理了一些关于面向对象的知识。话不多说，下面见代码；

 

1、首先呢，我们用字面量创建一个对象，如下

 

        var obj = {
            name : "abc",
            age : 10,
            sayName : function(){
                alert(this.name);
            }
        }

如果还有一个 obj1 也想要输出 this.name ，我们也可以再创建一个字面量，但是呢使用字面量创建对象同样有缺点：如果想要创建大量具有相同属性或者方法的对象，需要书写大量重复的代码。 很显然这是不可取的。这是boss和程序员们罪不可忍受的。于是乎就出现了下面这种模式。

 

 

2、工厂模式-工厂模式是把一些零件交给工厂，由工厂组装成成品，然后再返回成品。代码如下

 

        function person(name,age,sayName){
            var obj = {
                name : name,
                age : age,
                sayName : sayName
            };
            return obj;
        }
        person("abc",10,function(){
             alert(this.name);
        });

工厂模式虽然解决了代码大量重复的问题，但是我们只是知道工厂是个对象，并不知道它是用来做什么的，就是说并不知道工厂(person)是属于谁的实例。于是乎再为了解决这个问题就出现了构造函数(PS:距离面向对象又进了一步)。

 

 

3、构造函数模式(构造函数记得第一个字母大写)，不需要再考虑工厂是属于哪个的实例。谁创建了新实例，this就是指向谁。

 

        function Person(name,age){
            this.name = name;
            this.age = age;
            this.sayName = function(){
                alert(this.name);
            }
        }
        var p = new Person("abc",15);
        var p2 = new Person("def",20);
        p.sayName();
        p2.sayName();
        console.log(p.sayName == p2.sayName);

p被称为Person类的一个实例，这个实例可以共享Person类的所有属性或方法.里面的p和p2打印输出并不相等，因为new出来之后是属于两个完全不相同的实例。构造函数同样也会出现很多具有相同作用的方法，但是这些方法没必要。于是又出现了下面的方式。

 

 

4、原型+构造函数模式

 

        function Person(name,age){
            this.name = name;
            this.age = age;
        }
        // Person.prototype.name = "abc";
        // Person.prototype.age = 10;
        Person.prototype.sayName = function(){
            alert(this.name);
        }
        var p1=new Person("abc",15);
        var p2 = new Person("def",20);
        p1.sayName();
        p2.sayName();
        console.log(p1.sayName == p2.sayName);
        console.log(p1.sayName === p2.sayName);

这段代码打印出来，会是两个 true，具有相同的实例。大家看一下，是不是和刚刚开始说的一样呢，方法转化成属性，函数给转化成方法了。这样一层层写下来就非常容易理解了。