js的原型

一、普通对象和函数对象

        var o1 = {};                    //普通对象
        var o2 = new Object();
        var o3 = new f1();

        function f1(){};               //函数对象
        var f2 = function(){};
        var f3 = new Function();

        console.log(typeof(o1));        //object
        console.log(typeof(o2));        //object
        console.log(typeof(o3));        //object

        console.log(typeof(f1));        //function
        console.log(typeof(f2));        //function
        console.log(typeof(f3));        //function
总结:new Function() 创建的对象都是函数对象,其他都是普通对象。

二、构造函数

        function Person(name,age,job){
            this.name = name;
            this.age = age;
            this.job = job;
            this.sayName = function(){alert(this.name)};
        }
        var person1 = new Person("jhon",30,"teacher");
        var person2 = new Person("kity",23,"doctor");

        console.log(person1.constructor == Person);     //true
        console.log(person2.constructor == Person);     //true
总结:person1和person2都是构造函数Person的实例;实例中的构造函数属性(constructor)指向构造函数person。

三、原型对象

1.Person:构造函数
2.person1和person2:实例
3.prototype:原型对象(只有函数对象有,除了函数对象Function.prototype)
4.proto:内置对象(每个对象都有)
5.Person.prototype:构造函数的原型对象,即Person 创建的时候,创建了一个它的实例对象并赋值给它的 prototype,它是构造函数Person的特殊实例。
6.person1.__proto__:实例的内置对象
7.关系:

(1) person1.constructor == Person
        function Person(name,age,job){
            this.name = name;
            this.age = age;
            this.job = job;
            this.sayName = function(){alert(this.name)};
        }
        var person1 = new Person("jhon",30,"teacher");

        console.log(person1.constructor == Person);        //true

总结:实例(person1)中有一个构造函数(constructor )属性,指向构造函数(Person)。

(2) Person.prototype.constructor == Person
         function Person(name,age,job){
            this.name = name;
            this.age = age;
            this.job = job;
            this.sayName = function(){alert(this.name)};
        }
        console.log(Person.prototype.constructor == Person);          //true

总结:构造函数的原型对象(Person.prototype)中有一个构造函数(constructor )属性,指向构造函数(Person)。

(3) person1.__proto__ == Person.prototype
         function Person(name,age,job){
            this.name = name;
            this.age = age;
            this.job = job;
            this.sayName = function(){alert(this.name)};
        }
        console.log(person1.__proto__ == Person.prototype);          //true

总结:对象 person1 有一个 __proto__属性,创建它的构造函数是 Person,所有对象的 proto 都指向其构造器的 prototype,构造函数的内置对象是 Person.prototype 。

四、函数对象

1.所有函数的__proto__都指向Function.prototype

        function Person(name,age,job){
            this.name = name;
            this.age = age;
            this.job = job;
            this.sayName = function(){alert(this.name)};
        }
        
        console.log(Person.__proto__ == Function.prototype);        //true
        console.log(Array.__proto__ == Function.prototype);         //true
        console.log(Date.__proto__ == Function.prototype);          //true
        console.log(Number.__proto__ == Function.prototype);        //true
        console.log(String.__proto__ == Function.prototype);        //true
        console.log(Object.__proto__ == Function.prototype);        //true
        console.log(Boolean.__proto__ == Function.prototype);       //true
        console.log(Function.__proto__ == Function.prototype);      //true

2.Math和JSON是以对象形式存在的,不需要new,所以他们的__proto__是指向Object.prototype

        console.log(Math.__proto__ == Object.prototype);        //true
        console.log(JSON.__proto__ == Object.prototype);        //true

3.说明:所有的构造器都来源于Function.prototype,包括Object.prototype和Function.prototype本身(参考1的代码)
4.原型对象其实就是普通对象,但 Function.prototype 除外,它是函数对象,但它很特殊,他没有prototype属性

       function Person(name,age,job){
            this.name = name;
            this.age = age;
            this.job = job;
            this.sayName = function(){alert(this.name)};
        }
        
        console.log(typeof(Person.prototype));          //Object
        console.log(typeof(Array.prototype));           //Object
        console.log(typeof(Date.prototype));            //Object
        console.log(typeof(Number.prototype));          //Object
        console.log(typeof(String.prototype));          //Object
        console.log(typeof(Object.prototype));          //Object
        console.log(typeof(Boolean.prototype));         //Object
        console.log(typeof(Function.prototype));        //function

        console.log(typeof(Function.prototype.prototype));      //undefined

5.
关系.png

你可能感兴趣的:(js的原型)