资讯专栏INFORMATION COLUMN

class 与 原型链 解析

novo / 2057人阅读

摘要:一相当于拿实例对象的名字来给原型命名。不专业点说的实例函数为匿名函数,而中,构造函数即原型链展示的原型为匿名函数。关系图不通过创造,不通过各种情况扰乱的情况下分析为原型属性,展示构造函数,比如上面举例的某同学的妈妈构造函数。

这篇文章只是我个人的见解,因为也是今年刚毕业,所以理解不一定非常的准确,如果理解有误希望大家告诉我。

一、class 相当于 拿实例对象的名字 来给 原型 命名。

为什么这么说呢。

先说说 es6中的用法 :

 class testClass{
      constructor(name,age){
            this.name = name;
            this.age = age;
        }
        printFn() {
            console.log(this.age);
        }
    }
    new testClass("hello",18).printFn()//18

这个类用 es5怎么写呢:

function testProto(name,age) {
    this.name = name;
    this.age = age;
   }
   testProto.prototype.printFn = function(){
    console.log(this.age);
   }
   new testProto("hello",18).printFn();
   

其实写法上是差不太多的。

不专业点说:class的实例函数(constructor)为匿名函数,而es5中,构造函数(即原型链prototype展示的原型)为匿名函数。
class例子中,class是有名字的 —— testClass,每个类的constructor唯一,就像每本书的目录 是唯一的,那么翻书的时候,正常说法就是打开 某本书的目录,而不用特意去给目录命名。

es5例子中,实例函数的名字是唯一的 —— testProto,他的构造对象,就是,他的原型链对象,testProto.prototype。这就像老师找学生家长聊天一样,一般老师都会说,让某同学(testProto)的妈妈(prototype)过来一下,某同学的名字已知,那么他的妈妈也就确定了。当实例化的时候(new testProto()),这个对象的名字就是以某同学的名字命名的。

prototype,constructor,__proto__关系图(不通过create创造,不通过各种情况扰乱的情况下分析);
prototype为原型属性,展示构造函数,比如上面举例的某同学的妈妈(构造函数)。某同学就是他妈妈生(实例)的对象。这个用类的思想比较好理解,我们平时调用的方法,其实都是一个原型的实例化(constructor)。
实例化对象之后,属性会存在于对象的__proto__中,当调用一个属性的时候,如果这个对象中没有,就回去他的__proto__中查找。
举个例子:

        
    function test1() {console.log("test1")};
    test1.prototype.test2 = function(){console.log(0)};
    new test1().__proto__ .test2 == new test1().test2//true;
    
    new test1()实例化之后的结构大概如下:
    test1 {
             __proto__:{
                          construtor:function(){console.log("test1")},
                          test2: function(){console.log(0)}
                        }
           }
    construtor会被立即执行
    所以 控制台会分别打印出  test1 ;test1 ;true;第一个test1 是执行new test1().__proto__ .test2这句话时候打印出来的,第二个test1是执行这句话new test1().test2的时候打印出来的。
    new test1().constructor == test1//true;
    new test1().__proto__.constructor == test1  //true;
    这句话可以证明“我们平时调用的方法,其实都是一个原型的实例化(constructor)。实例化对象之后,属性会存在于对象的__proto__中,当调用一个属性的时候,如果这个对象中没有,就回去他的__proto__中查找。”


文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/90796.html

相关文章

  • 独家解析Javascript原型继承

    摘要:面向对象实现代码动物发声汪汪喵喵调用代码动物发声喵喵动物发声汪汪当要增加一种动物时,只需增加一个继承,不会影响其他已有的动物逻辑。所以的继承和的原型继承,可谓殊途同归。 传统面向对象的继承和多态 我们知道C++/Java/C#等面向对象语言,都原生地支持类的继承。继承的核心作用大抵是创建一个派生类,并使其复用基本类(即父类)的字段和/或方法。并且派生类可以重写基本类的方法。这样基本类和...

    verano 评论0 收藏0
  • 【Step-By-Step】高频面试题深入解析 / 周刊06

    摘要:实例拥有构造函数属性,该属性返回创建实例对象的构造函数。在考虑对象而不是自定义类型和构造函数的情况下,寄生式继承也是一种有用的模式。在子类的构造函数中,只有调用之后,才能使用关键字,否则报错。 不积跬步无以至千里。 关于【Step-By-Step】 Step-By-Step (点击进入项目) 是我于 2019-05-20 开始的一个项目,每个工作日发布一道面试题。每个周末我会仔细阅读...

    LiuRhoRamen 评论0 收藏0
  • 「译文」JavaScript核心

    摘要:在这个情况下我们可能需要使用构造函数,其以指定的模式来创造对象。构造函数也有自己的,值为,也通过其属性关联到。从逻辑上来说,这是以栈的形式实现的,它叫作执行上下文栈。 原文:http://dmitrysoshnikov.com/ecmascript/javascript-the-core/ 对象 原型链 构造函数 执行上下文栈 执行上下文 变量对象 活动对象 作用域链 闭包 Thi...

    高璐 评论0 收藏0

发表评论

0条评论

novo

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<