前端基础6/6-面向对象

201 阅读5分钟

一、通俗解释

什么是对象

  • Everything is object (万物皆对象)
  • 我们可以从两个层次来理解
  • 对象是单个事物的抽象
  • 对象是一个容器,封装了属性(property)和方法(method)
  • 属性:对象的状态
  • 方法:对象的行为
  • 在实际开发中,对象是一个抽象的概念,可以将其简单理解为:数据集或功能集。
  • ECMAScript-262 把对象定义为:无序属性的集合,其属性可以包含基本值、对象或者函数。

面向对象和面向过程的区别

面向过程(Procedure Oriented 简称PO :如C语言):

从名字可以看出它是注重过程的。当解决一个问题的时候,面向过程会把事情拆分成: 一个个函数和数据(用于方法的参数) 。然后按照一定的顺序,执行完这些方法(每个方法看作一个过程),等方法执行完了,事情就搞定了。

  • 面向过程就是亲力亲为,事无巨细,面面俱到,步步紧跟,有条不紊 面向对象(Object Oriented简称OO :如C++,JAVA等语言):

面向对象编程 —— Object Oriented Programming,简称 OOP ,是一种编程开发思想。

它将真实世界各种复杂的关系,抽象为一个个对象,然后由对象之间的分工与合作,完成对真实世界的模拟。

看名字它是注重对象的。当解决一个问题的时候,面向对象会把事物抽象成对象的概念,就是说这个问题里面有哪些对象,然后给对象赋一些属性和方法,然后让每个对象去执行自己的方法,问题得到解决。

  • 面向对象就是找一个对象,指挥得结果
  • 面向对象将执行者转变成指挥者
  • 面向对象不是面向过程的替代,而是面向过程的封装

面向对象的特性

  • 封装性
  • 继承性
  • [多态性]抽象

总结

  • 在面向对象程序开发思想中,每一个对象都是功能中心,具有明确分工,可以完成接受信息、处理数据、发出信息等任务。
  • 因此,面向对象编程具有灵活、代码可复用、高度模块化等特点,容易维护和开发,比起由一系列函数或指令组成的传统的过程式编程(procedural programming),更适合多人合作的大型软件项目。

二、用例子说明两者的区别

例子:

问题: 洗衣机里面放有脏衣服,怎么洗干净?

面向过程的解决方法:

1、执行加洗衣粉方法;

2、执行加水方法;

3、执行洗衣服方法;

4、执行清洗方法;

5、 执行烘干方法;

以上就是将解决这个问题的过程拆成一个个方法(是没有对象去调用的),通过一个个方法的执行来解决问题。

面向对象的解决方法:

1、我先弄出两个对象:“洗衣机”对象和“人”对象

2、针对对象“洗衣机”加入一些属性和方法:“洗衣服方法”“清洗方法”、“烘干方法”

3、针对对象“人”加入属性和方法:“加洗衣粉方法”、“加水方法”

4、然后执行

人.加洗衣粉

人.加水

洗衣机.洗衣服

洗衣机.清洗

洗衣机.烘干

解决同一个问题 ,面向对象编程就是先抽象出对象,然后用对象执行方法的方式解决问题。

我是分割对象和面对对象编程解释清楚了。那我们再来看看类。为啥看类呢?因为:类是对象的模板

考察点: 类与实例, 生成实例, 类与继承, 如何实现继承, 继承的几种方式

类的声明

首先,说一下什么是类,困扰我很久的一个问题。查了很多资料,写的太过高深,不得不承认看不懂。 我将采用举例子的方式讲下类是什么,类的继承是什么。

类:

我把它看作模板,比如人类人类就是一个类,类。里面又有男女,种族之分。所以类是个大的概念,不是某个具体的对象。

类的继承:

宽泛一点说,你是人类,你有人类的特征,你是个有特点的独立的对象,两个肩膀扛一个脑袋,五官都长在脸上,直立行走。有这些特征你就是人类。你继承人类基因,所以你是人类。再深一点,比如你天生长得好看,那么必定祖上有人长得好看,要不就是基因返祖。这就是我理解的继承

类的继承方式

1:借助构造函数实现继承

   function Parent1() {
                this.name = 'parent1';
            }
            // 在父级外给父级加个say方法,子类继承不到
            Parent1.prototype.say = function () {};
              function Child1() {
                Parent1.call(this); //将父级类指向子构造函数中去
                this.type = 'child1'
            }
            console.log(new Child1);
            console.log(new Child1(),new Child1().say());//子拿不到父的say哦

2:借助原型链实现继承

  function Parent2() {
         this.name = 'parent2';
         }
         function Child2() {
         this.type = 'child2'
         }
          Child2.prototype=new Parent2()//
         console.log(new Child2);
         //  接下来看看他的缺点,其实也是浅拷贝。。。个人理解
            var s1 = new Child2()
            var s2 = new Child2()
            s1.play.push(4)//只改了s1的,但是s2的也会增加一个4.缺点就在这
            console.log(s1.play, s2.play);//共用了原型对象,导致
            s1改变s2也会改变

image.png 3:组合继承

 function Parent3() {
                this.name = 'parent3';
                this.play = [1, 2, 3]
            }

            function Child3() {
                Parent3.call(this);
                this.type = 'child3'
            }
            Child3.prototype = new Parent3() //
            console.log(new Child2);
            var s3 = new Child3()
            var s4 = new Child3()
            s3.play.push(4) 
            console.log(s3.play, s4.play); 
            //缺点,父类执行两次

3-1:优化组合继承 以前写过继承优化,在套娃之王里。感兴趣可去看

 function Parent3() {
                this.name = 'parent3';
                this.play = [1, 2, 3]
            }

            function Child3() {
                Parent3.call(this);
                this.type = 'child3'
            }
            Child3.prototype =Parent3.prototype//就改这一个行
            console.log(new Child2);
            var s3 = new Child3()
            var s4 = new Child3()
            s3.play.push(4) 
            console.log(s3.play, s4.play);