JavaScript中的承继和原型-JavaSript-爱易网页

JavaScript中的承继和原型

日期：2014-05-16　浏览次数：20685 次

JavaScript中的继承和原型

JavaScript是基于原型的面向对象语言，没有类的概念，我们先来说说原型prototype。

每个对象都有原型，原型是一种对象，修改对象的原型，可以影响所有由本对象派生的对象，但是如果仅仅修改本对象，并不会影响已经创建的实例的原型。因为每个对象和原型都有一个原型，对象的原型指向对象的父原型，而父原型又指向父原型的父原型，这种通过原型层层连接起来的关系称为原型链，这条链的末端一般总是默认的对象原型。

原型中读的是从原型链上读，写是往自己里面写。

<script type="text/javascript">            function load() {
                    function obj1() {//对象obj1
                    }
                    function obj2() {//对象obj2
                    }
                    obj2.prototype = new obj1(); //obj1赋值给obj2的原型
                    Object.prototype.foo = function () {
                            alert("object"); //Object对象foo函数弹出object
                    }
                    testobj = new obj2(); //obj2赋值给测试对象testobj
                    testobj.foo(); //执行测试对象的foo函数
                    obj1.prototype.foo = function () {
                            alert("obj1"); //对obj1的原型函数foo重新赋值
                    }
                    testobj.foo(); //在此执行测试对象的foo函数
            }
            window.onload = load;
</script>

运行结果：

结果分析：

我们先创建了对象obj1和obj2，把obj1的原型赋值给obj2，再Object的原型中添加函数foo显示‘Object’，再把obj2赋值给测试对象testobj，执行testobj中的foo，我们发现实际执行的是Object中的foo，为什么？因为读取的时候，一次从testobj---obj2---obj1---Object读取，直到Object方能读取到foo，所以说读是从原型链从浅入深读取。然后我们修改obj1的原型，使之也有foo函数，再次执行testobj的foo，我们发现实际执行的是obj1的foo，可见对obj1写foo的时候是直接写到自己的原型上的。如图：

继承是简单的复制

 <script type="text/javascript">            function load() {
                    var father = new Object();//创建父对象
                    var son = new Object();//创建子对象
                    father.name = function () {
                            alert('dad');//弹出dad
                    }
                    son.name = function () {
                            alert('son');//弹出son
                    }
                    son.name = father.name; //把父对象的姓名赋值给子对象
                    father.name = function () {
                            alert('new dad'); //覆写父对象姓名为new dad
                    }
                    father.name(); //弹出父对象的姓名
                    son.name();//弹出子对象的姓名
            }
            window.onload = load;//把load函数添加到页面加载上
    </script>

运行结果：

结果分析：

我们创建父对象father和子对象son，定义father的name为“dad”，son的name为“son”，再把father的name赋值给son，重新定义father的name为“new dad”。执行father的name，显示为“new dad”，这个在我们意料之中；而执行son的name却是“dad”而非“new dad”，可见继承属性，仅仅是复制父对象的属性，而不是引用。

用了两个简单的实例说明了一下javascript中的原型和继承，对于其更深层次的原型链和构造器，因为所学有限，等待以后的补充学习后继续讨论。

1楼liushuijinger昨天 18:55: 顶

免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。

JavaScript中的承继和原型

相关资料更多>

推荐阅读更多>