封装:
- 此节专门讲函数的工厂模式、构造函数模式和原型模式的封装
- Author:大冰
工厂模式
》工厂模式需要创建一个对象,最后return这个对象。
function createPerson(name, age, job) {
const o = new Object();
o.name = name;
o.age = age;
o.job = job;
o.sayName = function() {
console.log(this.name);
};
return o;
}
const person1 = createPerson("dabing", 18, "Web前端工程师");
const person2 = createPerson("jack", 20, "Nodejs");
person1.sayName(); //dabing
console.log(person1.sayName == person2.sayName); //false
// console.log(Object.getOwnPropertyDescriptors(person1));
构造函数模式
》构造函数的名称的首字母都是要大写的,非构造函数则以小写字母开头
function CreateFun(name, age, job) {
this.name = name;
this.age = age;
this.job = job;
this.sayName = function() {
console.log('CreateFun name : ',this.name);
};
}
const fun = new CreateFun("jobing", 21, "全栈工程师");
fun.sayName(); //CreateFun name : jobing
// console.log(Object.getOwnPropertyDescriptors(fun));
const fun2 = new CreateFun();
fun2.sayName(); //CreateFun name : undefined
构造函数模式和工厂模式的区别
(1)构造函数没有显式地创建对象
(2)属性和方法直接赋值给了this
(3)没有return
如何解决构造函数模式内部创建的方法在实例时,实例化后,两个实例的方法是不相等的呢?他们为什么不相等?
- 1.糟糕的方法:就是在全局定义一个方法,让构造函数内部方法指向外部全局定义的方法。但这样子会影响到全局作用域。
- 2.较好的方法:就是利用原型模式,把方法定义在对象/构造函数的原型上。
- 3.不相等:因为他们在实例化的时候,是重新创建了方法,重新new Function()。该方法的作用域不同,因此不同实例上的函数虽然同名却不相等。
利用原型模式的解决构造函数模式的方法不同实例的问题
function CreateFPrototype(name, age, job) {
this.name = name;
this.age = age;
this.job = job;
CreateFPrototype.prototype.sayName = function() {
console.log(this.name);
};
}
const fp1 = new CreateFPrototype("dahuang", 18, "教育家");
const fp2 = new CreateFPrototype("dabing", 18, "科学家");
fp1.sayName(); //dahuang
fp2.sayName(); //dabing
console.log(fp1.sayName === fp2.sayName); //true
// console.log(Object.getOwnPropertyDescriptors(fp1));//不存在sayName方法,因为他在原型中
// console.log(Object.getOwnPropertyDescriptors(CreateFPrototype));//返回构造函数里面的原型和其他参数
// console.log(Object.getPrototypeOf(fp1)); //原型中存在sayName方法,