原型和原型链

heartFollower 发布于2019-08-21 16:43 / 3173人阅读

摘要：创建对象有几种方法字面量构造函数原型构造函数实例原型链的关系几点说明函数声明时自动增加属性，初始化一个空对象构造函数才会有，普通函数会有实例对象才会有继承工作原理通过原型链的方式找到原型对象，原型对象的方法和属性会共享实例没有的属性会向上查

创建对象有几种方法

// 1.字面量
var o1 = {
    name: "o1"
};
var o2 = new Object({
    name: "o2"
});
// 2.Object.create()
var o3 = Object.create({
    name: "o3"
});
// 3.构造函数
var M = function () {
    this.name = "o3"
};
var o4 = new M();

原型、构造函数、实例、原型链的关系

几点说明：

函数声明时自动增加prototype属性，初始化一个空对象

构造函数才会有prototype，普通函数会有__proto__

实例对象才会有__proto__

继承

工作原理：通过原型链的方式找到原型对象，原型对象的方法和属性会共享；实例没有的属性会向上查找

instanceof的原理

判断原理：实例对象的__proto__属性和构造函数的prototype属性是不是引用同一个地址，而且实例对象的constructor必须指向对应构造函数

var a = [1, 2, 3];
alert(a instanceof Array);  //返回true
alert(a instanceof Object);  //返回true
 
alert(a.constructor == Array);  //返回true
alert(a.constructor == Object);  //返回false

constructor 更加精确地指向对象所属的类，而对 instanceof 而言，即使是父类也会返回true

练习：如何判断一个对象是否属于某个类

if(a instanceof Person){
    alert("yes");
}

new运算符（过程、工作原理）

1.创建一个空对象，并且this变量指向改对象，同时还继承了该构造函数的原型
2.属性和方法被加入到this引用的对象中去
3.最后隐式的返回this对象
var obj = {};
obj.__proto__ = Base.prototype;
Base.call(obj);

云服务器 GPU云服务器原型原型链原型链原型链继承原型链图

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

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

《javascript高级程序设计》笔记：原型图解

摘要：不理解没关系，下面会结合图例分析上一篇高级程序设计笔记创建对象下一篇高级程序设计笔记继承参考之原型链的解读三张图搞懂的原型对象与原型链继承与原型链文章直接从原型图解开始的，如果对一些概念不太清除，可以结合后面几节查看 1. 图解原型链 1.1 铁三角关系（重点） function Person() {}; var p = new Person(); showImg(https://s...

vspiders 2019-08-21 17:29 评论0 收藏0
如何理解JavaScript的原型和原型链？

摘要：之前有朋友问怎么去理解原型和原型链的问题。理解原型链的小技巧将箭头视作泛化子类到父类关系那么图中所有的虚线将构成一个继承层级，而实线表示属性引用。原型链是实现继承的重要方式，原型链的形成是真正是靠而非。之前有朋友问怎么去理解原型和原型链的问题。这个问题，在面试中，很多同学经常都会遇到。这里给大家讲讲，方便大家记忆。 JavaScript的特点JavaScript是一门直译式脚本...

xuexiangjys 2019-08-02 16:12 评论0 收藏0
如何理解JavaScript的原型和原型链？

摘要：之前有朋友问怎么去理解原型和原型链的问题。理解原型链的小技巧将箭头视作泛化子类到父类关系那么图中所有的虚线将构成一个继承层级，而实线表示属性引用。原型链是实现继承的重要方式，原型链的形成是真正是靠而非。之前有朋友问怎么去理解原型和原型链的问题。这个问题，在面试中，很多同学经常都会遇到。这里给大家讲讲，方便大家记忆。 JavaScript的特点JavaScript是一门直译式脚本...

adie 2019-08-23 16:54 评论0 收藏0
JavaScript面向对象---原型链继承

摘要：因为这造成了继承链的紊乱，因为的实例是由构造函数创建的，现在其属性却指向了为了避免这一现象，就必须在替换对象之后，为新的对象加上属性，使其指向原来的构造函数。这个函数接收两个参数子类型构造函数和超类型构造函数。最近一直在研究js面向对象，原型链继承是一个难点，下面是我对继承的理解以下文章借鉴自CSDN季诗筱的博客原型链继承的基本概念： ES中描述了原型链的概念，并将原型链作为实现...

vspiders 2019-08-20 13:33 评论0 收藏0
JavaScript中的原型与原型链

摘要：前言作为前端高频面试题之一，相信很多小伙伴都有遇到过这个问题。前言作为前端高频面试题之一，相信很多小伙伴都有遇到过这个问题。那么你是否清楚完整的了解它呢？国际惯例，让我们先抛出问题：什么是原型、原型链它们有什么特点它们能做什么怎么确定它们的关系或许你已经有答案，或许你开始有点疑惑，无论是 get 新技能或是简单的温习一次，让我们一起去探究一番吧如果文章中有出现纰...

laoLiueizo 2019-08-23 16:58 评论0 收藏0
JS基础-原型、原型链真的不能一知半解

摘要：原型链和对象的原型是对象实例和它的构造函数之间建立的链接，它的值是构造函数的。对象的原型根据上文提到的构造调用函数的时候会创建一个新对象，自动将的原型指向构造函数的对象。 showImg(https://segmentfault.com/img/remote/1460000020185197); JS的原型、原型链一直是比较难理解的内容，不少初学者甚至有一定经验的老鸟都不一定能完全说清...

changfeng1050 2019-08-26 11:00 评论0 收藏0