首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

理解js原型链,prototype与__proto__关系

首先,要明确几个点: 1.在JS里,万物皆对象。方法(Function)是对象,方法原型(Function.prototype)是对象。因此,它们都会具有对象共有的特点。...即:对象具有属性__proto__,可称为隐式原型,一个对象隐式原型指向构造该对象构造函数原型,这也保证了实例能够访问在构造函数原型定义属性和方法。...那么当我们调用p.Say()时,首先p没有Say这个属性, 于是,他就需要到他__proto__中去找,也就是Person.prototype,而我们在上面定义了 Person.prototype.Say...__proto__,也就是 Programmer.prototype,也就是p1去找,由于p1也没有Say,那就去p.__proto__....最后,其实prototype只是一个假象,他在实现原型链只是起到了一个辅助作用,换句话说,他只是在new时候有着一定价值,而原型链本质,其实在于__proto__

1.2K80
您找到你想要的搜索结果了吗?
是的
没有找到

JavaScript __proto__ 和 prototype

当你创建函数时,JS会为这个函数自动添加prototype属性,值是空对象。...而一旦你把这个函数当作构造函数(constructor)调用(即通过new关键字调用),那么JS就会帮你创建该构造函数实例,实例继承构造函数prototype所有属性和方法(实例通过设置自己__proto...对象__proto__指向自己构造函数prototype。obj.__proto__.__proto__...原型链由此产生,包括我们操作符instanceof正是通过探测obj....prototype 作为一个对象是可以塞很多属性和方法。 __proto__ 每个对象都有一个隐式原型。每个对象都有一个__proto__属性,指向创建该对象函数prototype。...因为函数也是一种对象,所以函数也有__proto__。 Object.__proto__ === Function.prototype

35710

帮你彻底搞懂JSprototype、__proto__与constructor(图解)

前言   作为一名前端工程师,必须搞懂JSprototype、__proto__与constructor属性,相信很多初学者对这些属性存在许多困惑,容易把它们混淆,本文旨在帮助大家理清它们之间关系并彻底搞懂它们...proto”缩写),实际上,该属性在ES标准定义名字应该是[[Prototype]],具体实现是由浏览器代理自己实现,谷歌浏览器实现就是将[[Prototype]]命名为__proto__,大家清楚这个标准定义与具体实现区别即可...但是由于JS函数也是一种对象,所以函数也拥有__proto__和constructor属性,这点是致使我们产生困惑很大原因之一。...每个函数在创建时候,JS会同时创建一个该函数对应prototype对象,而函数创建对象....本文就此结束了,希望对那些对JSprototype、__proto__与constructor属性有困惑同学有所帮助。

62820

轻松理解JS面向对象,顺便搞懂prototype和__proto__

这篇文章主要讲一下JS面向对象以及 __proto__,ptototype和constructor,这几个概念都是相关,所以一起讲了。...JS定义一个静态方法更简单,直接将它作为类函数属性就行: Puppy.statciFunc = function() { // statciFunc就是一个静态方法 console.log...总结 最后来个总结,其实前面小节标题就是核心了,我们再来总结下: JS函数可以作为函数使用,也可以作为类使用 作为类使用函数实例化时需要使用new 为了让函数具有类功能,函数都具有prototype...函数本身也是对象,也具有__proto__,他指向JS内置对象Function原型Function.prototype。...prototype本身也是对象,所以他也有__proto__,指向了他父级prototype。__proto__和prototype这种链式指向构成了JS原型链。

2.3K62

JavaScript继承背后场景-prototype,__proto__, ]

如上图所示,理解JavaScript继承关键是要理解母鸡如何产蛋过程。 [[prototype]]、__proto__、prototype三者之间联系 每个对象都可以有另一个对象作为其原型。...正如上图中看到那样,a.__ proto__暴露了指向Foo.prototype对象[[Prototype]]。同样,b.__ proto__也指向与a.__ proto__相同对象。...通过构造函数来创建对象 除了通过指定模式创建对象之外,构造函数还可以执行另一个有用操作 - 它会自动为新创建对象设置原型对象。此原型对象存储在构造函数原型对象属性。...Foo.prototype指向原型链某些位置,但Foo这个原型属性不是来自原型链。构成原型链是proto指向链,以及proto指向对象。..._ proto__指向我原型对象。

60810

彻底弄懂prototype, __proto__, constructor, instanceof渊源

__proto__ 是 null Object.prototype....这么理解: 构造函数是创建实例机器 实例在创建过程能获得什么属性,取决于机器藏了哪些属性 这坨属性藏在构造函数prototype属性上(称之为原型对象) 在new实例时候,给实例挂上__proto...本质上,关键区别只有一点:给谁用 prototype是给实例用原型对象,只有构造函数有prototype __proto__是指向自己原型对象属性,所有对象都有__proto__ x.prototype...npm下载量很高is模块,有一行上古代码: if (type === '[object Function]') { return value.prototype === other.prototype...== Panel.prototype 如果函数不是构造函数或Class,比较prototype就毫无意义,类库里比较函数prototype在OOP不怎么盛行JS里作用十分有限 支持原创

36920

【说站】JavaScript对象原型__ proto__介绍

JavaScript对象原型__ proto__介绍 1、__proto__对象原型和原型对象 prototype 是等价。 2、意义在于为对象查找机制提供一个方向。...但是作为非标准属性,因此实际开发,不可以使用这个属性,它只是内部指向原型对象prototype。...实例     // 代码说明:     function People(uname) {         this.uname = uname;     }     //设置一个公共方法     People.prototype.sing... = function() {         console.log('正在哼哼唧唧唱歌...');     }     let zs = new People('张三');     //实例对象身上并没有...__proto__ == People.prototype);     // true       console.log(zs); 以上就是JavaScript对象原型__ proto__介绍,希望对大家有所帮助

23910

jssettimeout()用法详解_jssetattribute

大家好,又见面了,我是你们朋友全栈君。 setTimeout与setTimeInterval均为window函数,使用顶层window一般都会省去,这两个函数经常稍不留神就使用错了。...setTimeout内函数先不执行,隔一段时间后再执行,函数后面的数字是隔时间,单位是毫秒(千分之一秒) 比如: setTimeout(‘alert(“hello world!”)’..., 400); setInterval() 方法可按照指定周期(以毫秒计)来调用函数或计算表达式,直到clearInterval()被调用或窗口被关闭。 比如: Stop interval setInterval动作作用是在播放动画时...如发现本站有涉嫌侵权/违法违规内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

14.8K20

jsfind用法_jsfind函数

今天我们要说是结合ES6新特性谈一下js里面的一个很好用方法-find() 现在前端和过去不一样,过去前端只要会画页面就行了,但是现在仅仅会画页面已经远远不够了,现在前端还需要会处理数据,而且还要会将数据分析分类处理...下面我们讲怎么用前端处理这块逻辑 首先我们拿到了所有的数据这里我直接放到一个测试用js里面存放, 要实现之前说效果,就需要使用我们今天主角find()方法。 find()是用来做什么呢?...find()方法返回数组符合测试函数条件第一个元素。否则返回undefined 在本文章需要注意几个点: ①、第一个元素 ②、测试函数 那么如何使用呢?.../find_testcodes.js" type="text/javascript" charset="utf-8">

11.5K30

jsHook

简单理解:   hook(钩子)就是: 把将要执行函数或者一系列动作注册到一个统一接口下面, 当应用程序调用此接口(即hook)时,就等于调用了这一系列动作。...JS钩子(hook)例子 JS钩子(hook)例子1: 例如我们在向后台进行ajax请求时候,后台经常会返回我们一些常见错误码,如:001代表用户不存在,002代表用户密码输入错误。...这个时候我们要将错误友好提示给用户。这个时候我们该怎样实现呢?...一般写法可能是: $.ajax(option,function(result){ var errCode = result.errCode ;//错误码 if(errCode){...switch case来实现,但是这个两种写法都无法避免一个问题就是如果我错误码特别多,那得写多少个if else和case 啊?

6.5K31

细说Jsthis

这段代码可以在不同上下文对象( me 和 you )重复使用函数 identify() 和 speak() ,如果我们不适用this的话,那就需要identity和speak显示传入一个上下文对象,...没关系,我们只要知道在 ECMAScript 规范还有一种只存在于规范类型,它们作用是用来描述语言底层行为逻辑。...它们是为了更好地描述语言底层行为逻辑才存在,但并不存在于实际 js 代码。...可以按照下面的顺序来进行判断:函数是否在 new 调用( new 绑定)?如果是的话 this 绑定是新创建对象。...如果是的话, this 绑定是指定对象。var bar = foo.call(obj2)函数是否在某个上下文对象调用(隐式绑定)?如果是的话, this 绑定是那个上下文对象。

4.3K20

JS 日期

有格式时间 let myDate = new Date(); myDate.getYear(); //获取当前年份(2位) myDate.getFullYear(); //获取完整年份(4位,1970...000, 1626244862000 日期转换成时间格式 可以有参数,如果没有参数获取是当前时间对象 参数可以是时间字符串或者是时间戳,则转换对应时间时间对象,要注意格式 new Date('2021...Date(1626244866842); //正确 , Wed Jul 14 2021 14:41:06 GMT+0800 (中国标准时间) new Date('2021-07-14'); // 错误,...这种格式是不支持, new Date("2021-07-14".replace(/-/g, "/")); //Sat Apr 16 2011 00:00:00 GMT+0800 (中国标准时间)...计算 如果直接使用`new Date()`进行计算,默认会转换成从1970.1.1时开始毫秒数. new Date('2021,07,13') - 1000 ; 1626105600000 - 1000

17120

js数据

数据、内存、变量 数据:以二进制形式存储在内存,代表一定信息数字。 内存:内存条通电后产生存储空间。内存又分为栈内存和堆内存。栈内存存放是全局变量或局部变量。而堆内存存放是对象。...,而obj1保存了obj内容,只是obj内容是{ name: 'clying' }地址值。...而存在与fun函数内部o变量,变成了垃圾对象,根本无法使用。 比较 可能会有一些疑惑:变量与函数,修改了obj值,为什么在引用变量与函数,obj值没有被修改?...首先需要明白,js函数传递变量参数时,是「值传递」(个人理解:传递是变量值)。执行函数fun,只是将obj地址值赋值给o变量。...变量与函数,o是直接被修改,修改直接是obj内部age属性变量。 引用变量与函数, 「o存放是obj值」,即:o内部是{ name: 'dengdeng', age: 22 }地址值。

5.5K20

js对象

js对象 在编程语言中,提到对象,一般都含有一个隐藏上下文面向对象编程。 面向对象编程(Object Oriented Programming,缩写为 OOP)是目前主流编程范式。..., cedf:function(){console.info("cdef")}, "arr":[1,2,3], o:{"name":"jake"} } “在js,对象是属性无序集合...1.2 集合 集合是说 对象可以有很多个属性。属性之间用逗号分隔。 1.3 无序 属性与属性之间,没有先后顺序之分。 对比一下,数组元素之间有序。...2. js对象分类 众观整个js对象,可以分成三类: 内置对象 宿主对象 自定义对象 2.1 内置对象 “由ECMA实现、不依赖于宿主环境对象,这些对象在js程序执行之前就已经存在了”。...js有两个运行环境: (1) 浏览器。我们在.html文件中加入js代码,再通过浏览器来打开,这里浏览器就是javascript运行环境。 在浏览器端js而言,宿主对象就是浏览器对象。

6.9K50
领券