Javascript面向对象编程思考与总结

Javascript面向对象编程

什么是对象?万物皆对象

-对象:特指的某个事物,具有属性和方法(一组无序的属性的集合)
特征:-----> 属性
行为:----->方法
对象是单个事物的抽象
对象是一个容器,封装了属性(prototype)和方法(method)属性是对象的特征,方法是对象的行为
ECMAscript-262 把对象定义为:无序属性的集合,其属性可以包括值、对象或者函数。严格来说对象是一组没有特定顺序的值

什么是面向对象

面向对象编程 — (Object Oriented Programming),简称OOP,是一种编程开发思想
这种思想将真实世界各种复杂的关系,抽象成一个个对象,然后由对象之间分工与合作,完成对真实世界的模拟
在面向对象程序开发思想中,每个对象都是功能中心,具有明确的分工,可以完成接收信息,处理数据、发出信息等任务,因此面向对象编程具有灵活、代码可复用、高度模块化等特点,容易维护和开发,比起一些由列函数或指令组成的过程式编程(procedural programming)更适合多人合作的大型软件项目

面向对象和面向过程:都是编程思想

  • 面向过程:所有的事情都是亲力亲为,注重的是过程
  • 面向对象:提出需求,找到对象,对象解决。注重的是结果。面向对象不是面向过程的代替,而是面向过程的封装。

面向对象的特征

封装、继承和多态

  • 封装:就是包装,把一些重用的内容进行包装,在需要的时候直接使用。
  • 继承:类与类之间的关系,js中没有类的概念,js中有构造函数的概念,是可以有继承的,不过是基于原型的。
  • 多态:同一个行为,针对不同的对象产生不同的效果**(重点理解)**
  • 抽象性

面向对象的编程思想

  • 根据需求,抽象出相关的对象
  • 总结对象的特征和行为(把特征变成属性,行为变成方法)
  • 定义(js)的构造函数,实例化对象
  • 通过对象调用属性和方法,完成相应的需求

程序中面向对象的基本体现

在Javascript中,所有数据类型都可以视为对象,当然也可以自定义对象
内置对象:js自带的对象
自定义对象:自己定义的对象
我们可以通过自定义的对象来模拟
面向对象的思想是从自然界中来的:类(class)和实例(instance)
类(class)是一种很抽象的概念:在js中new构造函数就相当于类
实例则是一个个具体的;而js中new构造函数得出的结果给一个变量,此时这个变量相当于实例对象
所以面向对象的设计思想是:

  • 抽象出类class
  • 根据类class 创建实例化对象instance
  • 指挥实例instance得出结果
  • 面向对象的抽象过程比函数要高,因为一个class既包含数据,又包含操作数据的方法

创建对象----->实例化对象

对象:特指的某个事物,具有属性和方法(一组无序的属性的集合)
特征:----->属性
行为:----->方法

具体的对象抽象成类,通过类的属性和方法实例化为一个具体的对象

  • 三种创建对象的方式
  • 字面量
  • 调用系统的构造函数
  • 自定义构造函数方式
<script>
        // 实例对象
        var per1 = {
            name: '漩涡鸣人',
            age: 20,
            sex: '男',
            eat() {
                console.log('吃拉面')
            },
            play() {
                console.log('火影')
            }
        };

        // 调用系统的构造函数
        var per2 = new Object;
        per2.name = '佐助';
        per2.age = 21;
        per2.sex = '男';
        per2.eat = function(){
        console.log('千鸟')
        };
        per2.play = function(){
        console.log('万花筒写轮眼')
        }

        function Person();
        console.log(per2 instanceof Person)  //false  其实都是object类型
        // 以上两种方式创建出来的对象都不能确定当前对象是属于什么类型的

        // 自定义构造函数,创建出来的对象是可以找到当前对象是属于什么类型
        function Person(){
            this.name = name;
            this.age = age;
            this.sex = sex;
            this.play = function(){
                console.log('荡秋千')
            }
        };
        // 创建对象 ------- 实例化对象,同时对属性进行初始化
        var per = new Person('大蛇丸',99,'男');
        // 这样创建对象的时候做了4件事
        // 1、开辟空间存储对象
        // 2、把this设置为当前对象
        // 3、设置属性和方法
        // 4、把this对象返回
        console.log(per instanceof Person) //true
    </script>

工厂模式和自定义构造函数的区别

<script>
        // 自定义构造函数,创建对象
        function Person(){
            this.name = name;
            this.age = age;
            this.sex = sex;
            this.play = function(){
                console.log('荡秋千')
            }
        }
        var per = new Person('大蛇丸',99,'男');

        // 工厂模式创建对象
        function createObject(name,age){
            var obj = new Object();
            obj.name = name;
            obj.age = age;
            obj.play = function(){
                console.log('工厂模式')
            };
            return obj;
        }
        var per1 = createObject('李华',28)
    </script>
  • 共同点:都是函数,都可以创建对象,都可以传入参数
  • 不同点:

如何判断对象是不是某个数据类型?

  1. 通过构造器的方式 实例对象.constructor == 构造函数名字
  2. 对象 instanceof 构造函数
    推荐使用第二种方式来识别(原因:原型)
    <script>
        /*
            构造函数和实例对象的关系
            面向对象的思想---抽象的过程--->实例化的过程
            eg:   小苏这个人,姓名,年龄,性别,吃饭,睡觉,打招呼
            看到对象,分析出这些属性和方法的过程就是抽象的过程
            将这些属性和方法放到一个构造函数中
            自定义构造函数---->可以实例化对象
            _proto_ 
        */

        // 自定义构造函数
        function Person(name,age,sex){
            this.name = name;
            this.age = age;
            this.sex = sex;
            this.play = function(){
                console.log('荡秋千')
            }
        }
        var per = new Person('大蛇丸',99,'男');
        per.play();
        // 实例对象是通过构造函数来创建的
        // 实例对象会指向自己的构造函数(暂时理解,错误)
        console.dir(per)
        console.log(Person)
        // 实例对象的构造器(构造函数)
        // 实例对象的构造器是指向Person,所以实例对象就是通过Person构造函数来创建的
        console.log(per.constructor == Person)  //true
        console.log(per._proto_.constructor == Person) //true
        console.log(per._proto_.constructor == Person.prototype.constructor)  //true
        // 可以用来判断实例对象 per 是不是 Person数据类型
        console.log(per instanceof Person)

        // 实例对象和构造函数的关系
        // 1、实例对象是通过构造函数来创建的 --- 实例化
        // 2、如何判断对象是不是某个数据类型?
    </script>

后续

构造函数带来的问题(原型的引入)

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值