@H_4040@什么是对象
@H4040@我们先来看高程三中是如何对对象进行定义的
@H404_0@"无序属性的集合,其属性可以包括基本值、对象或者函数",对象是一组没有特定顺序的的值。对象的没个属性或方法都有一个俄名字,每个名字都映射到一个值。
@H_404_0@简单来理解对象就是由属性和方法来组成的
@H_4040@
面向对象的特点
@H4040@<span style="color: #0000ff">
封装
@H404_0@对于一些功能相同或者相似的代码,我们可以放到一个函数中去,多次用到此功能时,我们只需要调用即可,无需多次重写。
@H_404_0@在这里我们可以理解为创造对象的几种模式:单例模式,工厂模式,构造函数模式,原型模式等。
@H_4040@<span style="color: #0000ff">
继承
@H404_0@子类可以继承父类的属性和方法
@H_404_0@<span style="color: #0000ff">
多态(重载和重写)
@H_404_0@javascript中的封装
@H_404_0@单例模式
@H_404_0@小王在一个小公司,就自己一个前端,所以他写js都是这样的- 单例模式只是一定程度上避免了变量名的冲突,但并不能彻底解决此问题,而且在不同的对象下,我们可能会有很多功能相同的代码,最终造成大量的冗余代码。
- 单例模式让每个对象有了自己独立的命名空间,但是并不能批量生产的问题,每一个新的对象都要重新写一份一模一样的代码。
工厂模式
@H_404_0@1.工厂模式其实就是把需要一个个的编写的对象,放在一个函数中统一的进行创建,说白了就是普通函数的封装。 @H_404_0@2.工厂模式总共3步骤: @H_404_0@1)引进原材料 --- 创建一个空对象 @H_404_0@2)加工原材料 --- 加工对象:给对象添加属性和方法; @H_404_0@3)输出产品 --- 返回对象:return 对象;输出对象;
}
var person1 = CreatePerson('小明',23)
var person2 = CreatePerson('小华',23)
person1.showName(); //我的名字是:小明
person2.showName(); //我的名字是:小华
@H_404_0@工厂模式的优缺点
@H_404_0@既然叫工厂模式,它就和我们周围的工厂一样,我们只需要把原材料放进去,就能得到我们需要的产品了。
@H_404_0@工厂模式也解决了单例模式的批量生产的问题,避免了单例模式中的大量冗余代码,进行系统的封装,提高代码的重复利用率
@H_404_0@不过工厂模式跟我们js内置类的调用方法不同
@H_404_0@构造函数模式
函数:首字母大写(约定俗成);
function CreatePerson(name,age){ //创建一个自定义的类
//构造函数中的this,都是new出来的实例
//构造函数中存放的都是私有的属性和方法;
this.name=name;
this.age=age;
this.showName=function(){
console.log('我的名字是:'+this.name)
}
}
//实例1
var person1 = new CreatePerson('小明',25)
//实例2
var person2 = new CreatePerson('小华',24)
@H_404_0@这里说一下工厂模式和构造函数模式的区别:
@H_404_0@1. 在调用的时候不同: @H_404_0@工厂模式:调用的时候,只是普通函数的调用createPerson(); @H_404_0@构造函数模式:new CreatePerson(); @H_404_0@2. 在函数体内不同: @H_404_0@工厂模式有三步:1)创建对象 2)加工对象 3)返回对象; @H_404_0@构造函数模式只有1步: 只有加工对象; 因为系统默认会为其创建对象和返回对象; @H_404_0@3. 构造函数默认给我们返回了一个对象,如果我们非要自己手动返回的话: @H_404_0@ (1)手动返回的是字符串类型:对以前实例上的属性和方法没有影响; @H_404_0@ (2)手动返回的是引用数据类型:以前实例身上的属性和方法就被覆盖了;实例无法调用属性和方法; @H_404_0@构造函数的方法都是私有方法,每个实例调用的都是自己私有的方法,同样也会有许多重复的代码。 @H_404_0@我们可以使用原型模式来解决每个实例中都有相同方法的函数的问题 @H_404_0@原型模式
方法放到函数的原型链上
CreatePerson.prototype.showName = function(){
console.log('我的名字是:'+this.name)
}
var person1 = new CreatePerson('小明',25)
var person2 = new CreatePerson('小华',24)
person1.showName() //小明
@H_404_0@###### 原型模式的关键:
@H_404_0@1)每个函数数据类型(普通函数,类)上,都有一个属性,叫prototype。
@H_404_0@2)prototype这个对象上,天生自带一个属性,叫constructor:指向当前这个类;
@H_404_0@3)每个对象数据类型(普通对象,prototype,实例)上都有一个属性,
@H_404_0@ 叫做__proto__:指向当前实例所属类的原型;
@H_404_0@这3句话理解了,下边的东西就可以不用看了 //手动滑稽
@H_404_0@通过例子我们来看这几句话是什么意思
方法时,我们知道有个instanceof的方法
@H_404_0@比如 @H_404_0@A instanceof B
@H_404_0@instanceof判断的规则就是:
@H_404_0@沿着A的__proto__这条线查找的同时沿着B的prototype这条线来找,如果两条线能找到同一个引用(对象),那么就返回true。如果找到终点还未重合,则返回false。
@H_404_0@再来看我们之前的那个例子
当我们查找一个对象的属性时,先在这个对象的私有空间内查找,如果没找到,就顺着对象的__proto__这条链去它的构造器的ptototype上查找,如果还没找到,接着沿__proto__向上查找,直到找到Object.prototype还没有的话,这个值就为undefined,这就是所谓的原型链
@H_404_0@列举下网页中的一些相关的原型链继承
@H_404_0@在这里就主要说一下组合继承(call + 原型链)父类的私有属性
}
Son.prototype.__proto__ = Father.prototype
var son = new Son
console.dir(son)
@H_404_0@最后来一张思维导图