Javascript原型与原型链实例分析

这篇“Javascript原型与原型链实例分析”文章的知识点大部分人都不太理解，所以小编给大家总结了以下内容，内容详细，步骤清晰，具有一定的借鉴价值，希望大家阅读完这篇文章能有所收获，下面我们一起来看看这篇“Javascript原型与原型链实例分析”文章吧。那么我们就从对象这一概念开始说起，其实对象这一概念相信大家并不陌生。有一种说法是“javasrcript 中万物皆是对象”，其实这个说法是错误的，一个很简单的例子，javasript中简单基本类型（string、boolean、number、null、undefined、symbol）本身就不是对象。其实javasript中对象主要分为函数对象和普通对象。其中:StringNumberBooleanObjectFunctionArrayDateRegExpError这些都是函数对象，他们同时也被称为内置对象。函数对象本身其实就是一个纯函数，javascript用他们来模拟类。普通对象就很简单了，就是我们常见的对象:可能说到这，你还是无法理解到底啥是函数对象，啥是普通对象，那我们就一起来看看下面的代码:接着我们来分别打印一下他们:所以可以看见,obj1、obj2、,obj3是普通对象，他们都是Object的实例，而func1、func2、func3则都是Function的实例，称为函数对象。我们再看看:你是不是惊呆了，原来Object和Function都是Function的实例。所以我们得出一个结论就是：只要是Function的实例，那就是函数对象，其余则为普通对象。同样我们也可以看出，不仅Object是函数对象,就连Function本身也是函数对象，因为我们通过console.log(typeof Function);得知Function是Function的实例。是不是又开始有点绕了？没事，到这一步你就记住我们刚刚的结论就算完成目标:只要是Function的实例，那就是函数对象，其余则为普通对象。那么说到对象，我们从上面可以看出，一个对象是通过构造函数 new 出来的，这其实跟原型和原型链有很大的关系，那么原型和原型链到底是用来干嘛的呢？涉及到这两个概念，我们就必须先来介绍两个东西:__proto__和prototype，这两个变量可以说，在javascript这门语言里面随处可见，我们不管他三七二十一，我们先来看一张表:所以，请你先记住以下结论：只有函数对象有prototype属性，普通对象没有这个属性。函数对象和普通对象都有__proto__这个属性。prototype和__proto__都是在创建一个函数或者对象会自动生成的属性。接着我们来验证一下:所以就验证了我们刚刚的结论：只有函数对象有prototype属性，普通对象没有这个属性函数对象和普通对象都有__proto__这个属性。prototype和__proto__都是在创建一个函数或者对象会自动生成的属性。你看我又重复写了一遍，我不是为了凑字数，是为了你加深记忆，这对于我们接下来的篇幅很重要。接着我们来看看下面的代码:所以我们又得出如下结论:实例的__proto__属性主动指向构造的prototype;prototype属性被__proto__属性 所指向。这就是prototype属性和__proto__属性的区别与联系。 这可能又有点绕了，来多看几遍这一节，多背一下我们的结论。我们继续。
那么问题来了，既然func是一个函数对象，函数对象是有prototype属性的，那么func.prototype.__proto__等于啥呢？
为了解决这个问题，我们来思考一下：
首先，我们看看func.prototype是啥:好，我们知道了，func.prototype是一个对象，那既然是对象，那func.prototype那不就是Object的实例吗？那也就是说，func.prototype.__proto__属性肯定是指向Object.prototype咯！ 好，我们来验证一下:看见没有，就是这样的。那看到这里，我们应该也知道当我们这创建一个构造函数的时候，javascript 是如何帮我们自动生成__proto__和prototype属性的。哈哈没错就是这样:我还专门为你画了个图(够贴心不老铁):所以prototype又被称为显式原型对象，而__proto__又被称为隐式原型对象。hi，看到这里，你是不是有种脑子开了光的感觉。哈哈，所以到现在你应该已经理解原型的概念了，如果你还不理解，那就把上述章节再看一遍。最好拿个纸笔出来跟着画一画，顺便拿出电脑把示例代码敲一敲。好，整理一下头脑，接下来我们来看看什么又是原型链。再介绍这个概念之前，我们先来看如下代码：接下来我们来逐步解析一下:创建了一个构造函数Person，此时，Person.portotype自动创建，其中包含了constructor和__proto__两个属性;给对象Person.prototype新增了一个方法getName;给对象Person.prototype新增了一个方法getDesc;根据构造函数Person新建一个实例:obj（在创建实例的时候，构造函数会自动执行）;打印实例obj:根据上面一节的结论，我们得出：执行到第 6 步时，由于在实例obj上面找不到get免费云主机域名Name()这个方法，所以它就会自动去通过自身的__proto__继续向上查找，结果找到了Person.prototype，接着它发现，刚好Person.prototype上面有getName()方法，于是找到了这个方法，它就停止了寻找。 怎么样，是不是有一种环环相扣的感觉？他们形成一个链了，没错，这就是原型链。我们得出如下结论:
在访问一个对象(假设这个对象叫 obj)的属性/方法时，若在当前的对象上面找不到，则会尝试通过obj.__proto__去寻找，而obj.__proto__又指向其构造函数(假设叫objCreated)的prototype，所以它又自动去objCreated.prototype的属性/方法上面去找,结果还是没找到，那么就访问objCreated.prototype.__proto__继续往上面寻找，直到找到,则停止对原型链对寻找，若最终还是没能找到，则返回undefined。 一直沿着原型链寻找下去，直到找到Object.prototype.__proto__,指向null，于是返回undefined了。是不是自然而然就理解了。我又给你画了个图：接下来我们再来增加一些概念：任何内置函数对象本身的__proto__属性都指向Function的原型对象，即：Function.prototype;除了Object.prototype.__proto__指向null,所有的内置函数对象的原型对象的__proto__属性 (内置函数对象.prototype.__proto__)，都指向Object。我们得出如下终极原型链的图：针对这个图，我最终给出我们经常看见那个原型链的图:好好对比一下，拿出纸和笔画一画，根据上面章节的讲解，相信你很容易就能明白。刚刚我们终于明白什么是原型和原型链。下面我们根据上面的概念来讲解一下javascript中的类。 我们知道，在面向对象的语言中，类可以被实例化多次，这个实例化是指我们可以根据构造函数去独立复制多个独立的实例，这些实例之间是独立的。但是实际上在javascript却不是这样的，因为它不是这种复制机制。我们不能创建一个类的多个实例，我们只能创建这个类的多个对象，因为他们都是通过原型和原型链关联到同一个对象。所以在javascript中 ,类都是通过原型和原型链来实现的，它其实是一种委托方式。了解了上面javascript中的类的概念，那我们应该很容易就理解new的过程，其核心无非就是执行原型链的链接:那么学习了原型和原型链，instanceof的实现肯定也很简单了，它也是通过原型和原型链来实现的:我就不讲解过程了，因为我知道你肯定能看懂，哈哈。我们都知道继承也是通过原型和原型链来实现的，那我在这里介绍两种常见的继承方式:组合继承:寄生组合式继承:以上就是关于“Javascript原型与原型链实例分析”这篇文章的内容，相信大家都有了一定的了解，希望小编分享的内容对大家有帮助，若想了解更多相关的知识内容，请关注百云主机行业资讯频道。

相关推荐: npm install安装过程中报错怎么解决

今天小编给大家分享一下npminstall安装过程中报错怎么解决的相关知识点，内容详细，逻辑清晰，相信大部分人都还太了解这方面的知识，所以分享这篇文章给大家参考一下，希望大家阅读完这篇文章后有所收获，下面我们一起来了解一下吧。项目拷到本地，然后cd进入项目目录…