面向对象的知识点

面向对象

1.面向对象是什么

一种代码的开发方式，是我们写代码的一种思想

编程思想：
   面向过程：在开发过程中，关注每一个步骤，顺序，细节...
   面向对象:  在开发过程中，找到一个能帮我们完成功能的对象

吃面条：
  面向过程：
    ==>和面：多少水，多少面
    ==>切面：宽窄
    ==>煮面：时间多长
    ==>拌面：酱放多少
    ==>吃

 
   面向对象：
      ==>面馆（现成的对象）
     ==>点面
     ==>吃

找数组下标：

面向过程：
   -----------------------数组中元素x首次出现的位置-----
    ===>获取数组 
    ===>遍历数组
    ===>判断数组元素中是否包含x
    ===>如果包含，找到遍历的索引i，并终止循环
    ===>如果不包含,返回-1
面向对象：
  -----------------------数组中元素x首次出现的位置-----
     ===>对象 arr（var arr = new Array()）
     ===>indexOf方法
     ===>找到下标

面向对象是面向过程的高度封装，核心思想：高内聚，低耦合（代码以最少的方式，实现最多的功能）

开发过程： 完成轮播图
   面向过程：
‘      1. 获取元素
       2. 准备变量
       3. 书写过程：向右移动。向左移动，自动轮播。，

   面向对象：
        1. 找到对象
             var obj = {
                   属性：
                      大盒子
                       ul
                       ol
                       index
                         
                方法：
                       moveRight()
                       moveLeft()
                       ....
           }

2.基本概念：类和对象

1、类: 就是分类，类型，数据类型，包括了很多信息的数据类型。如：人，猪，狗等等。
     等价于我们的Number，Boolean，String等等， 官方提供了哪些类？Array，Date，RegExp等等。

     var arr = new Array(12,23,12)

     人：（类是抽象概念）
     
2、对象：就是变量，是类的实例，即类的一个示例，类的一个举例说明。如：诸葛亮是人的一个示例，大黄是狗的一个举例说明。

  我们在实际开发中，会定义若干个自定义类型（类），然后，再根据类来定义变量
  
  关系：类是对象的抽象，对象是类的具体实例，通过类可以实例化出一个对象

创建对象：

方式一：字面量法

方式二：Object

方式三：构造函数（ES3提出）

语法：

  function Obj(name,age){
        this.name = name
        this.age = age
  }

构造函数的this帮我们做了：
1.创建一个新对象；
2.将构造函数的作用域赋给新对象(因此this就指向了这个新对象)；
3.执行构造函数中的代码；
4.返回新对象

方式四：类的方式 (ES6提出)

(1)通过class 关键字创建类，类名我们还是习惯性定义首字母大写
(2)类里面有个constructor函数,可以接受传递过来的参数，同时返回实例对象
(3) constructor 函数只要new 生成实例时,就会自动调用这个函数，
    如果我们不写这个函数，类也会自动生成这个函数 constructor(){}
(4) constructor函数内部的this指的是创建出来的对象本身
(5) 生成实例new不能省略
(6)最后注意语法规范，创建类类名后面不要加小括号，生成实例类名后面加小括号，构造函数不需要加function


方法：
(1)我们类里面所有的函数不需要写function
(2)多个函数方法之间不需要添加逗号分隔

3. Swiper

swiper就是使用的是面向对象语言写的

什么是插件：专门为了实现某一类单一功能而出现的代码 。swiper输入滑动类的插件

https://www.swiper.com.cn/

使用步骤：
1. https://www.swiper.com.cn/usage/index.html
2. https://www.swiper.com.cn/download/index.html#file1
  建议下载6.x版本
3. 下载好的压缩包解压后，在swiper-master\package里找到swiper-bundle.min.js和swiper-bundle.min.css
4. 然后按照https://www.swiper.com.cn/usage/index.html文档一步一步进行操作
5. 注意版本的差别
6. 然后在https://www.swiper.com.cn/api/index.html这个文件里找到 配置项
7. 更改你的轮播图

4.放大镜

 思路分析： 
    1. 移入移出-----> 显示和隐藏 遮罩和大盒子
    2. 鼠标移动  鼠标跟随
    3. 限制移动边界
    4. 计算比例，根据比例来进行移动