javascript---原型

Posted 2020-06-26

总结：

• Js所有的函数都有一个prototype属性，这个属性引用了一个对象，即原型对象，也简称原型。这个函数包括构造函数和普通函数，我们讲的更多是构造函数的原型，但是也不能否定普通函数也有原型

 

---

 

　　构造函数我们上一节课讲了，其实new之后，其内部会无形地也将原型属性和原型方法都赋值给实例对象，而且：记住，它们都是共享的，每一个同一个new出来的实例对象都是共享其原型的属性和方法。

原型:prototype

 1.基本

 1     function BOX(){}        //构造函数
 2     BOX.prototype.name=‘Lee‘;            //原型属性
 3     BOX.prototype.age=100;
 4     BOX.prototype.run=function(){            //原型方法
 5         return this.name+this.age+‘运行````‘;
 6     }
 7     
 8     var box1=new BOX();
 9     var box2=new BOX();
10     //alert(box1.run());

解答: 这里要提一下里面的函数，如果是实例方法，不同的实例化他们的方法地址不同，是唯一的；如果是原型方法，那么他们地址是共享的，大家是一样的。

    alert(box1.constructor)            //构造属性，可以获取构造函数本身
                                    //作用是被原型指针定位，然后得到构造函数本身
                                    //其实就是对象实例对应的原型对象的作用

 

 

---

 

2.原型模式的执行流程

1     function BOX(){}                    //构造函数
2     BOX.prototype.name=‘Lee‘;            //原型属性
3     BOX.prototype.age=100;
4     BOX.prototype.run=function(){            //原型方法
5         return this.name+this.age+‘运行````‘;
6     }
7     var box1=new BOX();
8     box1.name=‘jack‘;                //实例属性，并没有重写原型属性
9     alert(box1.name)                //就近原则

解答：毫无疑问，如果有实例属性则先访问实例属性/方法，没有则访问原型属性/方法。

 

---

 

3.判断一个对象实例是不是指向原型对象，基本上只要实例化了，就自动指向的

isPrototypeOf()

1     alert(BOX.prototype.isPrototypeOf(box1));
2     var obj=new Object();
3     alert(Object.prototype.isPrototypeOf(obj));            //true
4     alert(BOX.prototype.isPrototypeOf(obj));            //false

 

---

 

4.判断实例中是否有指定属性

hasOwnProperty()

 1     function BOX(){}                    //构造函数
 2     BOX.prototype.name=‘Lee‘;            //原型属性
 3     BOX.prototype.age=100;
 4     BOX.prototype.run=function(){            //原型方法
 5         return this.name+this.age+‘运行````‘;
 6     }
 7     var box1=new BOX();
 8     alert(box1.hasOwnProperty(‘name‘));                //false
 9     box1.name=‘jack‘;
10     alert(box1.hasOwnProperty(‘name‘));                //true

 

---

 

5.in操作符

    function BOX(){}                    //构造函数
    BOX.prototype.name=‘Lee‘;            //原型属性
    BOX.prototype.age=100;
    BOX.prototype.run=function(){            //原型方法
        return this.name+this.age+‘运行````‘;
    }
    var box1=new BOX();
    alert(‘name‘ in box1);                //只要实例属性或原型属性有就是true

解答：只要实例属性或者原型属性有就返回true

 

结合4和5:可以写出判断只有原型中有属性的方法

 1     function BOX(){}                    //构造函数
 2     BOX.prototype.name=‘Lee‘;            //原型属性
 3     BOX.prototype.age=100;
 4     BOX.prototype.run=function(){            //原型方法
 5         return this.name+this.age+‘运行````‘;
 6     }
 7     function isProprety(obj,proprety){
 8         return !obj.hasOwnProperty(proprety)&&(proprety in obj);
 9     }
10     var box1=new BOX();
11     alert(isProprety(box1,‘name‘));                //true
12     box1.name=‘‘;
13     alert(isProprety(box1,‘name‘));                //false

 

---

 

6.使用字面量创建原型对象属性和方法

 

原型对象这里{}，表示new Object(),所以它的原型对象构造属性box.constructor指向Object而没指向构造函数BOX

所以：

 1     function BOX(){}
 2     BOX.prototype={
 3         //这种写法相当于创建一个新对象,而新对象又有constructor属性，所以新对象的constructor重写了BOX原来的costructor,
 4         //但可以强制转回BOX
 5         constructor:BOX,
 6         name:‘LEE‘,
 7         age:100,
 8         run:function(){
 9             return this.name+this.age+‘运行````‘;
10         }
11     }
12     var box=new BOX();
13     //alert(box.run())
14     alert(box.constructor)                //function BOX(){}

解答：加了constructor：BOX，即将原型强行转回BOX。

注意：如果重写了原型对象，之前的原型对象会被覆盖。