原型与原型链

一、全局对象window

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

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

window 的属性就是全局变量。

window/global
ECMAscript规定
浏览器私有属性
如:chrome/firefpx/IE
都有各自的私有属性
parseInt()
parseFloat()
Number()
String()
Boolean()
Object()
alert(弹框提示)
prompt(用户填写)
comfirm(确认)
console(开发者)
document(文档)--DOM(w3c制定)
history(浏览器)--BOM
二、共有属性–原型–原型链

当我们去创建一个对象时,js做了些什么?
先理解几个单词概念

prototype:每个函数都有一个prototype(原型)属性,这个属性是一个指针,指定一个对象。对应的函数包含的所有公用的属性与方法都放在prototype里面
constructor:所有原型对象都会自动获得一个constructor(构造函数)属性,这个函数包含一个指向prototype属性所在函数的指针
proto:每个实例化后的对象都有这个属性,这个属性指向它的构造函数

重要的公式:var 对象 = new 函数()
对象.proto === 对象的构造函数.prototype
prototype里面的都是公用方法,所有该函数的实例对象,都能够调用prototype里的方法

以下面这个图为例,
在这里插入图片描述

根据上图答应的内容,我们可以理解为以下代码

// JS里面创建了Boolean()这个全局函数,(自带的)
function Boolean(){}		
//这个函数里有一些公用属性,其实是放在Boolean.prototype里面的,而constructor是告诉你,这些公用属性是隶属于哪个函数的
Boolean.prototype = {
	constructor: Boolean(),
	toString : function(){},
	valueOf : function(){}
}
//这里创建了一个实例对象b1,而这个Boolean()就是这个b1的构造函数
var b1 = new Boolean();
b1.__proto__ === Boolean.prototype      //true
Boolean.prototype.constructor  === Boolean    //true

所以,看一下去创建一个对象时,js做了些什么。我们可以通过浏览器的控制台打印看到以下的内容

s1= new String()
创建一个S1对象
s1.__proto__ === String.prototype
s1的原型(构造函数)就是 String()
String.__proto__ === Object.prototype
String()的原型(构造函数)就是Object()
Object.__proto__ === null
Object()是最顶层,
所以他的原型(构造函数)为null
n1= new Number()
n1.__proto__ === Number.prototype
Number.__proto__=== Object.prototype
b1= new Boolean()
b1.__proto__=== Boolean.prototype
Boolean.__proto__ === Object.prototype

从s1到object 的整个过程,我们称之为原型链。大家可以去试试打印其他类型来求证

所有原型链的终点都是Object函数的prototype属性,因为在JavaScript中的对象都默认由Object()构造。Objec.prototype指向的原型对象同样拥有原型,不过它的原型是null,而null则没有原型

所以可以根据上面的内容理解一下下面的代码

var o1 = {};   
o1._proto  === object.prototype;     //true

var n1 = new Number(1); 
 n1._proto === Number.prototype    //true

三、补充

一般在面试时会出一些无聊的考题,会出现一个function()类型。这个类型在用浏览器调试时是不会出现。

理论来说,所有的函数都是function类型的

具体看下面的代码

var 对象 = new 函数()
对象.__proto__ === 对象的构造函数.prototype

// 推论
var number = new Number()
number.__proto__ === Number.prototype 
Number.__proto__ === Function.prototype // 因为 Number 是 Function 的实例

var object = new Object()
object.__proto__ === Object.prototype
Object.__proto__ === Function.prototype // 因为 Object 是 Function 的实例

var f = new Function()
f.__proto__ === Function.prototype // true
Function.__proto__ === Function.prototype // 因为 Function 是 Function 的实例!
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值