美文网首页
原型与原型链

原型与原型链

作者: 小白兔养家 | 来源:发表于2018-09-15 21:50 被阅读0次

全局对象 window

ECMAScript 规定全局对象叫做 global,但是浏览器把 window 作为全局对象(浏览器先存在的)

window 就是一个哈希表,有很多属性。

window 的属性就是全局变量。这些全局变量分为两种:

一种是 ECMAScript 规定的 一种是浏览器自己加的属性
global.parseInt
global.parseFloat
global.Number
global.String
global.Boolean
global.Object
window.alert
window.prompt
window.comfirm
window.console.log
window.console.dir
window.document
window.document.createElement
window.document.getElementById

全局函数

  1. Number
    var n = new Number(1) 创建一个 Number 对象
  2. String
    var s = new String('hello') 创建一个 String 对象
  3. Boolean
    var b = new Boolean(true) 创建一个 Boolean 对象
  4. Object
    var o1 = {}
    var o2 = new Object()
    声明对象方法 o1 和 o2 没区别。但是不相等,因为内存指向地址不同。

原型(公用属性)

所有对象都有 toString 和 valueOf 属性,那么我们是否有必要给每个对象一个 toString 和 valueOf 呢?

明显不需要。

JS 的做法是把 toString 和 valueOf 放在一个对象里(暂且叫做公用属性组成的对象)

然后让每一个对象的 __proto__ 存储这个「公用属性组成的对象」的地址。

同理,每一个 new Number对象,new String对象,new Boolean对象都有它们的公用属性,


new Number对象的共用属性
new String对象的共用属性
new Boolean对象的共用属性

由于它们都是对象,在公用属性中也有一个 __proto__ 存储对象的「公用属性组成的对象」的地址。
这个「公用属性组成的对象」就是原型。

原型链

在我们创建了 var n = new Number(1) 后,n.__proto__ 就指向 Number对象的原型prototype,Number对象的原型包括一些Number的公共属性和存储对象原型的 __proto__ 。那么 n.__proto__.__proto__ 就是指向对象的原型 Object.prototype。这样就形成了一条原型链。

var n = new Number(1) 
n.__proto__ === Number.prototype    // true
n.__proto__.__proto__ === Object.prototype   // true

var s = new String('hello') 
s.__proto__ === String.prototype     // true
s.__proto__.__proto__ === Object.prototype   // true

var b = new Boolean(true) 
b.__proto__ === Boolean.prototype     // true
b.__proto__.__proto__ === Object.prototype   // true
原型链

var 对象 = new 函数这样的构造函数中,可以得出公式:
对象.__proto__ === 函数.prototype

__proto__与prototype
在无代码情况下,prototype 是浏览器写的,本身就存在,是某对象的共同属性的引用,为了不让对象的公用属性因没有被调用而被垃圾回收而存在。
在用户存储数据时, __proto__ 是某对象公用属性的引用,是为了用户使用其共用属性中的方法而存在的

引申公式:

Object.__proto__ === Function.prototype
Object.prototype.__proto__ === null
Function.__proto__ === Function.prototype
Function.prototype.__proto__ === Object.prototype

相关文章

  • JavaScript 原型、原型链与原型继承

    原型,原型链与原型继承 用自己的方式理解原型,原型链和原型继承 javascript——原型与原型链 JavaSc...

  • 2019-01-28

    原型与原型链

  • 廖雪峰JS小记

    (function(){})() 原型,原型链 浅谈Js原型的理解JS 原型与原型链终极详解 对象 对象:一种无序...

  • Javascript(三)之原型继承理解

    进阶路线 3 原型继承 3.1 优秀文章 最详尽的 JS 原型与原型链终极详解 一 最详尽的 JS 原型与原型链终...

  • JavaScript 面向对象第一篇

    1.原型链 ---- (实例对象与原型之间的连接 叫做原型链) 2. hasOwnproperty ----(看是...

  • 原型与原型链以及继承

    今天复习下原型与原型链的知识,以及记录新学的继承知识点。 知识点纲要 原型与原型链 es5与es6继承 什么是原型...

  • JavaScript深入理解this关键字(一)

    摘要 最近在公司需要做培训,我打算把JavaScript中的原型与原型链讲给大家。但我在梳理原型与原型链的时候发现...

  • js_继承及原型链等(四)

    js_继承及原型链等(三) 1. 继承 依赖于原型链来完成的继承 发生在对象与对象之间 原型链,如下: ==原型链...

  • 原型链&instanceof关键字

    1.原型链&instanceof关键字 简单说明 原型链 与 instanceof 作用原理 1.原型链 1...

  • 原型、原型链

    (什么是原型、原型链?有什么作用) JavaScirpt深入之从原型到原型链 图解 Javascript 原型链 ...

网友评论

      本文标题:原型与原型链

      本文链接:https://www.haomeiwen.com/subject/huhtnftx.html