创建原型对象的两种方式
一
function Person() {}
Person.prototype.name ='Nicholas',
Person.prototype.job ='Engineer'
二
Person.prototype = {
name: 'Nicholas',
age: 29,
job: 'software engineer',
sayName: function () {
console.log(this.name);
}
};
//方式二对原型进行封装 设置成一个以对象字面量创建的新对象 其他都相同 但是constructor不再指向person
//如果必须要constructor指回原型,设置如下
Person.prototype = {
constructor:'person',
name: 'Nicholas',
age: 29,
job: 'software engineer',
sayName: function () {
console.log(this.name);
}
};
var person1 = new Person();
person1.name = 'Greg';
person1.sayName(); Greg
//删除定义在person1上的属性 继续查找原型属性
// delete person1.name;
person1.sayName(); //undefined
//检测某属性时定义在原型上还是当前对象上
// 使用hasOwnProperty方法 jsHint 单引 双引 交替用
console.log('person1.hasOwnProperty("name")' + person1.hasOwnProperty('name'));
//获得对象上所有的可枚举属性 使用 obj.keys()
var p1 = new Person();
p1.name = 'rachel';
p1.sayName = function () {
alert('p1.sayName()');
};
var p1keys = Object.keys(p1);
console.log('p1keys=' + p1keys);
//实例中的指针只指向原型,不指向构造函数
function Origin(){
}
var Ofriend= new Origin();
Origin.prototype ={
name:'Rachel',
age:'21'
};
console.log('Ofriend.name'+ Ofriend.name);
//若直接赋值给函数原型,此时指针指向原型的job,当前对象就可以查找到
// var friend = new Person();
// //注意此处是重写原型而不是构造函数
Person.prototype.job= 'Engineer';
console.log('friend.job ='+friend.job);
组合使用原型模式和构造函数模式
原型模式的缺点:
1.它省略了为构造函数传递初始化参数这一环节,结果所有实例在 默认情况下都将取得相同的属性值。虽然这会在某种程度上带来一些不方便,但还不是原型的大问题。
2.原型模式的大问题是由其共享的本性所导致的。 原型中所有属性是被很多实例共享的,这种共享对于函数非常合适。对于那些包含基本值的属性倒 也说得过去,毕竟(如前面的例子所示),通过在实例上添加一个同名属性,可以隐藏原型中的对应属 性。然而,对于包含引用类型值的属性来说,问题就比较突出了。
且看下面例子:
Person.prototype = { constructor: Person, name : "Nicholas", age : 29, job : "Software Engineer", friends : ["Shelby", "Court"], sayName : function () { alert(this.name); } };
var person1 = new Person(); var person2 = new Person();
person1.friends.push("Van");
alert(person1.friends); //"Shelby,Court,Van"
alert(person2.friends); //"Shelby,Court,Van"
alert(person1.friends === person2.friends);
真可怕,所有的属性person1 person2都互通了
因此我们使用原型与构造函数混合的模式
所使用的方法是互通共享的,但数据储存的数组不会共享
套路如下:
function Person(name, age, job){ this.name = name; this.age = age; this.job = job; this.friends = ["Shelby", "Court"]; }
Person.prototype = { constructor : Person, sayName : function(){ alert(this.name); } }
var person1 = new Person("Nicholas", 29, "Software Engineer"); var person2 = new Person("Greg", 27, "Doctor");
person1.friends.push("Van"); alert(person1.friends); //"Shelby,Count,Van" alert(person2.friends); //"Shelby,Count" alert(person1.friends === person2.friends); //false alert(person1.sayName === person2.sayName); //true
网友评论