• 爱情文章
  • 亲情文章
  • 友情文章
  • 生活随笔
  • 校园文章
  • 经典文章
  • 人生哲理
  • 励志文章
  • 搞笑文章
  • 心情日记
  • 英语文章
  • 范文大全
  • 作文大全
  • 新闻阅读
  • 当前位置: 山茶花美文网 > 英语文章 > 正文

    js面向原型的_前端开发必须知道的JS(一),原型和继承

    时间:2018-08-11来源:山茶花美文网 本文已影响 山茶花美文网手机站

    原型和闭包是Js语言的难点,此文主要讲原型及原型实现的继承,在(二)中会讲下闭包,希望对大家有所帮助。若有疑问或不正之处,欢迎提出指正和讨论。

    一、原型与构造函数

    Js所有的函数都有一个prototype属性,这个属性引用了一个对象,即原型对象,也简称原型。这个函数包括构造函数和普通函数,我们讲的更多是构造函数的原型,但是也不能否定普通函数也有原型。譬如普通函数:

    以下为引用的内容:

    function F(){
    ;
    }
    alert(F.prototype instanceof Object) //true

    构造函数,也即构造对象。首先了解下通过构造函数实例化对象的过程。

    以下为引用的内容:

    function A(x){
    this.x=
    x;
    }
    var obj=new A(1);

    实例化obj对象有三步:

    1. 创建obj对象:obj=new Object();

    2. 将obj的内部__proto__指向构造他的函数A的prototype,同时,obj.constructor===A.prototype.constructor(这个是永远成立的,即使A.prototype不再指向原来的A原型,也就是说:类的实例对象的constructor属性永远指向"构造函数"的prototype.constructor),从而使得obj.constructor.prototype指向A.prototype(obj.constructor.prototype===A.prototype,当A.prototype改变时则不成立,下文有遇到)。obj.constructor.prototype与的内部_proto_是两码事,实例化对象时用的是_proto_,obj是没有prototype属性的,但是有内部的__proto__,通过__proto__来取得原型链上的原型属性和原型方法,FireFox公开了__proto__,可以在FireFox中alert(obj.__proto__);

    3. 将obj作为this去调用构造函数A,从而设置成员(即对象属性和对象方法)并初始化。

    当这3步完成,这个obj对象就与构造函数A再无联系,这个时候即使构造函数A再加任何成员,都不再影响已经实例化的obj对象了。此时,obj对象具有了x属性,同时具有了构造函数A的原型对象的所有成员,当然,此时该原型对象是没有成员的。

    原型对象初始是空的,也就是没有一个成员(即原型属性和原型方法)。可以通过如下方法验证原型对象具有多少成员。

    以下为引用的内容:

    var num=0;
    for(o in
    A.prototype) {
    alert(o);//alert出原型属性名字

    num++;
    }
    alert("member: " + num);//alert出原型所有成员个数。

    但是,一旦定义了原型属性或原型方法,则所有通过该构造函数实例化出来的所有对象,都继承了这些原型属性和原型方法,这是通过内部的_proto_链来实现的。

    譬如

    A.prototype.say=function(){alert("Hi")};

    那所有的A的对象都具有了say方法,这个原型对象的say方法是唯一的副本给大家共享的,而不是每一个对象都有关于say方法的一个副本。

    二. 原型与继承

    首先,看个简单的继承实现。

    以下为引用的内容:

    1 function A(x){
    2
    this.x=x;
    3

    4  function B(x,y){
    5
    this.tmpObj=A;
    6
    this.tmpObj(x);
    7
    delete this.tmpObj;
    8
    this.y=y;
    9
    }
    • js面向原型的_前端开发必须知道的JS(一),原型和继承 相关文章:
    • 爱情文章
    • 亲情文章
    • 友情文章
    • 随笔
    • 哲理
    • 励志
    • 范文大全