• JavaScript 原型链【转】


    view plaincopy to clipboardprint?
    <mce:script type="text/javascript"><!--  
    /* 
       每个对象实例都有个属性成员用于指向到它的instanceof 对象(暂称为父对象)的原型(prototype) 
       我们把这种层层指向父原型的关系称为[原型链 prototype chian] 
       原型也具有父原型,因为它往往也是一个对象实例,除非我们人为地去改变它 
       在JavaScript中,"一切都是对象,函数是第一型。" 
       Function和Object都是函数的实例。 
       Function的父原型指向到Function的原型,Function.prototype的父原型是Object的原型 
       Object的父原型也指向到Function的原型,Object.prototype是所有父原型的顶层 
       在spiderMonkey引擎中,父原型可以通过 __proto__ 进行访问 
    */ 
    Function.prototype.hi = function(){alert('hi Function');}  
    Object.prototype.hi = function(){alert('hi Object');}  
    var a = function(){  
        this.txt = "a";  
    }  
    a.prototype = {  
        say:function(){alert('a');}  
    }  
    alert(a instanceof Function);//a是Function的实例;  
    alert(a.__proto__ === Function.prototype);//a的父原型指向到Function的原型;  
    alert(Function instanceof Object);//Function是Object的实例;  
    alert(Function.__proto__ === Function.prototype);//Function的父原型指向到Function的原型;  
    alert(Function.prototype.__proto__ === Object.prototype);//Function的原型的父原型指向到Object的原型  
    alert(Object.__proto__ === Function.prototype);//Object的父原型指向到Function的原型;  
    alert(Object.prototype.__proto__);//Object的原型是所有父原型的顶端,它不再具有父原型;  
     
    alert(a.prototype instanceof Object);//a的原型也是一个对象  
    alert(a.prototype.__proto__ === Object.prototype);//a的原型的父原型指向Object的原型  
     
    var A = function(){};  
    A.prototype = new a();  
    A.prototype.say = function(){  
        alert('A');  
    }  
    alert(A instanceof Function);//A是Function的实例  
    alert(A.__proto__ === Function.prototype);//A的父原型指向到Function的原型  
    alert(A.prototype instanceof a);//A的原型是a的实例  
    alert(A.prototype.__proto__ === a.prototype);//A的原型的父原型指向到a的原型  
     
    var iA = new A();//iA是A的实例,iA.__proto__ === A.prototype  
    var iB = new a();//iB是a的实例,iB.__proto__ === a.prototype  
    iA.hi();  
    /* 
    iA本身没有hi方法(构造中没有,自己也没有定义过), 
    于是找iA.__proto__即A.prototype,也没有找到, 
    于是再找A.prototype.__proto__即a.prototype,仍然没有发现, 
    继续查找a.prototype.__proto__即Object.prototype,哇,发现了hi,于是调用它,停止查找 
    输出:hi Object 
    */ 
    iB.hi();  
    /* 
    iB本身没有hi方法(构造中没有,自己也没有定义过), 
    于是找iB.__proto__即a.prototype,仍然没有发现, 
    继续查找a.prototype.__proto__即Object.prototype,哇,发现了hi,于是调用它,停止查找 
    输出:hi Object 
    */ 
    a.hi();  
    /* 
    a本身没有hi方法(构造中没有,自己也没有定义过), 
    于是找a.__proto__既Function.prototype,哇,发现了hi,于是调用它,停止查找 
    输出:hi Function 
    */ 
    iA.say();  
    /* 
    iA本身没有say方法(构造中没有,自己也没有定义过), 
    于是找iA.__proto__即A.prototype,哇,发现了say,于是调用它,停止查找 
    所以,这里调用的是A.prototype.say 
    输出:A 
    */ 
    iB.say();  
    /* 
    iB本身没有say方法(构造中没有,自己也没有定义过), 
    于是找iB.__proto__即a.prototype,哇,发现了say,于是调用它,停止查找 
    所以,这里调用的是a.prototype.say 
    输出:a 
    */ 
    iA.bad();  
    /* 
    iA本身没有bad方法(构造中没有,自己也没有定义过), 
    于是找iA.__proto__即A.prototype,也没有找到, 
    于是再找A.prototype.__proto__即a.prototype,仍然没有发现, 
    继续查找a.prototype.__proto__即Object.prototype,终于是找不到了,停止查找 
    返回错误,iA.bad不是一个function 
    */ 
    // --></mce:script>  
    感谢simon提出的修正意见!所有实例在查找属性方法时不会去查找自己的prototype(实例的prototype不在原型链内,只能作为一个属性)!  
    </script> 
    <mce:script type="text/javascript"><!--
    /*
       每个对象实例都有个属性成员用于指向到它的instanceof 对象(暂称为父对象)的原型(prototype)
       我们把这种层层指向父原型的关系称为[原型链 prototype chian]
       原型也具有父原型,因为它往往也是一个对象实例,除非我们人为地去改变它
       在JavaScript中,"一切都是对象,函数是第一型。"
       Function和Object都是函数的实例。
       Function的父原型指向到Function的原型,Function.prototype的父原型是Object的原型
       Object的父原型也指向到Function的原型,Object.prototype是所有父原型的顶层
       在spiderMonkey引擎中,父原型可以通过 __proto__ 进行访问
    */
    Function.prototype.hi = function(){alert('hi Function');}
    Object.prototype.hi = function(){alert('hi Object');}
    var a = function(){
        this.txt = "a";
    }
    a.prototype = {
        say:function(){alert('a');}
    }
    alert(a instanceof Function);//a是Function的实例;
    alert(a.__proto__ === Function.prototype);//a的父原型指向到Function的原型;
    alert(Function instanceof Object);//Function是Object的实例;
    alert(Function.__proto__ === Function.prototype);//Function的父原型指向到Function的原型;
    alert(Function.prototype.__proto__ === Object.prototype);//Function的原型的父原型指向到Object的原型
    alert(Object.__proto__ === Function.prototype);//Object的父原型指向到Function的原型;
    alert(Object.prototype.__proto__);//Object的原型是所有父原型的顶端,它不再具有父原型;

    alert(a.prototype instanceof Object);//a的原型也是一个对象
    alert(a.prototype.__proto__ === Object.prototype);//a的原型的父原型指向Object的原型

    var A = function(){};
    A.prototype = new a();
    A.prototype.say = function(){
        alert('A');
    }
    alert(A instanceof Function);//A是Function的实例
    alert(A.__proto__ === Function.prototype);//A的父原型指向到Function的原型
    alert(A.prototype instanceof a);//A的原型是a的实例
    alert(A.prototype.__proto__ === a.prototype);//A的原型的父原型指向到a的原型

    var iA = new A();//iA是A的实例,iA.__proto__ === A.prototype
    var iB = new a();//iB是a的实例,iB.__proto__ === a.prototype
    iA.hi();
    /*
    iA本身没有hi方法(构造中没有,自己也没有定义过),
    于是找iA.__proto__即A.prototype,也没有找到,
    于是再找A.prototype.__proto__即a.prototype,仍然没有发现,
    继续查找a.prototype.__proto__即Object.prototype,哇,发现了hi,于是调用它,停止查找
    输出:hi Object
    */
    iB.hi();
    /*
    iB本身没有hi方法(构造中没有,自己也没有定义过),
    于是找iB.__proto__即a.prototype,仍然没有发现,
    继续查找a.prototype.__proto__即Object.prototype,哇,发现了hi,于是调用它,停止查找
    输出:hi Object
    */
    a.hi();
    /*
    a本身没有hi方法(构造中没有,自己也没有定义过),
    于是找a.__proto__既Function.prototype,哇,发现了hi,于是调用它,停止查找
    输出:hi Function
    */
    iA.say();
    /*
    iA本身没有say方法(构造中没有,自己也没有定义过),
    于是找iA.__proto__即A.prototype,哇,发现了say,于是调用它,停止查找
    所以,这里调用的是A.prototype.say
    输出:A
    */
    iB.say();
    /*
    iB本身没有say方法(构造中没有,自己也没有定义过),
    于是找iB.__proto__即a.prototype,哇,发现了say,于是调用它,停止查找
    所以,这里调用的是a.prototype.say
    输出:a
    */
    iA.bad();
    /*
    iA本身没有bad方法(构造中没有,自己也没有定义过),
    于是找iA.__proto__即A.prototype,也没有找到,
    于是再找A.prototype.__proto__即a.prototype,仍然没有发现,
    继续查找a.prototype.__proto__即Object.prototype,终于是找不到了,停止查找
    返回错误,iA.bad不是一个function
    */
    // --></mce:script>
    感谢simon提出的修正意见!所有实例在查找属性方法时不会去查找自己的prototype(实例的prototype不在原型链内,只能作为一个属性)!
    </script>

  • 相关阅读:
    音视频入门-06-代码画图时间
    音视频入门-05-RGB-TO-BMP使用开源库
    音视频入门-04-BMP图像四字节对齐的问题
    音视频入门-03-RGB转成BMP图片
    控制input文本框只能输入正整数(H5)
    微信小程序自定义导航栏配置(顶部栏搜索框)
    React-日历组件(原生JS代码)
    package.json文件详解
    解决HTML5IOS拍照上传图片逆时针旋转90度问题(React)
    项目细节
  • 原文地址:https://www.cnblogs.com/myssh/p/1682456.html
Copyright © 2020-2023  润新知