工厂类模式
从var person=new Object()可以看出由工厂类创建的实例的构造函数都是大的Object
所以无法区分实例的种类
每个创建的实例的sayName方法以及属性(name,age)都是它自己私有的
优点:批量创建对象 提高代码复用率
缺点:方法冗余 无法区分种类 创建的实例都是Object的实例
var Person = function (name, age) {
var person = new Object();
person.name = name;
person.age = age;
person.sayName = function () {
console.log(this.name);
}
return person
}
var p1 = Person('张三', 18)
p1.sayName()
console.log(p1);
构造函数模式
通过构造函数创建的实例对象
优点:可以批量创建对象 区分种类
缺点:方法冗余
****new操作符做的事情
1.创建一个实例对象 Person的实例对象
2.this指向person实例对象 this----p1 p2
3.执行函数体
4.返回person实例对象
var Person = function (name, age) {
this.name = name,
this.age = age,
this.sayName = function () {
console.log(this.name);
}
}
var person1 = new Person('lili', 18)
var person2 = new Person('hoho', 15)
Person('ww', 19)
//调用Person函数,将实参添加至全局对象中
// 相当于global.Person()
person1.sayName()
person2.sayName()
console.log(person1.sayName === person2.sayName);//输出为 false
// 如果其他类型的实例对象如果想调用Person里面的方法
// 通过Person调用call改变Person里面this的指向
var annimal = new Object();
Person.call(annimal, '动物', 15)
annimal.sayName()
原型模式
将所有的属性和方法全部维护到原型对象中 构造函数中不存放任何属性和方法
不单独使用
如果实例中命名了于原型中同名的属性,会将原型的该属性遮蔽
当实例调用该属性是会优先访问实例拥有的属性
如果想删除实例的属性:delete person1.name
注意:会影响constructor的指向
function Person () { }
Person.prototype = {
constructor:Person//回复指向
name: '张三',
age: 19,
hobby: [],
sayName () {
console.log(this.name);
}
}
var person1 = new Person()
var person2 = new Person()
console.log(person1);//输出为{}
person1.name = 'lisi'
person1.hobby.push('篮球')
console.log(person1.hobby, person2.hobby);//输出为['篮球'] ['篮球']
//更改引用数据类型的数据
console.log(person1);//输出为{name:'lisi'}
person1.sayName()//输出为lisi
person2.sayName()//输出为张三
关于 指向的问题:
组合模式
将共用的方法或者属性放在原型里面
把私有的属性放在构造函数里面
function Person (name, age, gender) {
this.name = name;
this.age = age;
this.gender = gender;
this.firends = ['zhangsan', 'lisi'];
}
Person.prototype = {
constructor: Person,
sayName: function () {
console.log(this.name);
}
};
var p1 = new Person('larry', 44, 'male');
var p2 = new Person('terry', 39, 'male');
p1.firends.push('robin');
console.log(p1.firends); // [ 'zhangsan', 'lisi', 'robin' ]
console.log(p2.firends); // [ 'zhangsan', 'lisi' ]
console.log(p1.firends === p2.firends); // false
console.log(p1.sayName === p2.sayName); // true
本文含有隐藏内容,请 开通VIP 后查看