zoukankan      html  css  js  c++  java
  • 浅析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

  • 相关阅读:
    TensorFlow学习笔记之四——源码分析之基本操作
    TensorFlow学习笔记之三——适合入门的一些资源
    AW286 选课(背包类树形DP)
    AW303 运输小猫
    AW302 任务安排3
    AW301 任务安排2 (斜率优化DP)
    AW300 任务安排1
    AW311 月之谜
    AW310 启示录
    AW292 炮兵阵地
  • 原文地址:https://www.cnblogs.com/zqllove/p/5237971.html
Copyright © 2011-2022 走看看