浅析JavaScript的prototype

一、JavaScript对象的创建

（1）对象方法

        function Student(name){
            this.name=name;
            this.showName=function(){
                alert("my name is "+this.name);

            };
        }

调用showName方法：

new Student('a').showName();

对象方法的调用，类要生成一个实例，该实例可以调用该方法；

（2）类方法

        Student.showAge=function(){
            alert('age is 20');
        }

调用方式：

Student.showAge();

类方法相当于C#的静态方法，不需要new一个对象实例，可以直接调用；

（3）继承方法

        Student.prototype.sayHello=function Hello(){
            alert('hello');            
        }

调用方法：

new Student('a').sayHello();

原型方法一般用与继承父类的方法和方法共享；

（4）对象的字面量方式创建

        var p2={
            age:21,
            name:'jack',
            sayAge:function(){
                alert(this.age);
            }
        }

调用方法

p2.sayAge();

二、prototype的用法

（1）创建一个基类对象

        function baseClass(){
                this.name='jack';
                this.showMsg=function(){
                    alert('base');
                };
        }

（2）创建一个新的对象

function extendClass(){
            this.age=20;
        }

（3）新对象引用原型对象

extendClass.prototype=new baseClass();

（4）查看新对象

在此，我们可以看到extendClass继承了baseClass的属性和方法，在extendClass对象中可以调用baseClass的对象和方法；

三、调用原型对象中的方法；

如果当原型对象和本对象均有同名的方法和属性时，调用时会先调用本对象的方法和属性；

（1）原型对象

        function baseClass(){
                this.name='jack';
                this.showMsg=function(){
                    alert('base');
                };
        }

（2）新对象

        function extendClass(){
            this.age=20;
            this.name='rose';
            this.showMsg=function(){
                alert('extend');
            }
        }

（3）新对象继承原型对象

extendClass.prototype=new baseClass();

（4）调用对象的方法

通过结果我们可以看到，当新对象和原型对象都有同一个属性和方法时，会调用本对象的方法和属性，那么我们该如何调用原型对象的方法和属性呢

4.1  使用__proto__来调用

4.2 使用call来调用

new baseClass().showMsg.call(new extendClass())

将extendClass对象当做bassClass对象，来调用baseClass的对象方法

（5）call和apply的使用和区别

5.1 call和apply主要是用来改变函数运行时的上下文，他俩功能一致；但在参数传递时：call传递参数个数任意，apply传递参数是数组形式；

5.2 call和apply的运用

基础方法

        function Dog(name){
            this.name='dog';
            this.showName=function(){
                alert("name1:"+this.name);
            }
        }

新的对象

        function Fish(){
            this.name='fish';
        }

当Fish对象想要调用showName方法时，可用使用apply，或者call

              var dog=new Dog();
        var fish=new Fish();
        dog.showName.call(fish)
        dog.showName.apply(fish,[])    

 

四、小结

1、JavaScript是基于原型的语言，只有对象。

2、原型对象作为模板，新对象从中获得原始属性；任何对象都可以作为另一个对象的原型，从而允许后者共享前者的属性；

3、当向构造器函数的原型对象中添加新的属性，该属性将添加到从这个原型中继承属性的所有对象中。

五、参考链接

1、http://www.cnblogs.com/yjf512/archive/2011/06/03/2071914.html

2、http://bbs.csdn.net/topics/390775296