资讯专栏INFORMATION COLUMN

上云采购季！| 爆款云服务器低至4.6元/月，首单享0.9折

免费试用
首页/文章专栏/JavaScript共有属性（原型）（prototype/__proto__）

JavaScript共有属性（原型）（prototype/__proto__）

tigerZH / 1515人阅读

摘要：这个就指向了类型的共有方法库这个就表示类型的共有方法库里所有的方法简单类型和对象诸如像下面代码所示，就是简单类型的简单声明。

标题中，__proto__的__是由两个_组成的

共有属性（原型）

这个概念就是，一段代码有诸多个对象，对象有很多的属性、方法，把这么多个对象相同的属性、方法提取出来，弄在一个新对象里，大家一起用。对象里就只要存储新对象的地址，到时候要用到这些属性、方法了，再调出来使用。

看下图，简易内存图。左边原始代码区里声明了新对象O1,var O1=new Object()，右边Heap里存储（从左往右看第一个箭头的右边都是Heap，没有Stack）。左边原始代码区里又声明了新对象O2,var O2=new Object()，右边Heap里存储。作为一个对象，有些方法是都有的，比如toString(),valueOf等，所以提取出来，放在共有属性的Heap里，地址随机为A100，那么O1，O2的Heap里就存放共有属性的地址__proto__:A100。你写代码O1.toString()，就顺着上面的箭头找到O1的Heap，找一遍没有，又找到__proto__里好像有东西，就找到了共有属性的Heap，里面有toString()方法。

__proto__ 和 prototype的区别

个人理解，__proto__是个地址，用于指向另一个对象，比如某个共有方法库。prototype就是本个对象所有方法的集合。

var a=new Number(1);
a.__proto__                //这个就指向了Number类型的共有方法库
a.__proto__.prototype      //这个就表示Number类型的共有方法库里所有的方法
简单类型和对象

诸如像下面代码所示，就是简单类型的简单声明。这样子声明的变量只包含简单类型值，没有别的像toString(),valueOf,toFixed......等等的方法

var a=1;
var b="abc";
var c=true;

诸如像下面代码所示，就是简单类型的对象声明。这样子声明的变量除了包含简单类型值，还自带了一些类型专属方法和对象方法等等的方法

var a=new Number(1);
var b=new String("abc");
var c=new Boolean(true);

类型专属方法和对象方法就是上面讲的共有属性（原型）。这就好像，所有的Number类型有自己的方法库，所有的String类型有自己的方法库，所有的Boolean类型有自己的方法库，这些都是对象，所以最后所有Object类型有一个最最通用的方法库。画成图如下图。

S1，S2 → String类型 → 自己的Heap → String类型方法库 → Object方法库

n1，n2 → Number类型 → 自己的Heap → Number类型方法库 → Object方法库

b1，b2 → Boolean类型 → 自己的Heap → Boolean类型方法库 → Object方法库

o1，o2 → Object类型 → 自己的Heap → Object方法库

简单声明和对象声明的区别

讲道理，用起来没啥区别，方法该调用的调用，属性该有的都一样有。但实际上，是JavaScript自己做了处理的，方便了开发人员。

你先用简单声明声明一个简单类型var n=1

简单类型缺点是，它就是一个值，啥也没有，想对它进行各种操作，不行

怎么办！这样也太傻太没用了吧！！那，临时转换下吧~~~

临时转换：

当你写下这样的代码var b=n.toString();

建立临时变量temp，var temp=new Number(n)

这样就可以调用temp的toString()方法了，temp.toString()

好了，临时转换好了，正确返回了n.toString()

最后删除临时变量temp，结束，temp来了、做了、走了

再来看看内存图

左边原始代码区，简单声明变量var n=1;，中间Stack里存储n的值

调用方法n.toString()，Stack里建立新变量temp，这是个对象，所以Heap里存储temp的所有内容，Stack里存储Heap地址ADDR 6

这样n.toString()，就等于temp.toString()

返回temp.toString()后，temp就被磨灭了，Heap里的内容也随之消失

Number类型

两种声明方式

var a=1;
var b=new Number(1);

Number类型专属方法

声明了一个变量，输出变量后看到，里面就只有一个东西__proto__，这是个地址，指向Number类型公用的方法库

点开__proto__，看到的就是Number类型共用的方法库

里边看到还有个__proto__，因为Number类型也是对象呀，所以这个__proto__指向Object类型公用的方法库。点开这个__proto__，就看到了Object类型公用的方法库

Number类型常用方法

toString()
toFixed()
toExponential()
valueOf()

charCodeAt(0)
toString(16)

String类型

两种声明方式

var a="abc";
var b=new String("abc");

String类型专属方法

声明了一个变量，输出变量后看到，里面除了这个String对象的信息，还有一个东西__proto__，这是个地址，指向String类型公用的方法库

点开__proto__，看到的就是String类型共用的方法库

。
。
。

里边看到还有个__proto__，因为String类型也是对象呀，所以这个__proto__指向Object类型公用的方法库。点开这个__proto__，就看到了Object类型公用的方法库

String类型常用方法

trim()
concat()
slice()

Boolean类型

两种声明方式

var a=true;
var b=new Boolean(true);

Boolean类型专属方法

声明了一个变量，输出变量后看到，里面就只有一个东西__proto__，这是个地址，指向Boolean类型公用的方法库

点开__proto__，看到的就是Boolean类型共用的方法库

里边看到还有个__proto__，因为Boolean类型也是对象呀，所以这个__proto__指向Object类型公用的方法库。点开这个__proto__，就看到了Object类型公用的方法库

Boolean类型常用方法

Object类型

两种声明方式

var a={name:1};
var b=new Object({name:1});

Object类型专属方法

声明了一个变量，输出变量后看到，里面对象a基本信息，还有一个东西__proto__，这是个地址，指向Object类型公用的方法库

点开__proto__，a本身就是对象没有别的类型，所以看到的就是Object类型共用的方法库

Object类型常用方法

toString()
valueOf()

私有云 专线服务 javascript__ajax _javascript _JavaScript_API _JavaScript_MVC

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/108024.html

相关文章

  • 原型链一：原型与原型链

    摘要：说白了，原型就是构造函数用来构造新实例的模板对象。什么是原型链先回答什么是原型。例如这个原型的原型就是这个构造函数的，既这个原型对象。这些原型对象通过像链子一样连起来，就叫做原型链。 原型链初步学习 这篇博客只是我初步理解原型链的一个个人学习笔记,写的比较粗略,且有的地方可能理解错误. 更多更专业的关于原型链的解释请看JavaScript深入之从原型到原型链和阮一峰的博客:Javas...

    MudOnTire 评论0 收藏0

  • JS面向对象二:this/原型链/new原理

    摘要：情况没有明确作用对象的情况下，通常为全局对象例如函数的回调函数，它的就是全局对象。正因如此，机器可以作为这类对象的标志，即面向对象语言中类的概念。所以机器又被称为构造函数。原型链也就是继承链。 JS面向对象二:this/原型链/new原理 阮一峰JavaScript教程:面向对象编程 阮一峰JavaScript教程:实例对象与 new 命令 阮一峰JavaScript教程:this 关...

    anRui 评论0 收藏0

  • 浅谈：快速理解JS的原型与原型链

    摘要：中有基本类型和复杂类型的区分。原型与原型链这里，就引入了两个新的概念。原型对象就是用来存放声明对象中共有的那部分属性。而原型对象自身也是一个对象，它也有自己的原型对象。这样层层上溯，就形成了一个类似链表的结构，这就是原型链。 JavaScript中有基本类型和复杂类型的区分。 当我们在声明一个基本类型时： var n1= 1; console.log(n1); //1 这时我们可以用N...

    ZoomQuiet 评论0 收藏0

  • JS题目总结:原型链/new/json/MVC/Promise

    摘要：数据管理，包括数据逻辑数据请求数据存储等功能。负责处理的事件，并更新也负责监听的变化，并更新，控制其他的所有流程。上面代码就是一个最简单的类，构造函数创建出来的对象自身有属性，其原型上面有一个属性。 JS题目总结:原型链/new/json/MVC/Promise 1原型链相关 showImg(https://segmentfault.com/img/remote/14600000161...

    biaoxiaoduan 评论0 收藏0

  • 原型与原型链

    摘要：全局对象规定全局对象叫做，但是浏览器把作为全局对象浏览器先存在的。就是一个哈希表，里面含有很多属性。对象表示一个包含文档的窗口，其属性指向窗口中载入的文档。使用属性可以获取指定文档所在窗口。在标签浏览器比如中，每个标签具有自己的对象。 全局对象 ECMAScript规定全局对象叫做global，但是浏览器把window作为全局对象（浏览器先存在的）。window就是一个哈希表，里面含有...

    denson 评论0 收藏0

发表评论

登陆后可评论

0条评论

tigerZH

男|高级讲师
我要私信

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<