美文网首页
javascript高级-02

javascript高级-02

作者: 路人_Ding | 来源:发表于2018-08-15 21:38 被阅读0次

    一、原型及原型链

    function Person(name,age) {
      //属性
      this.name=name;
      this.age=age;
      //在构造函数中的方法
      this.eat=function () {
        console.log("吃好吃的");
      };
    }
    //添加共享的属性
    Person.prototype.sex="男";
    //添加共享的方法
    Person.prototype.sayHi=function () {
      console.log("您好啊,怎么这么帅,就是这么帅");
    };
    //实例化对象,并初始化
    var per=new Person("小明",20);
    per.sayHi();
    //如果想要使用一些属性和方法,并且属性的值在每个对象中都是一样的,方法在每个对象中的操作也都是一样,那么,为了共享数据,节省内存空间,是可以把属性和方法通过原型的方式进行赋值
    
    console.dir(per);//实例对象的结构
    console.dir(Person);//构造函数的结构
    
    //实例对象的原型__proto__和构造函数的原型prototype指向是相同的
    
    //实例对象中的__proto__原型指向的是构造函数中的原型prototype
    console.log(per.__proto__==Person.prototype);
    //实例对象中__proto__是原型,浏览器使用的
    //构造函数中的prototype是原型,程序员使用的
    
    //原型链:是一种关系,实例对象和原型对象之间的关系,关系是通过原型(__proto__)来联系的
    

    二、原型的指向是可以改变的

    //人的构造函数
    function Person(age) {
      this.age=10;
    }
    //人的原型对象方法
    Person.prototype.eat=function () {
      console.log("人的吃");
    };
    //学生的构造函数
    function Student() {
    
    }
    Student.prototype.sayHi=function () {
      console.log("嗨,小苏你好帅哦");
    };
    //学生的原型,指向了一个人的实例对象
    Student.prototype=new Person(10);
    var stu=new Student();
    stu.eat();
    stu.sayHi();
    
    //原型指向可以改变
    //实例对象的原型__proto__指向的是该对象所在的构造函数的原型对象
    //构造函数的原型对象(prototype)指向如果改变了,实例对象的原型(__proto__)指向也会发生改变
    
    //原型的指向是可以改变的
    //实例对象和原型对象之间的关系是通过__proto__原型来联系起来的,这个关系就是原型链
    

    原型最终指向了哪里?

    //实例对象中有__proto__原型
    //构造函数中有prototype原型
    //prototype是对象
    //所以,prototype这个对象中也有__proto__,那么指向了哪里
    //实例对象中的__proto__指向的是构造函数的prototype
    //所以,prototype这个对象中__proto__指向的应该是某个构造函数的原型prototype
    

    三、函数中的this的指向

    /*
     *
     * 函数中的this的指向
     *
     *
     * 普通函数中的this是谁?-----window
     * 对象.方法中的this是谁?----当前的实例对象
     * 定时器方法中的this是谁?----window
     * 构造函数中的this是谁?-----实例对象
     * 原型对象方法中的this是谁?---实例对象
     *
     *
     * */
    

    相关文章

      网友评论

          本文标题:javascript高级-02

          本文链接:https://www.haomeiwen.com/subject/uprgbftx.html