js-函数的prototype

js-函数的prototypeDockerfile

大家好,又见面了,我是你们的朋友全栈君。

1、 函数的prototype属性

  • 每个 函数 都有一个prototype属性(是一个object类型数据),它默认指向一个object空对象(即称为:原型对象)
 console.log(typeof Date.prototype) //object
 console.log(Date.prototype) //如图1所示
 function fun(){ 
   }
 console.log(fun.prototype)   //默认指向一个object空对象(没有我们的属性)

在这里插入图片描述图1
在这里插入图片描述图2

/* Date函数的流程基本就是 首先创建一个Date函数, 然后通过Date.prototype(指向原型对象)向Date函数原型对象中添加很多方法 如下:以函数fun为例 */
 function fun(){ 
   }
 fun.prototype.test = function(){ 
   }
  console.log(fun.prototype)

在这里插入图片描述

  • 原型对象中有一个属性constructor,他指向函数对象
// 原型对象中有一个属性constructor,他指向函数对象
console.log(Date.prototype.constructor === Date)  // true
console.log(fun.prototype.constructor === fun)  // true

2、 给原型对象添加属性(一般都是方法)

  • 作用:函数的所有实例对象自动拥有原型中的属性(方法)
/* 给原型对象添加属性(一般都是方法)===》实例对象可以访问 */
 function Fun(){ 
   }
 Fun.prototype.test = function(){ 
   
 console.log('test()')
}
var fun =  new Fun() // 实例化对象
fun.test() //test() 实例对象可以直接访问

3、 显式原型与隐式原型

  • 每个函数function都有一个prototype,即显式原型
  • 每个实例对象都有一个__proto__,即隐式原型
  • 对象的隐式原型的值为其对应的构造函数的显式原型的值
/* 每个**函数function**都有一个prototype,即显式原型,默认指向一个object空对象 */
function Fn(){ 
        //内部语句:this.prototype = {}
}
console.log(Fn.prototype)
/* 每个**实例对象**都有一个__proto__,即隐式原型,默认指向一个object空对象 */
var fn =  new Fn() // 实例化对象,内部语句:this.__proto__ = Fn.prototype
console.log(fn.__proto__)

/* 对象的隐式原型的值为其对应的构造函数的显式原型的值,引用地址值相同,指向同一个对象 */
console.log(Fn.prototype === fn.__proto__)   //true


Fn.prototype.test = function(){ 
   
console.log('test()')
}
fn.test()   // test() 对象可以直接访问自己__proto__里面的属性和方法,本质上 对象的__proto__与其构造函数的prototype 指向的是同一个对象

在这里插入图片描述

  • 内存结构
    在这里插入图片描述
  • 总结:
    (1)对象的prototype属性:在定义函数时自动添加的,默认值是一个空object对象
    (2)对象的__proto__属性:创建对象时自动添加的,默认值是构造函数的prototype属性值
    (3)程序员可直接操作显式原型,但不能操作隐式原型(es6之前)
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/163403.html原文链接:https://javaforall.net

赞 (0)
全栈程序员-站长的头像全栈程序员-站长

相关推荐

  • SWOT分析和PEST分析[通俗易懂]

    SWOT分析和PEST分析[通俗易懂]1.SWOT分析定义:SWOT(StrengthsWeaknessOpportunityThreats)分析法,又称态势分析法或优劣势分析法,用来确定企业自身的竞争优势(strength)、竞争劣势(weakness)、机会(opportunity)和威胁(threat),从而将公司的战略与公司内部资源、外部环境有机地结合起来。如何用:首先要明白使用SWOT的目的,为什么要用它,用它的目的

    2022年6月14日
  • centos7怎么退出vi_centos7怎么退出vi

    centos7怎么退出vi_centos7怎么退出vi一、首先用vi命令打卡要编辑的文件:注意:vi命令的使用如下打开或新建文件,并将光标至于第一行首:[root@centos6/]#vi/etc/my.cnf打开文件,并将光标移至最后一行行首:[root@centos6/]#vi+/etc/my.cnf打开文件,并将光标置于第n行首:[root@centos6/]#vi+n/etc/my.cnf打开文件,并将光标置于第一个与pattern匹配的串处…

    2022年9月30日
  • html+CSS让背景图片充满整个屏幕

    html+CSS让背景图片充满整个屏幕由于给网页设置背景图时,需要设置背景图不重复且充满整个浏览器屏幕。   给body标签指定背景图,这样背景图就可以填充整个浏览器viewport了。其实,该方案对所有的块级容器都可以生效。块级容器的宽高是动态的,那么背景图将自动伸缩,充满整个容器。可设置body标签的CSS样式如下:body{/*加载背景图*/backg

    2022年6月7日
  • 《树先生》影评_hello树先生影评分析

    《树先生》影评_hello树先生影评分析1.树先生的母亲对树说:你看二猪都把咱家的地给占了,你也不去说说。这一个情节对应高鹏结婚的时候树先生借着酒劲向二猪说出来那句话:占了俺家的地,也不提前说声。这个会给树带来心理上的压力,就好像作为家

    2022年8月5日
  • how to deal with "no such file error or diretory" error for a new programmer in QT creator「建议收藏」

    how to deal with "no such file error or diretory" error for a new programmer in QT creator

    2022年3月4日
  • Python内置函数详解——总结篇

    Python内置函数详解——总结篇引言国庆期间下定决心打算学习Python,于是下载安装了开发环境。然后问题就来了,怎么开始呢?纠结一番,还是从官方帮助文档开始吧。可是全是英文啊,英语渣怎么破?那就边翻译边看边实践着做吧(顺便吐槽

    2022年7月5日

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号