博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
js 继承
阅读量:6317 次
发布时间:2019-06-22

本文共 3432 字,大约阅读时间需要 11 分钟。

1.对象继承

(1)把父亲对象赋值给孩子对象的原型

//要继承的对象var parent = {name:'Lily',age:23};//新对象var child = object(parent);function object(P){    function F(){}    F.prototype = P;    return new F();}console.log(child.name);//Lily

(2) 使用ES5的Object.create(object,propertiesObject)方法代替上面的object函数

//要继承的对象var parent = {name:'Lily',age:23};//新对象var child = Object.create(parent);console.log(child.name);//Lily

(3)把父亲对象的属性复制给子对象

a.浅拷贝

//浅拷贝函数function extend(parent,child){    var i;    child = child || {};    for(i in parent){        if(parent.hasOwnProperty(i)){            child[i] = parent[i];        }    }    return child;}var parent = {name:'Lily',info:{age:23}};var child = extend(parent);console.log(child.info.age);//23child.info.age = 30;console.log(child.info.age);//30console.log(parent.info.age);//30

b.深拷贝

//深拷贝函数        function deepExtend(parent,child){            var i,                toStr = Object.prototype.toString,                asStr = "[object Array]";            child = child || {};            for(i in parent){                if(parent.hasOwnProperty(i)){                    if(typeof parent[i] === 'object'){                        child[i] = (toStr.call(parent[i]) === asStr) ? [] : {};                        deepExtend(parent[i],child[i]);                    }else{                        child[i] = parent[i];                    }                }            }            return child;        }        var parent = {name:'Lily',info:{age:23}};        var child = deepExtend(parent);        console.log(child)        console.log(child.info.age);//23        child.info.age = 30;        console.log(child.info.age);//30        console.log(parent.info.age);//23

 (4)借助方法

     var parent = {            name: 'Lily',            age: 23        };        var child = {            getInfo: function(){                console.log('name:'+this.name+';age:'+this.age);//name:Lily;age:23            }        }        child.getInfo.apply(parent);

 2.类式继承

(1)子对象的原型指向new的父对象

此方式只是通过原型链继承new出来的对象,子对象自己不能拥有和父函数一样的属性。

function Parent(){            this.name = 'Lily';            this.age = 23;        }        function Child(){        }        Child.prototype = new Parent();        var child = new Child();        console.log(child.name);//Lily

(2)使用构造函数

子对象只是拥有父函数的属性,而不能继承父函数的原型。

     function Parent(){            this.name = 'Lily';            this.age = 23;        }        function Child(){            Parent.apply(this);        }        var child = new Child();        console.log(child.name);//Lily

(3)把上面的(1)和(2)结合使用

子对象自己拥有父函数的属性,同时也会继承父函数的原型,但是从父函数直接继承过来的自己的属性与new的父对象的属性重合。

     function Parent(){            this.name = 'Lily';            this.age = 23;        }        Parent.prototype.run = function(){            console.log('running');        }        function Child(){            Parent.apply(this);        }        Child.prototype = new Parent();        var child = new Child();        console.log(child.name);//Lily        child.run();//running

(4)把Parent的原型赋值给Child的原型

     function Parent(){            this.name = 'Lily';            this.age = 23;        }        Parent.prototype.run = function(){            console.log('running');        }        function Child(){            Parent.apply(this);        }        Child.prototype = Parent.prototype;        var child = new Child();        console.log(child.name);//Lily        child.run();//running

 

 

 

 

[1]javascript模式

转载于:https://www.cnblogs.com/fe-huahai/p/5656864.html

你可能感兴趣的文章
机器学习:用初等数学解读逻辑回归
查看>>
C语言OJ项目参考(2493)四则运算
查看>>
find和xargs
查看>>
数据结构例程—— 交换排序之快速排序
查看>>
IOS定位服务的应用
查看>>
php引用(&)
查看>>
Delphi 操作Flash D7~XE10都有 导入Activex控件 shockwave
查看>>
oracle 学习笔记之名词解释
查看>>
MySQL Cluster搭建与测试
查看>>
python数据分析画图体验
查看>>
军规15 确保集成和调用第三方APP
查看>>
Etcd和ZooKeeper,究竟谁在watch的功能表现更好?
查看>>
Shredding Company 碎纸机,dfs()枚举每一种情况,再加剪枝。
查看>>
命名空间和模块化编程 - C++快速入门39
查看>>
结构化程序设计03 - 零基础入门学习Delphi12
查看>>
D2007在64位Win7出现 delphi 2007 assertion failure thread32.cpp 的解决办法
查看>>
STM32的TAMPER-RTC管脚作为Tamper的使用[转]
查看>>
[记]一个逐步“优化”的范例程序
查看>>
2012-01-09_2
查看>>
数学 - 线性代数导论 - #5 矩阵变换之置换与转置
查看>>