导图社区 编程基础13:面向对象编程
编程基础13:面向对象编程知识梳理,包括面向过程与面向对象、对象与类、构造函数和原型、函数、严格模式等等。
编辑于2022-11-27 21:43:12 四川省编程基础13:面向对象编程
1:面向对象
面向过程与面向对象
面向过程
性能比面向对象高,适合跟硬件联系很紧密的东西,例如单片机就采用的面向过程编程。
不易维护、不易复用、不易扩展
面向对象
易维护、易复用、易扩展,由于面向对象有封装、继承、多态性的特性,可以设计出低耦合的系统,使系统 更加灵活、更加易于维护
性能比面向过程低
对象与类
对象
对象是由属性和方法组成的:是一个无序键值对的集合,指的是一个具体的事物
属性:事物的特征,在对象中用属性来表示(常用名词)
方法:事物的行为,在对象中用方法来表示(常用动词)
类
在 ES6 中,使用 class 关键字声明一个类
类抽象了对象的公共部分,它泛指某一大类(class)对象特指某一个,通过类实例化一个具体的对象
class Star { // 类的共有属性放到 constructor 里面 constructor(name, age) { this.name = name; this.age = age; } }
注意
class 关键字创建类, 类名定义首字母大写
类里面有个constructor 函数,可以接受传递过来的参数,同时返回实例对象
constructor 函数 只要 new 生成实例时,会自动调用, 如果不写这个函数,类也会自动生成
生成实例 new 不能省略
类的继承
class Son extends Father
子类使用super关键字访问父类的方法
注意
继承中,如果实例化子类输出一个方法,先看子类有没有这个方法,如果有就先执行子类的
继承中,如果子类里面没有,就去查找父类有没有这个方法,如果有,就执行父类的这个方法(就近原则)
如果子类想要继承父类的方法,同时在自己内部扩展自己的方法,利用super 调用父类的构造函数,super 必须在子类this之前调用
时刻注意this的指向问题,类里面的共有的属性和方法一定要加this使用
在 ES6 中类没有变量提升,所以必须先定义类,才能通过类实例化对象
2:构造函数和原型
静态成员和实例成员
实例成员就是构造函数内部通过this添加的成员
实例成员只能通过实例化的对象来访问
静态成员 在构造函数本身上添加的成员
静态成员只能通过构造函数来访问
构造函数
构造函数方法很好用,但是存在浪费内存的问题
构造函数原型prototype
构造函数通过原型分配的函数是所有对象所共享的
JavaScript 规定,每一个构造函数都有一个prototype 属性,指向另一个对象
prototype就是一个对象,这个对象的所有属性和方法,都会被构造函数所拥有
对象原型
对象有一个属性 __proto__ 指向原型对象
属性 __proto__ 指向构造函数的 prototype 原型对象
constructor构造函数
对象原型( __proto__)和构造函数(prototype)原型对象里面都有一个属性 constructor 属性指回构造函数本身
constructor 主要用于记录该对象引用于哪个构造函数,它可以让原型对象重新指向原来的构造函数。
原型链
每一个实例对象又有一个__proto__属性,指向的构造函数的原型对象,构造函数的原型对象也是一个对象,也有__proto__属性,这样一层一层往上找就形成了原型链。
构造函数实例和原型对象三角关系
1.构造函数的prototype属性指向了构造函数原型对象
2.实例对象是由构造函数创建的,实例对象的__proto__属性指向了构造函数的原型对象
3.构造函数的原型对象的constructor属性指向了构造函数,实例对象的原型的constructor属性也指向了构造函数
继承
原型链继承
设置构造函数Man的原型为Run,实现继承
Man.prototype = new Run();
问题
对象constructor构造函数指向偏差
破坏原型链的完整性
冒充方式的继承
call和apply 改变 函数中this指向的
Object.create()
Object.create 的本质就是创建对象
新对象 继承 了前者所有的属性和方法
Class 的继承
Class 可以通过extends关键字实现继承
3:函数
函数的定义和调用
函数的定义
函数声明方式 function 关键字 (命名函数)
函数表达式(匿名函数)
new Function()
函数的调用
函数()
this
函数内部的this指向
普通函数调用->window
构造函数调用->实例对象原型对象里面的方法也指向实例对象
对象方法调用->该方法所属对象
事件绑定方法->绑定事件对象
定时器函数->window
立即执行函数->window
改变函数内部 this 指向
call方法
apply方法
bind方法
call、apply、bind三者的异同
共同点 : 都可以改变this指向
不同点:
call 和 apply 会调用函数, 并且改变函数内部this指向.
call 和 apply传递的参数不一样,call传递参数使用逗号隔开,apply使用数组传递
bind 不会调用函数, 可以改变函数内部this指向.
应用场景
1. call 经常做继承.
2. apply经常跟数组有关系. 比如借助于数学对象实现数组最大值最小值
3. bind 不调用函数,但是还想改变this指向. 比如改变定时器内部的this指向.
高阶函数
函数作为参数或将函数作为返回值输出
函数也是一种数据类型,同样可以作为参数,传递给另外一个参数使用
函数也可以作为返回值传递回来
4:严格模式
基本内容
1.消除了 Javascript 语法的一些不合理、不严谨之处,减少了一些怪异行为。
2.消除代码运行的一些不安全之处,保证代码运行的安全。
3.提高编译器效率,增加运行速度。
4.禁用了在 ECMAScript 的未来版本中可能会定义的一些语法,为未来新版本的 Javascript 做好铺垫。比如一些保留字如:class,enum,export, extends, import, super 不能做变量名
开启严格模式
当前script标签开启了严格模式: "use strict"
为函数开启严格模式
function fn(){ "use strict"; return "123"; }
严格模式中的变化
变量先声明后使用
不允许删除变量
全局作用域中函数中的 this 是 undefined
构造函数不加new调用, this 指向的是undefined 如果给他赋值则 会报错.
定时器 this 还是指向 window
5:闭包
当内部函数生存周期大于外部函数时,内部函数以某一种方式被任何一个外部作用域访问时,一个闭包就产生了
闭包产生所具备的条件
函数词法作用域:函数的执行依赖于变量作用域,这个作用域是在函数定义时决定的,而不是函数调用时决定的
函数的作用域与作用域链
垃圾回收机制
函数本身作为值使用
闭包的作用
搭建外部访问内部作用域的通道
封装数据不被销毁
6:递归
什么是递归
如果一个函数在内部可以调用其本身,那么这个函数就是递归函数