illustrating javascript prototype & prototype chain

图解 js 原型和原型链

proto & prototype

func;
// ƒ func (name) {
// this.name = name || `default name`;
// } // 构造函数具有一个 prototype 属性,
func.prototype;
// {constructor: ƒ} // 构造函数的 prototype 属性指向该构造函数的原型对象, // 该构造函数的原型对象有一个 constructor 属性指向该构造函数本身,
func.prototype.constructor;
// ƒ func (name) {
// this.name = name || `default name`;
// } func.prototype.constructor === func;
// true // var funcInstance = new func();
funcInstance = new func();
// func {name: "default name"} // 构造函数生成的实例对象具有一个 __proto__ 属性,
funcInstance.__proto__;
// {constructor: ƒ} // 生实例对象的 __proto__ 属性指向其构造函数的原型对象,
funcInstance.__proto__ == func.prototype;
// true // 生实例对象的没有 prototype 属性,
funcInstance.prototype;
// undefined

Function

"use strict";

/**
*
* @author xgqfrms
* @license MIT
* @copyright xgqfrms
* @created 2020-07-18
* @modified
*
* @description
* @difficulty Easy Medium Hard
* @complexity O(n)
* @augments
* @example
* @link
* @solutions
*
*/ const log = console.log; /************************************************/ Object;
// ƒ Object() { [native code] } Object.prototype;
// {constructor: ƒ, __defineGetter__: ƒ, __defineSetter__: ƒ, hasOwnProperty: ƒ, __lookupGetter__: ƒ, …}
// constructor: ƒ Object()
// hasOwnProperty: ƒ hasOwnProperty()
// isPrototypeOf: ƒ isPrototypeOf()
// propertyIsEnumerable: ƒ propertyIsEnumerable()
// toLocaleString: ƒ toLocaleString()
// toString: ƒ toString()
// valueOf: ƒ valueOf()
// __defineGetter__: ƒ __defineGetter__()
// __defineSetter__: ƒ __defineSetter__()
// __lookupGetter__: ƒ __lookupGetter__()
// __lookupSetter__: ƒ __lookupSetter__()
// get __proto__: ƒ __proto__()
// set __proto__: ƒ __proto__() Object.__proto__;
// ƒ () { [native code] } Object.__proto__ === Object.prototype;
// false /************************************************/ Function;
// ƒ Function() { [native code] } Function.prototype;
// ƒ () { [native code] } Function.__proto__;
// ƒ () { [native code] } Function.__proto__ === Function.prototype;
// true /************************************************/ Object.__proto__ === Function.__proto__;
// true /************************************************/ function func (name) {
this.name = name || `default name`;
} func;
// ƒ func (name) {
// this.name = name || `default name`;
// } func.__proto__;
// ƒ () { [native code] } func.__proto__.constructor;
// ƒ Function() { [native code] } func.__proto__.constructor.prototype;
// ƒ () { [native code] } func.__proto__.prototype;
// undefined func.__proto__.__proto__;
// {constructor: ƒ, __defineGetter__: ƒ, __defineSetter__: ƒ, hasOwnProperty: ƒ, __lookupGetter__: ƒ, …}
// constructor: ƒ Object()
// hasOwnProperty: ƒ hasOwnProperty()
// isPrototypeOf: ƒ isPrototypeOf()
// propertyIsEnumerable: ƒ propertyIsEnumerable()
// toLocaleString: ƒ toLocaleString()
// toString: ƒ toString()
// valueOf: ƒ valueOf()
// __defineGetter__: ƒ __defineGetter__()
// __defineSetter__: ƒ __defineSetter__()
// __lookupGetter__: ƒ __lookupGetter__()
// __lookupSetter__: ƒ __lookupSetter__()
// get __proto__: ƒ __proto__()
// set __proto__: ƒ __proto__() func.__proto__.__proto__.constructor;
// ƒ Object() { [native code] } func.__proto__.__proto__.prototype;
// undefined func.__proto__.__proto__.__proto__;
// null /************************************************/ func.prototype;
// {constructor: ƒ}
// constructor: ƒ func(name)
// __proto__: Object func.prototype.constructor;
// ƒ func (name) {
// this.name = name || `default name`;
// } func.prototype.constructor.prototype;
// {constructor: ƒ}
// constructor: ƒ func(name)
// __proto__: Object func.prototype.prototype;
// undefined func.prototype.__proto__;
// {constructor: ƒ, __defineGetter__: ƒ, __defineSetter__: ƒ, hasOwnProperty: ƒ, __lookupGetter__: ƒ, …}
// constructor: ƒ Object()
// hasOwnProperty: ƒ hasOwnProperty()
// isPrototypeOf: ƒ isPrototypeOf()
// propertyIsEnumerable: ƒ propertyIsEnumerable()
// toLocaleString: ƒ toLocaleString()
// toString: ƒ toString()
// valueOf: ƒ valueOf()
// __defineGetter__: ƒ __defineGetter__()
// __defineSetter__: ƒ __defineSetter__()
// __lookupGetter__: ƒ __lookupGetter__()
// __lookupSetter__: ƒ __lookupSetter__()
// get __proto__: ƒ __proto__()
// set __proto__: ƒ __proto__() func.prototype.__proto__.constructor;
// ƒ Object() { [native code] } func.prototype.__proto__.prototype;
// undefined
func.prototype.__proto__.__proto__;
// null /************************************************/ // compare func.__proto__ === Function.prototype;
// true func.__proto__ === Function.__proto__;
// true func.__proto__ === Object.__proto__;
// true func.prototype === Function.prototype;
// false func.prototype === Object.prototype;
// false func.prototype.constructor === func;
// true

Object

"use strict";

/**
*
* @author xgqfrms
* @license MIT
* @copyright xgqfrms
* @created 2020-07-18
* @modified
*
* @description
* @difficulty Easy Medium Hard
* @complexity O(n)
* @augments
* @example
* @link
* @solutions
*
*/ const log = console.log; /************************************************/ Object;
// ƒ Object() { [native code] } Object.prototype;
// {constructor: ƒ, __defineGetter__: ƒ, __defineSetter__: ƒ, hasOwnProperty: ƒ, __lookupGetter__: ƒ, …}
// constructor: ƒ Object()
// hasOwnProperty: ƒ hasOwnProperty()
// isPrototypeOf: ƒ isPrototypeOf()
// propertyIsEnumerable: ƒ propertyIsEnumerable()
// toLocaleString: ƒ toLocaleString()
// toString: ƒ toString()
// valueOf: ƒ valueOf()
// __defineGetter__: ƒ __defineGetter__()
// __defineSetter__: ƒ __defineSetter__()
// __lookupGetter__: ƒ __lookupGetter__()
// __lookupSetter__: ƒ __lookupSetter__()
// get __proto__: ƒ __proto__()
// set __proto__: ƒ __proto__() Object.__proto__;
// ƒ () { [native code] } Object.__proto__ === Object.prototype;
// false /************************************************/ Function;
// ƒ Function() { [native code] } Function.prototype;
// ƒ () { [native code] } Function.__proto__;
// ƒ () { [native code] } Function.__proto__ === Function.prototype;
// true /************************************************/ Object.__proto__ === Function.__proto__;
// true /************************************************/ var obj = {
name: "xgqfrms",
}; obj;
// {name: "xgqfrms"}
// name: "xgqfrms"
// __proto__: Object obj.__proto__;
// {constructor: ƒ, __defineGetter__: ƒ, __defineSetter__: ƒ, hasOwnProperty: ƒ, __lookupGetter__: ƒ, …}
// constructor: ƒ Object()
// hasOwnProperty: ƒ hasOwnProperty()
// isPrototypeOf: ƒ isPrototypeOf()
// propertyIsEnumerable: ƒ propertyIsEnumerable()
// toLocaleString: ƒ toLocaleString()
// toString: ƒ toString()
// valueOf: ƒ valueOf()
// __defineGetter__: ƒ __defineGetter__()
// __defineSetter__: ƒ __defineSetter__()
// __lookupGetter__: ƒ __lookupGetter__()
// __lookupSetter__: ƒ __lookupSetter__()
// get __proto__: ƒ __proto__()
// set __proto__: ƒ __proto__() obj.__proto__.constructor;
// ƒ Object() { [native code] } obj.__proto__.constructor.prototype;
// {constructor: ƒ, __defineGetter__: ƒ, __defineSetter__: ƒ, hasOwnProperty: ƒ, __lookupGetter__: ƒ, …}
// constructor: ƒ Object()
// hasOwnProperty: ƒ hasOwnProperty()
// isPrototypeOf: ƒ isPrototypeOf()
// propertyIsEnumerable: ƒ propertyIsEnumerable()
// toLocaleString: ƒ toLocaleString()
// toString: ƒ toString()
// valueOf: ƒ valueOf()
// __defineGetter__: ƒ __defineGetter__()
// __defineSetter__: ƒ __defineSetter__()
// __lookupGetter__: ƒ __lookupGetter__()
// __lookupSetter__: ƒ __lookupSetter__()
// get __proto__: ƒ __proto__()
// set __proto__: ƒ __proto__() obj.__proto__.prototype;
// undefined obj.__proto__.__proto__;
// null obj.__proto__.__proto__.constructor;
// Uncaught TypeError: Cannot read property 'constructor' of null obj.__proto__.__proto__.prototype;
// Uncaught TypeError: Cannot read property 'prototype' of null obj.__proto__.__proto__.__proto__;
// Uncaught TypeError: Cannot read property '__proto__' of null /************************************************/ obj.prototype;
// undefined

obj.prototype.constructor;
// Uncaught TypeError: Cannot read property 'constructor' of undefined obj.prototype.constructor.prototype;
// Uncaught TypeError: Cannot read property 'constructor' of undefined obj.prototype.prototype;
// Uncaught TypeError: Cannot read property 'prototype' of undefined obj.prototype.__proto__;
// Uncaught TypeError: Cannot read property '__proto__' of undefined obj.prototype.__proto__.constructor;
// Uncaught TypeError: Cannot read property '__proto__' of undefined obj.prototype.__proto__.prototype;
// Uncaught TypeError: Cannot read property '__proto__' of undefined obj.prototype.__proto__.__proto__;
// Uncaught TypeError: Cannot read property '__proto__' of undefined /************************************************/ // compare obj.__proto__ === Function.prototype;
// false obj.__proto__ === Function.__proto__;
// false obj.__proto__ === Object.__proto__;
// false obj.prototype === Function.prototype;
// false obj.prototype === Object.prototype;
// false obj.prototype.constructor === obj;
// Uncaught TypeError: Cannot read property 'constructor' of undefined obj.__proto__.constructor.prototype === Object.prototype;
//true

refs



xgqfrms 2012-2020

www.cnblogs.com 发布文章使用:只允许注册用户才可以访问!


illustrating javascript prototype & prototype chain的更多相关文章

  1. javascript 之 prototype 浅析

    prototype 原型 javascript 是一种 prototype based programming 的语言, 而与我们通常的 class based programming 有很大 的区别 ...

  2. Javascript中prototype属性详解 (存)

    Javascript中prototype属性详解   在典型的面向对象的语言中,如java,都存在类(class)的概念,类就是对象的模板,对象就是类的实例.但是在Javascript语言体系中,是不 ...

  3. (转载)详解Javascript中prototype属性(推荐)

    在典型的面向对象的语言中,如java,都存在类(class)的概念,类就是对象的模板,对象就是类的实例.但是在Javascript语言体系中,是不存在类(Class)的概念的,javascript中不 ...

  4. Javascript: 从prototype漫谈到继承(2)

    本文同时也发表在我另一篇独立博客 <Javascript: 从prototype漫谈到继承(2)>(管理员请注意!这两个都是我自己的原创博客!不要踢出首页!不是转载!已经误会三次了!) 上 ...

  5. JavaScript 笔记 ( Prototype )

    这阵子实在好忙 ( 这样说好像也不是一两个月了... ),然后因为工作伙伴都是 JavaScript 神之等级的工程师,从中也学到不少知识,毕竟就是要和强者工作才会成长呀!为了想好好瞭解他们写的程式码 ...

  6. Javascript Array.prototype.some()

    当我们使用数组时,查找数组中包含某个特殊的项是非常常见的动作.下面例子是一个简单的实现: 01 planets = [ 02     "mercury", 03     " ...

  7. JavaScript和prototype

    Protoype这个词在javascript中可以有两种理解: 第一种是作为javascript中的一个属性,其一般出现的形式为:类名.prototype. prototype 属性让你有能力向对象添 ...

  8. 在 JavaScript 中 prototype 和 __proto__ 有什么区别

    本文主要讲三个 问题 prototype 和 proto function 和 object new 到底发生了什么 prototype 和 proto 首先我们说下在 JS 中,常常让我们感到困惑的 ...

  9. javascript继承—prototype最优两种继承(空函数和循环拷贝)

    一.利用空函数实现继承 参考了文章javascript继承-prototype属性介绍(2) 中叶小钗的评论,对这篇文章中的方案二利用一个空函数进行修改,可以解决创建子类对象时,父类实例化的过程中特权 ...

随机推荐

  1. 解决window10 和 ubuntu 双系统安装没有启动选项问题

    win10 和Ubuntu 双系统安装在网上已经有很多例子了,这里就不在赘述了. 今天新买的笔记本,想安装双系统.正常安装完ubuntu 重启后没有选项. 解决方法一 下载和解压以后,按照以下的步骤安 ...

  2. 脑裂 CAP PAXOS 单元化 网络分区 最终一致性 BASE

    阿里技术专家甘盘:浅谈双十一背后的支付宝LDC架构和其CAP分析 https://mp.weixin.qq.com/s/Cnzz5riMc9RH19zdjToyDg 汤波(甘盘) 技术琐话 2020- ...

  3. Mysql四种通信协议(linux下本地连接的都是socket 其他都是tcp)

    Mysql通信协议 - 张冲andy - 博客园 https://www.cnblogs.com/andy6/p/6204579.html

  4. list里放map list 放list

    Map<String,Integer> hashMap = new HashMap<String, Integer>(); Map<String,Integer> ...

  5. django 请求处理流程 链路追踪

    class BaseMiddleware: # https://github.com/django/django/blob/master/tests/utils_tests/test_decorato ...

  6. 如何设计一个亿级网关(API Gateway)?

    1.背景 1.1 什么是API网关 API网关可以看做系统与外界联通的入口,我们可以在网关进行处理一些非业务逻辑的逻辑,比如权限验证,监控,缓存,请求路由等等. 1.2 为什么需要API网关 RPC协 ...

  7. 从零搭建一个IdentityServer——初识OpenIDConnect

    上一篇文章实现了IdentityServer4与Asp.net core Identity的集成,可以使用通过identity注册功能添加的用户,以Password的方式获取Access token, ...

  8. 深入理解java虚拟机,GC参考手册

    深入理解java虚拟机 一.<深入理解Java虚拟机> 1.第2章 Java内存区域与内存溢出异常 2.第3章 垃圾收集器与内存分配策略 3.第4章 虚拟机性能监控与故障处理工具 4.第5 ...

  9. Git实践笔记(一)

    Git是什么 Git是目前世界上最先进的分布式版本控制系统. 工作原理 / 流程: Workspace:工作区 Index / Stage:暂存区 Repository:仓库区(或本地仓库) Remo ...

  10. 枚举--让盗版美国总统wcc给你整明白哈哈

    1.为什么要有枚举 Java中的枚举其实是一种语法糖,在 JDK 1.5之后出现,用来表示固定且有限个的对象.比如一个季节类有春.夏.秋.冬四个对象:一个星期有星期一到星期日七个对象.这些明显都是固定 ...