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

彻底理解js的原型

什么是原型?原型(prototype)是函数创建的时候默认自带的。只要创建函数,他就默认存在。要理解原型,还要知道,我们所有对象最终都是都是继承自Object的。...__proto__ === Person.prototype搞清楚对象、构造函数他们原型的是什么,其他就更好理解了。...我们在理解new创建对象的过程发生了什么,可以加深理解他们的关系:一共5步:(1) 在内存中创建一个新对象。...理解原型链:首先,我们要知道原型链有什么作用,它的作用就是共享属性和方法。当一个对象访问属性或方法时,首先会在自身上寻找,找不到就会往对象原型上寻找,层层往上寻找的过程就是我们所说的原型链。...理解原型,理解下面的关系是很有必要的; console.log(Person.prototype.

7810

理解JS 原型链

这需要我们先理解原型对象的概念。 #原型对象 我们先了解原型对象的概念。 每个对象都有原型对象(null除外),我们用__proto__表示,每个函数都有prototype属性,指向实例的原型对象。...__proto__; // true 为了便于理解,来看一张图。 ? 恩~他们的关系大概就是这样。...#原型链 原型链简单用一句话概括就是: 原型链就是 对象的__proto__所连接的链状结构 为了方便我们理解原型链,举一个简单的例子: function F(){ this.a = 1;...#补充 constructor 说一下我的经历,一开始理解原型链时,一直在prototype、__proto__、constructor在这个三个属性中绕来绕去。...为了便于理解,我把constructor放在最后了。 constructor字面意思就很容易理解,构造函数的意思。

1.7K10
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    JS中的原型和原型链

    讲原型的时候,我们应该先要记住以下几个要点,这几个要点是理解原型的关键: 1、所有的引用类型(数组、函数、对象)可以自由扩展属性(除null以外)。...---- 那么要点说完了,我们就根据这些要点来理解原型和原型链。 原型 我们先来看一个原型的例子。...'属性中去找*/ fn.showName(); //I'm 小明 fn.showAge(); //And I'm 19 ---- 这就是原型,很好理解。...这样每个对象都可以使用prototype属性里面的showName、showAge方法,并且节省了不少的资源。 ---- 原型链 理解了原型,那么原型链就更好理解了。...下面这段话可以帮助理解原型链 根据要点5,当试图得到一个对象的属性时,如果这个对象本身不存在这个属性,那么就会去它构造函数的’prototype’属性中去寻找。

    1.8K21

    JS中的原型和原型链

    js在创建对象的时候,都有一个叫做proto的属性,用于指向它的函数对象的原型对象prototype。 prototype可以让所有的对象实例共享它包含的属性和方法。...原型链 每一个对象都可以有一个原型,这可原型还可以有它自己的原型,以此类推,就形成了原型链。...查找一个对象的属性或方法的时候,如果这个对象中没有这个属性或者方法,那就会在这个对象的原型对象中去找,以此类推,直到原型链结束。..._proto_ _proto_是原型链查询中实际用到的,指向构造函数的原型对象,他是对象独有的。对象._proto_ = 构造函数.prototype。 在js中,万物皆是对象,函数也是对象。...3、构造函数的prototype指向原型对象,原型对象的constructor指向构造函数。 使用 prototype最主要的用法就是将属性暴露成公用的。

    1.5K10

    js中的原型和原型链

    ​一、原型 1、prototype和constructor 在js中每个函数(非箭头函数,一般关于原型的有关知识我们都只考虑构造函数)都会拥有一个 prototype 属性,该属性值是一个对象...原型链中的查找机制:实例对象上找不到指定属性,就从该原型对象上找,如果还是找不到就到该原型对象上的原型上去找,。...// 依次注释掉下面三点下的代码进行调试不难理解原型链 function Person() { // 1.先从实例对象自身查找name属性 // this.name = 'zs' } // 2.实例对象没有...第一个参数是:要设置其原型的对象;第二个参数是:该对象的新原型(一个对象或 null)。...:所有构造函数其实里面都有 prototype 和 __proto__ 这两个属性,所以 Object 和 Function 就是一个构造函数(我的理解)可能不严谨但是对于我们理解这里面的指向问题会很有帮助

    1.1K00

    理解原型与原型链

    原型与原型链是学习JavaScript这门语言不能不理解的两个重要概念,为什么?因为JavaScript是一门基于原型的语言。 怎么理解“JavaScript是一门基于原型的语言”?...原型模式的目的是用原型实例指定创建对象的种类,并且通过拷贝这些原型创建新的对象。也就是说利用已有的一个原型对象,可以快速地生成和原型对象一样的新对象实例。 原型: 原型到底是什么?...原型是一个可以被复制(或者叫克隆)的一个类,通过复制原型可以创建一个一模一样的新对象。通俗的说,原型就是一个模板,在设计语言中更准确的说是一个对象模板。...看下面一段代码来理解原型: var Person = function(name){ this.name = name; } Person.prototype.sayHi...因为C的原型是B,B的原型是A。

    56320

    JS原型与原型链

    值得注意的是typeof (null)会返回Object,这是因为JS二进制前三位都为0的话会被判断为Object类型,null的二进制表示是全0,自然前三位也是0,所以执行typeof时会返回Object...,它总是指向prototype,就是指向构造函数Student的原型对象prototype。...例如实例化的stu会使用__proto__向Student的prototype寻找方法或属性。若stu寻找到了调用的方法或属性,则不会使用__proto__寻找原型对象。...原型链可以简单理解为将原型连成一条链,js每一次获取对象中的属性都是一次查询过程,如果在自有属性中找不到就会去原型对象中查找,如果原型对象中还查不到,就回去原型对象的原型中查找,也就是按照原型链查找,...直到查找到原型链的顶端,也就是Object的原型。

    1.8K50

    js原型和原型链

    (prototype) 每个函数都有一个 prototype 属性 每一个JavaScript对象(null除外)在创建的时候就会与之关联另一个对象,这个对象就是我们所说的原型对象prototype ,...但是当我们删除了 person 的 name 属性时,读取 person.name,从 person 对象中找不到 name 属性就会从 person 的原型也就是 person....原型和原型链 一张图搞懂: 函数与 Function 的关系 函数就是 Function 的实例....Object可以使用__proto__来访问对象的原型对象,即Object可通过__proto__访问Function的Function.prototype 原型继承的整个关系( 原型链 ) 可以知道所有的对象都有原型...__proto__ === Object.prototype); // true 应用 继承 看我这篇文章:js实现继承 增删查改 function Person() { } // 增 Person.prototype.name

    2.1K10

    几行代码立即理解js的对象,类,原型等概念

    很多人觉得js的类和对象及原型这个概念特别难理解,特别是习惯java,php,C#等高级语言编程的同学们。 无意中找到了下面一组代码,貌似一下子理解了js中的原型,类,对象等概念。...("Windking"); p1.Introduce(); People.Run(); p1.IntroduceChinese(); 1、对象方法理解就很简单了,主要是如果类生成一个实例,那么该实例就能使用该方法...2、类方法,不需要通过生成实例就可以使用的方法 3、原型方法主要是用来对JS已有的系统对象进行扩展而生的,例如Array数组没有什么方法,你可以为其增加原型方法,那么创建的数组就拥有了该方法。...1、对象方法包括构造函数中的方法以及构造函数原型上面的方法; 2、类方法,其实这里的类就是一个函数,在js中由于函数也是一个对象,所以可以为函数添加属性以及方法,这种方法在node中用的比较多; 3...原来原型方法就是事后定义类,所有类的实例都可以调用原型方法 而定类方法 ,就好比定义静态类的静态方法 ,只能用静态类的方式调用。

    83320

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

    首先,要明确几个点: 1.在JS里,万物皆对象。方法(Function)是对象,方法的原型(Function.prototype)是对象。因此,它们都会具有对象共有的特点。...即:对象具有属性__proto__,可称为隐式原型,一个对象的隐式原型指向构造该对象的构造函数的原型,这也保证了实例能够访问在构造函数原型中定义的属性和方法。...1.构造函数Foo() 构造函数的原型属性Foo.prototype指向了原型对象,在原型对象里有共有的方法,所有构造函数声明的实例(这里是f1,f2)都可以共享这个方法。...3.实例 f1和f2是Foo这个对象的两个实例,这两个对象也有属性__proto__,指向构造函数的原型对象,这样子就可以像上面1所说的访问原型对象的所有方法啦。...其实除了Foo(),Function(), Object()也是一样的道理。 原型对象也是对象啊,它的__proto__属性,又指向谁呢? 同理,指向它的构造函数的原型对象呗。

    1.2K80

    js对象和原型、原型链的关系

    JS的原型、原型链一直是比较难理解的内容,不少初学者甚至有一定经验的老鸟都不一定能完全说清楚,更多的"很可能"是一知半解,而这部分内容又是JS的核心内容,想要技术进阶的话肯定不能对这个概念一知半解,碰到问题靠...“猜”,却不理解它的规则!...有时候需要在两个对象之间共享属性,由于JS在设计之初没有类的概念,所以JS使用函数的prototype来处理这部分需要被共享的属性,通过函数的prototype来模拟类:当创建一个函数时,JS会自动为函数添加...写操作)、Object.create(target)(生成操作)代替构造函数是什么、它做了什么出自《你不知道的js》:在js中, 实际上并不存在所谓的'构造函数',只有对于函数的'构造调用'。...__proto__ // 这种关系就是原型链可以用以下三句话来理解原型链:每个对象都拥有一个原型对象: newObj的原型是foo.prototype。

    1.5K20

    原型和原型链理解_原型对象和原型链

    大家好,又见面了,我是你们的朋友全栈君。...一、原型 ①所有引用类型都有一个__proto__(隐式原型)属性,属性值是一个普通的对象 ②所有函数都有一个prototype(原型)属性,属性值是一个普通的对象 ③所有引用类型的__proto...__proto__ === Array.prototype; // true 二、原型链 当访问一个对象的某个属性时,会先在这个对象本身属性上查找,如果没有找到,则会去它的__proto__隐式原型上查找...,即它的构造函数的prototype,如果还没有找到就会再在构造函数的prototype的__proto__中查找,这样一层一层向上查找就会形成一个链式结构,我们称为原型链。...__proto__ === null ③所有从原型或更高级原型中的得到、执行的方法,其中的this在执行时,指向当前这个触发事件执行的对象 版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人

    58730

    JavaScript中的显示原型和隐形原型(理解原型链)

    在js中万物皆对象,方法(Function)是对象,方法的原型(Function.prototype)是对象,对象具有属性(__proto__)称为隐式原型,对象的隐式原型指向构造该对象的构造函数的显式原型...方法(Function)是一个特殊的对象,除了和其他对象一样具有__proto__属性以外,它还有一个自己特有的原型属性(prototype),这个属性是一个指针,指向原型对象。...2.二者的关系 隐式原型指向创建这个对象的函数的prototype 首先我们来看如何创建一个对象 a.通过对象字面量的方式。...其中通过Object.creat(o)创建出来的对象他的隐式原型指向o。 通过对象字面量的方式创建的对象他的隐式原型指向Object.prototype。...内置函数Array Number等也是有Function构造函数创建的。 因此也就不难理解下面几个例子: //通过new的方式 person1.

    3.2K30

    JS面试必问-JS原型及原型链

    为什么需要原型 在js中万物皆对象,对象可以说是重中之重了。每一个对象都拥有自己的属性。但是在这个世界中有很多东西都是相似的,可以归为一类,他们有共同的方法和属性。不可能让每一个对象都定义一个属性吧。...所以,在js中怎么才能让多个对象共享一个或多个方法呢?原型的出现就是为了解决这个问题。...原型对象有一个constructor属性,默认指向对应的构造函数。 什么是原型链 根据字面意思我们可以这样理解,就是将原型连成一条链。...我们上面讲过,js每一次获取对象中的属性都是一次查询过程,如果在自有属性中找不到就会去原型对象中查找,如果原型对象中还查不到,就回去原型对象的原型中查找,也就是按照原型链查找,直到查找到原型链的顶端,也就是...在js中,对象都有__proto__属性,一般这个是被称为隐式的原型,该隐式原型指向构造该对象的构造函数的原型。

    1.6K20

    JS进阶:原型与原型链

    JS进阶:原型与原型链 image.png JavaScript中除了基础数据类型外都是对象(引用类型)。...但是由于其没有类(ES6 引入了 class,但其只是语法糖)的概念,为了保证对象之间的联系,就有了原型和原型链的概念。...该原型对象也有一个自己的原型对象( __proto__ ) ,层层向上直到一个对象的原型对象为 null。根据定义,null 没有原型,并作为这个原型链中的最后一个环节。...Objec.prototype指向的原型对象同样拥有原型,不过它的原型是null,而null则没有原型。...Husky,通过call方法继承Dog中的属性(call方法的作用可以简单理解为将Dog中的属性添加到Husky中,因为还涉及到其他的知识点所以不多赘述),并添加了一个weight属性。

    1.4K30

    js原型及原型链解析

    js原型、原型链 这几天闲了看了下js的原型,以下内容为个人理解,如有错误,尽请指正。...首先,明确一点:js中的对象分为普通对象和函数对象,一般我们自定义的可以被new的函数称作函数对象,另外js内置了譬如:Array、Date、Object、Function、Number、String、...__proto__属性,该属性指向其构造的原型,使用__proto__将所有对象联系起来,才形成了所谓的原型链,举个栗子: function Person() {} const p1 = new Person...__proto__ === null) // true, Object的原型是由null"产生"的,null处于原型链顶端 这个从根本上印证了道德经那句:道(null)生一,一生二,二生三,三生万物...__proto__ === p.constructor.prototype) // true 下一节的话讲下js中的继承~

    2.2K30

    js原型入门

    前言 本文主要是根据《head first javascript程序设计》摘抄学习而成,学习采用这本书主要是一位阿里大佬的建议,经过近期的学习阅读,发现确实比其他的js书籍能更好的理解和使用js的相关知识...对象图 为了更好地理解对象的结构,我们可以向后端学习,做出对象图,它基本是分为三栏的一个矩形图,第一栏是构造函数名称,第二栏是对象具有的属性,第三栏是对象具有的方法。 ?...在上述代码执行后,虽然代码层面,各个实例对象的属性以及方法都指定到了新的对象中,但细节发现,其属性是各自不同,可以理解,但是其方法也会都有一个函数的指向,这部分是重复的。...之所以出现这样的问题,是因为我们没有充分利用好js的对象模型,其是基于原型的概念的。 原型是什么 js可以从其他对象那里继承属性和行为,更具体的说js使用原型继承。其中其行为继承的对象称为原型对象。...this是指向原型对象的,同样我们也很好理解在没有原型的时候,this调用指向的是对象本身,但是你在调用原型原型的方法时你可能认为this指向的是原型对象,其实并非如此。

    1.5K11

    js原型链

    ) //true 5.构造函数与它的原型对象有一个相互引用的关系 6.原型对象上添加的方法用于实例对象上使用 隐式原型 每一个实例对象都有一个__proto__属性,称之为隐式原型 对象的隐式原型的值为其对应构造函数的显示原型的值...__proto__) Fn.prototype.test = function(){ console.log('test') } fn.test() 原型链 对象属性的查找规则 原型链本质上是从隐式原型链...当执行 fn.test1()时先对象自身查找发现有,直接调用test1() 当执行fn.test2()时,自身对象上没有test2,接下来看构造函数的原型对象上是否有test2,发现有直接调用test2...当执行fn.toString(),时,自身对象没有,接下来查找它构造函数的原型对象上是否有toString(),发现没有,接下来又继续沿着Fn原型对象的构造函数的原型对象上查找找到toString()...当执行fn.test3()时,查找自身对象没有,它直接的构造函数对象的原型对象上也没有,接下来沿着Fn原型对象的构造函数的原型对象的构造函数的原型对象上查找,这里已经找到原型链的尽头,Object原型对象的

    2.1K20

    JS 原型链

    JS 原型链 1. 原型和原型链的基础结论 1.1 函数与对象的关系 函数是对象,对象都是通过函数创建的。 函数与对象并不是简单的包含与被包含的关系。...1.3 原型和原型链 原型:一个函数可以看成一个类,原型是所有类都有的一个属性,原型的作用就是给这个类的一个对象都添加一个统一的方法。...原型链:每个对象都有一个__proto__,它指向它的prototype原型对象;它的prototype原型对象又有一个__proto__指向它的prototype原型对象,就这样层层向上直到最终找到顶级对象...基于原型链的继承 JavaScript 对象有一个指向一个原型对象的链。...当试图访问一个对象的属性时,它不仅仅在该对象上搜寻,还会搜寻该对象的原型,以及该对象的原型的原型,依次层层向上搜索,直到找到一个名字匹配的属性或到达原型链的末尾。

    2.3K30
    领券