2-1 面向过程、面向对象、类与继承什么是面向过程什么是面向对象呢？ ECMAScript 到底是对象过程的还是面向对象

什么是面向过程什么是面向对象呢？ ECMAScript 到底是对象过程的还是面向对象的呢？我们一起来学习一下吧

面向过程

问大家一个问题，把大象装冰箱一共分几步，很多同学就想起来春晚的小品说分三步

打开冰箱门
把大象装进去
关上冰箱

以上是不是在完成这个需求需要哪些步骤，当每个需求的步骤完成之后整个需求就完成了，我们更关心的是整个过程的步骤

如果是面向对象呢首先分析当前这个需求内到底有哪些对象？对于这些对象具有哪些属性、方法、行为如果把大象装冰箱哪些属性需要我们去关心呢？我们首先想到的有两点 1. 大象 2. 冰箱

面向对象

那下面我们具体分析一下这个需求首先我们需要关心大象的体积，如果大象的体积小于等于冰箱的容量的时候大象才能装到冰箱里面第二、是冰箱自己把大象装进去的吗？由此推断出有一个隐藏对象，可能是一个人，或者一双手把大象放进冰箱里面去经过分析我们得到三种属性

大象
冰箱
隐藏对象

这种分析方式就是面向对象的分析方式，我们关心的不是每个需求的步骤，而是关心这个需求里面都有哪些对象，每个对象具有哪些属性和方法，如果对于比较复杂的情况下，对于一些共同对象我们可能还要抽象出一些类

那我们学习的jvascript是什么语言呢？ JavaScript是一种基于对象 (object-based) 的语言

类与对象

类(class)是对象(object)的模板，定义了同一组对象共有的属性和方法

ES5 的类与继承

对于类的话首字母要大写，别人一眼就能看出来并不是一个普通方法而是一个类也叫构造函数

类

function People(name, age) {
// 实例属性
this.name = name
this.age = age
// this.showName = function(){  // new Function()
//  console.log('我得名字是' + this.name)
// }
}
 
// 静态属性
People.count = 0
// 静态方法
People.getCount = function(){
console.log('当前共有' + People.count + '个人')
}
// 实例方法
People.prototype.showName = function(){
console.log('我得名字是' + this.name)
}
let p1 = new People('UU', 4)
console.log(p1)
p1.showName()

let p2 = new People('zhangsan', 18)
console.log(p2)
console.log(People.count)
People.getCount()

在构造函数里this 指向的当前new 出来的一个实例化对象
直接在类里面写方法其实不太友好，因为每次new对象的时候都会带一个方法，应该当前类的原型下面
在静态方法里面this 指向当前构造函数，并不是实例化对象

ES5 类的继承

// 父类
function Animal(name){
this.name = name
}
Animal.prototype.showName = function(){
console.log('名字是' + this.name)
}
// 子类
function Dog(name, color) {
Animal.call(this, name) // 继承属性
this.color = color
}

let d1 = new Dog('wangcai', 'white')
console.log(d1)
d1.showName() // 报错，说明这个方法并没有继承过去
对于构造函数的继承只能继承父类的属性并不能继承方法
// 原型继承
Dog.prototype = new Animal()
Dog.prototype.constuctor = Dog
d1.showName()

组合继承结合了构造函数继承和原型继承的优点，既能够继承属性又能够集成方法

ES6的类与继承

constuctor 就表示他的构造函数
constuctor 关键字就是ES6 对应的语法糖，可以更好的更快捷的去实现代码

class People {
constuctor(name, age){
this.name = name
this.age = age
}
showName(){
console.log(this.name)
}
}
let p1 = new People('UU', 4)
console.log(p1)

ES6 继承

通过super 关键字去继承父类的属性

class Coder extends People{
constuctor(name, age, company){
super(name, age)
this.company = company
}
showCompany(){
console.log(this.company)
}
}
let c1 = new Coder('zhangsan', 27, 'tengxun')
console.log(c1)
c1.showName()
c1.showCompany()

2-1 面向过程、面向对象、类与继承