千锋教育Kerwin系列前端教程1000集（适合前端0基础，h5(html5)/
1.面向过程编程思想和面向对象编程思想的区别
01.面向过程编程：强调步骤顺序
程序 = 算法 + 语法；
面向过程编程思想的缺陷：
a.随着问题规模的增加，代码逐渐难以控制
b.复用性很差，只能复用函数
02.面向对象的编程：
强调对象（最后再考虑过程，但肯定不是抛弃了过程）
程序 = 对象1 + 对象2 + .... + 对象n
对象：万物皆为对象
2.类和对象的概念
属性-----抽象时的名词
方法-----抽象时的动词
对每一个对象进行抽象
抽象-----对事物加以描述的过程
类：拥有相同属性和行为的对下那个的集合（模板）
对象：类的实例化（强调真实存在且唯一性）
目标：为了创建自定义类型
3.ES5方法创建类
JS运用了面向对象的思想，但是却没有类的语法
解决方案：用函数模拟类，被当作类的函数本质是构造函数
this：
a.与事件体连用，代表触发该事件的元素
b.与普通函数连用，代表调用改进函数的对象
c.与箭头函数连用，代表其父元素的前缀
d.与构造方法连用，代表new出来的对象
普通函数与构造函数的区别：
a.习惯上构造函数首字母大写
b.构造函数必须和new连用
c.构造函数不能添加return，因为自动返回的是地址
4.ES6创建类
class 类名 {
构造函数---new时调用的函数
constructor（参数列表）{
}
去掉function的普通函数
}
5.类的组合
组合：一个类的成员属性是另一个类的对象
6.小明问题案例
小明手里有两张牌，左手红桃A，右手黑桃K
问：当小明交换左右手的牌后，两只手分别剩下什么牌？
面向对象解决问题的思想：
a.找出该问题有几个对象
对象：小明
小明左手 小明右手
红桃A 黑桃K
b.根据对象抽象出其睡醒和方法创建类
person：leftHand rightHand
showCard() swapCard()
Hand:card
Card: color num
c.各个对象按顺序执行
class Card{
constructor(color,num){
this.color = color;
this.num = num;
}
}
class Hand{
constructor(card){
this.card = card;
}
}
class Person{
constructor(lh,rh){
this.lh = lh;
this.rh = rh;
}
showCard(){
console.log(this.lh.card.color,this.lh.card.num);
console.log(this.rh.card.color,this.rh.card.num);
}
swapCard(){
[this.lh.card,this.rh.card] = [this.rh.card,this.lh.card];
}
}
let card1 = new Card("♥","A");
let card2 = new Card("♠","K");
let lh = new Hand(card1);
let rh = new Hand(card2);
let xiaoming = new Person(lh,rh);
xiaoming.showCard();
xiaoming.swapCard();
xiaoming.showCard();
