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

  1. 原型:

    • 原型通过constructor指向构造函数,原型如果是自定义对象且没有明确将constructor指向构造函数,则原型的constructor指向函数的基类Function。
    • 原型通过方法isPrototypeOf检查是否和实例之间有关系;
  2. 构造函数:

    • 构造函数的prototype指向原型
    • 因为构造函数和原型可以生成多个实例,所以它两者不关心其所对应的实例,没有直接获取其对应实例的途径。
    • 构造函数通过instanceof 查看和实例之间是否有关系。
  3. 实例

    • 实例的__proto__检查指向其原型;
    • 实例的constructor检查是否和构造函数有关系
    • 实例通过Object.getPrototypeOf(实例)可以查看其原型是谁
    • 实例和原型的constructor都明确的指向构造函数,但原型如果是自定义对象且没有明确将constructor指向构造函数,则原型的constructor指向函数的基类Function。

2. 实例化的过程

  1. 创建一个对象

  2. 创建__proto__属性指向构造函数的prototype属性,创建constructor属性指向自己的构造函数;

  3. 将构造函数的所有私有属性方法复制到自己身上;

    以下为函数实现:

     function Move(name) {
    this.name = name
    this.say = function() {
    console.log('hello,say')
    }
    }
    Move.prototype.age = 23;
    let s = new Move('tt');
    console.log(s);
    // new关键字的函数实现
    function newFunc(fn,...rest) {
    let obj = {};
    obj.constructor = fn;
    obj.__proto__ = fn.prototype;
    fn.call(obj,rest);
    return obj;
    } let newS = newFunc(Move, 'tt')
    console.log(newS)

3. 扩展

对象两两不相等,因为他们指针所对应的实际存储位置不一致,如果一致,也是相等的。

    function Move() {}
let obj = {age: 23}
Move.prototype = obj;
var m = new Move() console.log(Move.prototype === m.__proto__) // true
console.log(Move.prototype === obj) // true
console.log(m.__proto__ === obj) // true
console.log(obj.isPrototypeOf(m)) // true
console.log(Object.getPrototypeOf(m)) // { age: 23 }
console.log(m instanceof Move) // true

Javascript原型、构造函数、实例的关系的更多相关文章

  1. 一句话总结JS构造函数、原型和实例的关系

    "每个构造函数都有一个原型对象, 原型对象都包含一个指向构造函数的指针, 实例都包含一个指向原型对象的内部指针." --此段话摘自<JavaScript高级程序设计>. ...

  2. 原型,构造函数,实例,__proto__

    再说说__proto__,这个孩子性格慢向,所以即使在现代浏览器广为支持得今天也不建议使用,性能特别慢,而且影响所有来自该[[prototype]]的对象.只是拿出来了解了解: 1.它是个啥? 原型对 ...

  3. JavaScript原型,原型链 !

    js原型 问题:什么是js原型? js每声明一个function,都有prototype原型,prototype原型是函数的一个默认属性,在函数的创建过程中由js编译器自动添加. 也就是说:当生产一个 ...

  4. javascript——原型与原型链

    一.prototype 在JavaScript中,每个函数都有一个prototype属性,这个属性指向函数的原型对象. 例如: function Person(age) { this.age = ag ...

  5. JavaScript 原型链学习(四)原型链的基本概念、原型链实现继承

    简单回顾一下构造函数.原型和实例的关系:每个构造函数都有一个原型对象,原型对象都包含一个指向构造函数的指针,而实例都包含一个指向原型对象的内部指针.那么,假如我们让原型对象等于另一个类型的实例,结果会 ...

  6. JavaScript原型与继承(1)

    内容: 创建对象的几种模式以及创建的过程 原型链prototype的理解,以及prototype与 __proto__([[Prototype]])的关系 继承的几种实现 1.常见模式与原型链的理解 ...

  7. javascript原型原型链 学习随笔

    理解原型和原型链.需从构造函数.__proto__属性(IE11以下这个属性是undefined,请使用chrome调试).prototype属性入手. JS内置的好多函数,这些函数又被叫做构造函数. ...

  8. JS 之原型,实例,构造函数之间的关系

    JS是面向对象的语言,函数也是对象.下面大致介绍下实例,原型与构造函数之间的关系. 构造函数模式 function Person(name,age){ this.name = name; this.a ...

  9. js 原型链、构造函数、原型与实例之间的关系

    面向对象编程都会涉及到继承这个概念,JS中实现继承的方式主要是通过原型链的方法. 一.构造函数.原型与实例之间的关系 每创建一个函数,该函数就会自动带有一个 prototype 属性.该属性是个指针, ...

随机推荐

  1. HDU 6041 - I Curse Myself | 2017 Multi-University Training Contest 1

    和题解大致相同的思路 /* HDU 6041 - I Curse Myself [ 图论,找环,最大k和 ] | 2017 Multi-University Training Contest 1 题意 ...

  2. ztree中如何通过点击节点文字就可以选中节点前的选择框,并且父级和子级之间进行选择联动?

    配置信息如下: var UsersTreeSetting = { check : { enable : true, chkboxType : { "Y" : "ps&qu ...

  3. c语言函数分析

    1.vc6的相关使用 1)常用的快捷键 f7    ->编译 f5    ->运行 f9    ->断点 f10    ->单步执行 f11    ->单步执行,可进入函 ...

  4. vue大文件上传断点续传解决方案

    之前仿造uploadify写了一个HTML5版的文件上传插件,没看过的朋友可以点此先看一下~得到了不少朋友的好评,我自己也用在了项目中,不论是用户头像上传,还是各种媒体文件的上传,以及各种个性的业务需 ...

  5. 51 Nod 1282 时钟 (循环中的最小表示+哈希)

    1282 时钟  题目来源: Codility 基准时间限制:1 秒 空间限制:131072 KB 分值: 40 难度:4级算法题  收藏  关注 有N个时钟,每个时钟有M个指针,P个刻度.时钟是圆形 ...

  6. Jmeter(十一)函数助手

    可以在JMeter的选项菜单中找到函数助手对话框 我们可以从下拉列表中选择一个函数,并为其参数设定值.如图,表格的左边一列是函数参数的简要描述,右边一列是供用户填充参数的值.不同函数要求的参数也不同. ...

  7. JVM 监控工具——jstack

    [参考文章]:jstack 命令使用经验总结 1. 简介 jstack主要用于生成java虚拟机当前时刻的线程快照. 线程快照是当前java虚拟机内每一条线程正在执行的方法堆栈的集合, 主要目的是定位 ...

  8. css三类选择器 用法 引用

    css(层叠样式表): css用法:选择符{样式属性:取值;...} css选择器的分类: ①:标签选择器,such as:p{attribute:value;},p为标签选择器的name,该页面中所 ...

  9. echarts ajax请求demo

    <body> <!--为ECharts准备一个具备大小(宽高)的Dom--> <div id="main" style="width: 10 ...

  10. (转)常用 HTTP 状态码对照表

    Code 含义 100 客户端应当继续发送请求.这个临时响应是用来通知客户端它的部分请求已经被服务器接收,且仍未被拒绝.客户端应当继续发送请求的剩余部分,或者如果请求已经完成,忽略这个响应.服务器必须 ...