Javascript 追本溯源

       一直以来对Javascript的继承关系都是通过死记硬背下来的，对于一个理科生，喜欢逻辑思维的人来讲，死记硬背特别头痛，且理科生对于能够死记硬背下来的东西也很容易忘记，不知道其他理科生童鞋们是否如此，长时间发现，我是这样的，喜欢逻辑性的东西， 不太喜欢死记硬背。最近看过篇文章《Javascript继承机制的设计思想》（原文地址），

　　原文写的很好，当中讲了Javascript的继承产生思路。

       如下列举一下表过程：

1.1994年，网景公司（Netscape）发布了Navigator浏览器0.9版，可以浏览网页了（无前段交互，无网页互动）。

2.工程师Brendan Eich负责开发这种新语言（使得浏览器可以与网页互动的网页页脚本语言）

3.在其他面向对象的语言的影响下，设计了继承机制（为了降低难度，没有引入“类”的概念，使用了概念有：构造器constructor,new）

4.为做好数据共享，增加了prototype。

 

说说继承，为了学习继承，编写了如下脚本

 

javascript中的数据继承是通过_proto_ chain来实现的

javascript中继承机制的实现：

“JavaScript中的原型(prototype)是和函数(function)紧密相连的，因为每个函数默认都会有一个属性叫prototype, 每一个通过函数和new操作符生成的对象都具有一个属性__proto__, 这个属性保存了创建它的构造函数的prototype属性的引用。这个__proto__对象就是实现原型链的核心对象。JavaScript是一门面向对象的编程语言，它的继承特性其实就是通过原型链机制来实现的。同时，instanceof运算符也需要在原型链的支持。”

写了一段代码如下：

<script>

        function Person(name){

            this.name = namel;

        }



        alert(Person instanceof Object);//true  



        //方式一

        Person.prototype.species = "ABC";

        Person.prototype.DoHardWork = function () {

            alert(this.species);

        }

        //方式二：两种方式等价，但有区别

        Person.prototype = {

            species: "ABC",

            DoHardWork: function () { alert(this.species) }

        };//相当于 Person.prototype  = new Object({……})；所以，Person.prototype.constructor === Object;

        Person.prototype.constructor = Person;//有利溯源查看Person这个原型，



        var father = new Person("张三");//father 中有 __propotype__属性，指向了Person.prototype；

        var uncle = new person("张四");



        var Son = function (name) { this.name = name; };



        Son.prototype = father;

        son.prototype.constructor = Son;



        var son1 = new Son("张小三");//son1中__propotype__指向了father,father 中有 __propotype__属性，指向了Person.prototype；

        /*

        查看Son： son1.constructor;

        查看Person:son1.constructor.prototype.constructor,//如果没有 Person.prototype.constructor = Person;这句话，就不能获取到Person





        通过new生成的对象的Constructor找构造对象，通过构造对象（也是函数）获取继承的Prototype对象，通过Prototype对象的Constructor获取原函数。

        */

    </script>