zoukankan      html  css  js  c++  java
  • javascript高级知识点——函数原型

    代码信息来自于http://ejohn.org/apps/learn/。

    向函数的原型中添加方法

    function Ninja(){} 
     
    Ninja.prototype.swingSword = function(){ 
      return true; 
    }; 
     
    var ninjaB = new Ninja(); 
    console.log( ninjaB.swingSword(), "Method exists and is callable." );

    通过实例化对象可以访问,因为构造函数实例化的对象拥有__proto__属性这个属性的值是构造函数的原型,如果实例化对象本身没有这个方法,它自动去访问__proto__,所以可以调用原型里的方法。

    调用顺序

    function Ninja(){ 
      this.swingSword = function(){ 
        return true; 
      }; 
    } 
     
    // Should return false, but will be overridden 
    Ninja.prototype.swingSword = function(){ 
      return false; 
    }; 
     
    var ninja = new Ninja(); 
    console.log( ninja.swingSword(), "调用的是实例化对象方法,而非原型的" );

    这个例子可以很好的说明调用顺序:先访问实例化对象自身,如果没有才访问其函数原型中的。

    原型的改变影响所有继承它的实例化对象

    function Ninja(){ 
      this.swung = true; 
    } 
     
    var ninjaA = new Ninja(); 
    var ninjaB = new Ninja(); 
     
    Ninja.prototype.swingSword = function(){ 
      return this.swung; 
    }; 
     
    console.log( ninjaA.swingSword(), "即使在定义之后,方法仍然存在" ); 
    console.log( ninjaB.swingSword(), "同样的情况" );

    正如先前所说,实例化对象本身没有的属性,它就去函数的原型里寻找。如果原型修改,它寻找的结果也不一样。

    问题:构建可以链式调用的方法

    function Ninja(){ 
      this.swung = true; 
    } 
     
    var ninjaA = new Ninja(); 
    var ninjaB = new Ninja(); 
     
    //在原型里增加一个方法,返回调用者,并修改swung的值
     
    console.log( ninjaA.swing().swung ); 
    console.log( ninjaB.swing().swung );

    通过返回this实现

    function Ninja(){ 
      this.swung = true; 
    } 
     
    var ninjaA = new Ninja(); 
     
    Ninja.prototype.swing= function(){
        this.swung = false;
        return this;
    } 
    console.log( ninjaA.swing().swung ); 

    this指向调用它的对象,在方法中返回this,函数执行完毕时,仍然是调用它的对象。

  • 相关阅读:
    HashCode和equal方法的区别和联系 [转]
    Linux makefile 教程 [转]
    gcc: multiple definition of [转]
    conda虚拟环默认路径
    terrasolid修改背景颜色
    台式机无法开机可能的原因
    TensorFlow2.1中计算平方函数的tf.square()的用法
    Terrasolid 安装教程
    如何解决Pytorch的GPU driver is too old的问题?
    使用 TensorBoard 可视化进行监督
  • 原文地址:https://www.cnblogs.com/winderby/p/4073948.html
Copyright © 2011-2022 走看看