淺析JavaScript的prototype

1、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();

2、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的對象和方法；

3、調用原型對象中的方法；

若是當原型對象和本對象均有同名的方法和屬性時，調用時會先調用本對象的方法和屬性；

（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,[])    

 

4、小結

一、JavaScript是基於原型的語言，只有對象。

二、原型對象做爲模板，新對象從中得到原始屬性；任何對象均可以做爲另外一個對象的原型，從而容許後者共享前者的屬性；

三、當向構造器函數的原型對象中添加新的屬性，該屬性將添加到從這個原型中繼承屬性的全部對象中。

5、參考連接

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

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