继承---原型式继承

原型式继承

基于已有的对象创建新对象

①obj()浅复制

对象的属性会共享

function obj(o){
 function F(){}
 F.prototype=o;
 return new F();
}
var person={
name:"zhangsan",
age:18,
friends:['Lisi','wangwu','zhaoliu']
};
 var thePerson=obj(person);
thePerson. name='Sunmenghua';
thePerson.friends.push('liulaogen');
console.log(thePerson.name); //Sunmenghua
console.log(thePerson.friends);
//["Lisi", "wangwu", "zhaoliu", "liulaogen"]

 var theOtherPerson=obj(person);
theOtherPerson. name='Qi Haiyang';
theOtherPerson.friends.push('Da liu');
console.log(theOtherPerson.name);
//Qi Haiyang
console.log(theOtherPerson.friends);
// ["Lisi", "wangwu", "zhaoliu", "liulaogen", "Da liu"]

console.log(thePerson.name);
//Sunmenghua
console.log(thePerson.friends);
// ["Lisi", "wangwu", "zhaoliu", "liulaogen", "Da liu"]

console.log(person.name);
//zhangsan
 

②Object.create() 

相当于obj()函数;

可接受两个参数:新对象的原型对象和(新对象的专属属性)            {接受几个对象的原理结果相同,只是赋值方式变了}

A.当只接受一个参数

同名属性会被覆盖,但是不会改变其他对象的属性,有各自的name;但friends数组都会改变

这里修改了thePerson.name的值,theOtherPerson.name的值并未改变,并不是因为thePerson和theOtherPerson有独立的name值,而是thePerson.name="Sunmenghua'是给thePerson添加了name值,并非修改了原型上的name值。

因为我们找对象上的属性时,总是先找实例上对象,没有找到的话再去原型对象上的属性。实例对象和原型对象上如果有同名属性,总是先取实例对象上的值
        var person = {
            name: "zhangsan",
            age: 18,
            friends: ['Lisi', 'wangwu', 'zhaoliu']
        };
        var thePerson = Object.create(person);
        thePerson.name = 'Sunmenghua';
        thePerson.sex = 'female';
        thePerson.friends.push('liulaogen');
        console.log(thePerson.name); //Sunmenghua 
        console.log(thePerson.friends); //["Lisi", "wangwu", "zhaoliu", "liulaogen"] 
        console.log(thePerson.sex); //'female';

        var theOtherPerson = Object.create(person);
        theOtherPerson.name = 'Qi Haiyang';
        theOtherPerson.friends.push('Da liu');
        console.log(theOtherPerson.name); //Qi Haiyang
        console.log(thePerson.name); //Sunmenghua
        console.log(theOtherPerson.friends); // ["Lisi", "wangwu", "zhaoliu", "liulaogen", "Da liu"]         
        console.log(thePerson.friends);//["Lisi", "wangwu", "zhaoliu", "liulaogen", "Da liu"]
        console.log(theOtherPerson.sex); //undefined

        console.log(person.name); //zhangsan
        console.log(person.sex); //undefine

 

B.接受两个参数

        var person = {
            name: "Sun Menghua",
            friends: ['Liu', 'Wu']
        }
        var thePerson = Object.create(person, {
            name: {
                value: 'Qi Haiyang '
            },
            age: {
                value: '19 '
            }
        });
        console.log(thePerson.name); //Qi Haiyang
        //Object.create第二个参数的同名属性会覆盖原型对象上的同名属性;
        console.log(thePerson.age); //19
        var theotherPerson = Object.create(person);
        console.log(theotherPerson.name); //Sun Menghua
        console.log(theotherPerson.age); //undefined

        console.log(person.name); //Sun Menghua
        console.log(person.age); //undefined
        //Object.create第二个参数的属性是对象自己的属性,和其他对象不共享d

基于已有的对象创建新对象

posted @ 2018-04-19 10:46  sunmarvell  阅读(229)  评论(0编辑  收藏  举报