一次性弄懂工厂函数、构造函数、原型继承、组合继承
话不多说 上代码
一、 工厂模式
首先学习死记硬背我觉得没有啥用 需要去理解
先来看一段代码 你就应该知道什么是工厂模式
我将代码贴到下面,如果需要可以自行复制
function Human(n,a,s){
var obj = {} // 原材料
// 对原材料进行以下再加工
obj.name = n
obj.age = a
obj.sex = s
obj.Sayhi = function(){
console.log(‘hi’);
}
return obj // 出厂
}
var person1 = Human(‘小明’,17,‘男’) //批量生产ing
var person2 = Human(‘小红’,18,‘男’) //批量生产ing
console.log(person1);
console.log(person2); // person1 person2都是 实例对象 会拥有原型上的方法属性
// 顾名思义 工厂模式就是能快速生产一些具有相同属性对象的函数 避面重复写一些代码
console.log(person1.Sayhi===person2.Sayhi); //false
// 从这个比较结果得出 他们的方法并不是同一个方法 而是创建了很多方法 这样明显是不合适的 数量多时也比较浪费内存和性能
二、 构造函数
// 任意一个函数通过new调用 用于创建某一个类型的对象
// String Number Array Boolean Object Date Regexp
// 共同特点就是首字母大写
// js中允许自定义构造函数
// 构造函数是一种内置的工厂函数
function Human(n,a,s){
// 对比工厂函数 他没有原材料 也没有return 实际是new时 已经帮我们做了以下这些操作
// this -> 实例对象
// var this = {} // new调用时就完成了
this.name = n
this.age = a
this.sex = s
this.sayHi = function(){
console.log('hi');
}
// new调用时自动完成
// return this
}
var person1 = new Human('小明',17,'男')
var person2 = new Human('小红',18,'男')
console.log(person1); // 实例化对象
console.log(person2); // 实例化对象
console.log(person1.constructor); // Human
console.log(person2.constructor); // Human
console.log(person1.sayHi===person2.sayHi); //false
// 从这个比较结果得出 他们的方法并不是同一个方法 而是创建了很多方法 这样明显是不合适的 数量多时也比较浪费内存和性能
三、 原型继承
// prototype
// 每一个函数对象都有一个prototype原型 指向一个对象 (原型对象)
// constructor 所有对象的constructor属性返回创建这个对象的构造函数(类)对象的类型识别
console.log(Human.prototype.constructor); //ƒ Human(){}
console.log(Human=Human.prototype.constructor); // true
function Human(){
}
console.log(Human.prototype.constructor); //ƒ Human(){}
console.log(Human=Human.prototype.constructor); // true
// 给human添加一些方法和属性
Human.prototype.method1 = function(){
console.log('方法1');
}
Human.prototype.method2 = function(){
console.log('方法2');
}
Human.prototype.person1 = '老王'
Human.prototype.girlfriend = '马某'
Human.prototype.person2 = '宋吉吉'
var wang = new Human()
var song = new Human()
console.log(wang); //此时 王的女朋友是马某
console.log(song); // song的女朋友也是马某
// 这不对劲 所以原型继承有个缺点 就是属性值没有办法设置
console.log(wang.constructor); // Human
console.log(song.constructor); // Human
// 4、 组合继承
![在这里插入图片描述](https://img-blog.csdnimg.cn/b8a6c1fd211b4bc8984156792e1cd5b2.png?x-oss-process=image/watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBA54ix55Sf5rS754ix5pWy5Luj56CB,size_20,color_FFFFFF,t_70,g_se,x_16)
// 顾名思义 利用构造函数继承和原型继承
// 解决 1、属性值没有办法设置 2、方法会重复创建 浪费性能内存
function Human(n,a,s){
this.name = n
this.age = a
this.sex = s
}
Human.prototype.sayHi = function(){
console.log('hi');
}
var person1 = new Human('小红',11,'男')
var person2 = new Human('小黑',1,'女')
console.log(person1);
console.log(person2);
console.log(person1.sayHi===person2.sayHi) // true
// 这个打印结果表示打印出来的person1和person2都是用的原型对象上的sayhi方法没有去创建新的方法