js里面的类 原型 原型链

**类:**就是浏览器给的分类;例如:string  number  function  boolean  object ……

**原型:**

    **1.什么是原型?**

        在js中,万物皆是对象;任何对象都会有自己的方法和属性;每一个对象都会有一个与它相关联的对象,叫原型对象。原型对象是由对象的内置属性_proto_指向它的构造函数的prototype指向的对象,prototype就是通过调用构造函数而创建的那个对象实例的原型对象。所以任何对象都是由一个构造函数创建的,但是不是每一个对象都有prototype,只有方法才有prototype。

        function obj() {}

        var p = new obj();

        //方法才有prototype,普通对象无prototype

        console.log(obj.prototype); // Object{} 

        console.log(p.prototype); // undifined

        //任何对象都是有构造函数的,obj这种方法的构造函数是Function。

        //备注:constructor很容易被改变,一般不用它,此处只是打印下列对象的构造函数是什么。

        console.log(p.constructor); //function obj(){}  

        console.log(obj.constructor); //function Function(){} 

        console.log({}.constructor); // function Object(){}

        console.log(Object.constructor); // function Function() {}

        什么是构造函数??

        function是普通函数,new出来的对象就是构造函数。

    **2.怎么创建对象?**

        **1)声明**

            首先,声明一个function,为这个方法添加一个prototype属性,指向原型对象。并且prototype的constructor属性也会指向这个方法的对象。

            function a() {}

            console.log(a.prototype); // Object {} -- > 内部的constructor 指向a方法

            console.log(a.prototype.constructor); // function a(){}

        **2)用a创建一个对象b,看这个对象的属性**

            console.log(b.constructor); // function b(){}

            console.log(Object.getPrototypeOf(b)==b.prototype); // true  getPrototypeOf是获取_proto_

            ****new出来的对象,它的constructor指向了方法对象,它的_proto_和prototype是相等的*

            *所以,new出来的对象,它的_proto_属性指向了方法的prototype属性,并且constructor指向了prototype的constructor属性。****

        **3)创建一个对象**

            function heoo(name) {

                this.name = name;

            }

            var h = new heoo("滚蛋!死渣男");

            //伪代码:

            function newHeoo(name){

                 var obj = {};

                 obj.__proto__ = heoo.prototype; 

                 obj.constructor = heoo.prototype.constructor;

                 var result = heoo.call(obj, name);

                 return typeof result==='object'&& result!=null ? result : obj;  //当无返回对象或默认时返回obj。

            }

            var hb = newHeoo("滚蛋!死渣男");

            console.log(hb);

            console.log(h);

            //虽然hb!=h,但是可以看到这个hb就和h的结构一样了。

            ***过程就是:先创建一个空对象,设置一个_proto_指向方法的原型,然后设置constructor,最后用新的对象做this指向方法,返回新对象。***

**原型链:**

    **1.什么是原型链?**

        原型链就是原型自定义类的继承。原型链的核心是依赖对象的_proto_指向,当自身不存在此属性时,就挖出创建对象的构造函数,直到object,就没有_proto_的指向了。

    **2.原型链分析**

        _proto_的实质找的是prototype,所以只要找到构造函数的prototype;其次Object.prototype是没有_proto_属性的,Object.prototype==null。

        function a(name){

            this.name = name;

     }

     var b = new a();

     //b ---> a.prototype --->Object.prototype---->null

     原则:

     访问一个对象成员的时候,会先在自身找有没有此对象,如果找到就直接使用;如果没找到,就去原型链指向的对象的构造函数的prototype中找,找到直接使用,没找到就返回undifined或直接报错。

        //原型继承的案例

        function a(name, age) {

            this.name = name;

            this.age = age;

        }

        //1.直接替换原型对象 

        var parent = {

            sad : function() {

                console.log("替换原型对象");

            }

        }

        a.prototype = parent;

        var p = new a("张三", 12);

        p.sad();

        //2.混入式原型继承

        console.log(".............混入式原型继承..............");

        function Student(name, age) {

            this.name = name;

            this.age = age;

        }

        var parent2 = {

            sad : function() {

                console.log("原型继承混入式加载成员");

            }

        }

        for ( var i in parent2) {

            Student.prototype[k] = parent2[i];

        }

        var p = new Student("张三", 50);

        p.sad();

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。