美文网首页
原型与原型链

原型与原型链

作者: JianQiang_Ye | 来源:发表于2019-03-08 14:51 被阅读0次

1.全局属性window

  1. ECMAScript规定全局对象叫做global,但是浏览器把window作为全局对象(浏览器先存在的)
  2. window就是一个哈希表,里面有很多属性
  3. window的属性就是全局变量
  4. 这些全局变量分为两种: 一种是ECMASCript规定的,如
global.parseInt
global.parseFloat
global.Number
global.String
global.Boolean
global.Object

还有一种是浏览器自己加的属性,如

window.alert
window.prompt
window.comfirm
window.console.log
window.document
window.document.createElement

2.全局函数

  1. Number
var n1 = 1
var n2 = new Number(1)

这两种定义数值的方式有什么区别呢?
前者仅仅是Number基本类型,而后者是对象,它包含着有许多属性。比如toString等
但这意味着n1不能使用这些属性了吗?答案是否定的。n1也可以使用这些属性。

n1.toString(); // '1'

这是因为当n1使用这些属性时,它会创建一个临时对象,这个临时对象调用这些属性并返回值,最后被销毁。

n1.xxx  = 2
console.log(n1.xxx) // undefined

3.String

var s = new String('abc')
s[0] // a;可以像数组那样取值
s.charAt(0) // a;相当于s[0]
s.charCodeAt(0) // 97;a的编码
'a'.charCodeAt(0) // 97
(100).toStirng(16) // 64以十六进制的形式编码
'   username   '.trim() // 'username';去掉两边的空格

var s1 = 'hello '
var s2 = 'world'
s1.concat(s2) // 'hello world';连接两个字符串

s2.slice(2,3) // 'r';包前不包后
s1.replace('e','o') // 'hollo'; 替换字母

4.__proto__和prototype傻傻分不清楚

为了搞清楚prototype和__proto__,我们先来搞清楚下面几个概念

var n = new Number(1)
var s = new String('hello')
var b = new Boolean(true)
var o  = new Object({})

nsbo称为实例对象,NumberStringBooleanObject称为构造函数。
n的属性继承了Number的方法,比如toExponentialtoFixed等。
上面这些方法都放在一个对象里面,这个对象我们可以通过Number.prototype来找到。JavaScript 规定,每个函数都有一个prototype属性,指向这个对象。这个对象称之为原型对象。
每一个对象都有__proto__属性,这个属性指向它的原型对象。以Number为例:

n.__proto__ === Number.prototype // true

你可能会问,既然每一个对象都有__proto__属性,Number也是构造函数,函数也是对象的一种,那么Number也有__proto__属性吗?有的话,它指向谁呢?
答:所有的构造函数都是由一个名为Function的函数构造出来的,Function是所有构造函数的爸爸。

Number.__proto__ === Function.prototype // true
String.__proto__ === Function.prototype // true
Boolean.__proto__ === Function.prototype // true
Object.__proto__ === Function.prototype // true
Function.__proto__ === Function.prototype // true

你可能注意到了,Function本身也是函数,因此它自己的__proto__,指向自己的prototype
你还可能会问,既然原型对象(比如Number.prototypeString.prototype这样的)也是对象,它们也有自己的原型对象吗?
答:有的。原型对象的原型对象都指向Object.prototypeObject.prototype就是最终大Boss。如上文所说,用__proto__可以找到自己的原型对象,那么我们来验证一下是否正确:

Number.prototype.__proto__ === Object.prototype // true
String.prototype.__proto__ === Object.prototype // true
Boolean.prototype.__proto__ === Object.prototype // true
Function.prototype.__proto__ === Object.prototype // true

你还可能会问,Object.prototype也是对象呀,那它会指向谁?

Object.prototype.__proto__ // null

我们来整理一下:以var n = new Number(1)为例

n.__proto__ === Number.prototype
Number.prototype.__proto__ === Object.prototype
Object.prototype.__proto__ === null

这条层层向上查找的路就是原型链,它的终点的是null

相关文章

  • 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/kerkpqtx.html