- 综合排序
- 最热优先
- 最新优先
- 来自专栏字节脉搏实验室
JavaScript原型、原型链及原型链污染
如果person对象中没有找到，则直接去person对象的__proto__属性指向的原型对象中查找，如果查找到则返回。 5-如果通过person对象添加了一个属性name，则通过person访问name时，就相当于屏蔽了原型中的属性name，输出的是person对象中的name值 6-通过person对象只能读取构造函数的原型中的属性 ，先查找对象本身是否存在该属性，如果不存在，会在原型链上查找，但不会查找自身的prototype，如图所示。 0x03 JavaScript原型链污染 在看懂原型链的那几点内容后，其实就应该可以理解什么是原型链污染了，就是修改其构造函数的原型中的属性值，使其他通过该构造函数实例出的对象也具有该属性值。 结果是，合并虽然成功了，但原型链没有被污染： ?
1.3K10发布于 2020-07-28 - 来自专栏全栈程序员必看
原型和原型链理解_原型对象和原型链
一、原型 ①所有引用类型都有一个__proto__(隐式原型)属性，属性值是一个普通的对象 ②所有函数都有一个prototype(原型)属性，属性值是一个普通的对象 ③所有引用类型的__proto __proto__ === Array.prototype; // true 二、原型链 当访问一个对象的某个属性时，会先在这个对象本身属性上查找，如果没有找到，则会去它的__proto__隐式原型上查找 ，即它的构造函数的prototype，如果还没有找到就会再在构造函数的prototype的__proto__中查找，这样一层一层向上查找就会形成一个链式结构，我们称为原型链。 ，会执行下面步骤： 访问链路为： ①一直往上层查找，直到到null还没有找到，则返回undefined ②Object.prototype. __proto__ === null ③所有从原型或更高级原型中的得到、执行的方法，其中的this在执行时，指向当前这个触发事件执行的对象 版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人
80430编辑于 2022-11-17 - 来自专栏code秘密花园
原型和原型链
导读： 分类：面试总结 题目：原型和原型链 基础很重要，时刻给自己充电！ 1.题目 如何准确判断一个变量是数组 写一个原型链继承的例子 继承实现的其他方式 描述new一个对象的过程 zepto及其他源码中如何使用原型链 2.知识点 2.1 构造函数 特点：以大写字母开头 function prototype（显式原型）属性，也是一个普通对象 4.所有引用类型（对象，数组，函数）__proto__值指向它构造函数的prototype 5.当试图得到一个对象的属性时，如果变量本身没有这个属性 )) { console.log(object[key]); } } 2.3 this this的几种使用场景 全局/函数 构造函数 对象 内部函数 call/apply 2.4 原型链 3.题目解答 3.1 如何准确判断一个变量是数组 arr instanceof Array 3.2 写一个原型链继承的例子 封装dom查询 function Elem(id){ this.elem
81430发布于 2019-09-08 - 来自专栏前端小菜鸡yym
原型与原型链
概念 原型 prototype 原型链 __proto__ [[Prototype]] 原型 思考一个问题 普通的对象或者数组上有原型吗？我们试一试 原型上是可以定义属性或者变量的。 引出原型链 我们为Person()函数的原型上，添加变量name、age 和 方法 getAge() function Person(){ } Person.prototype.name 其实这就引出了原型链。这是在因为在原型链上离得较近。 原型链 原型链查找规则 从当前实例属性去查找，如果找到了就返回，否则顺着原型链一层一层的往上找。直到找到null为止。如果仍旧没找到就会报错。 __proto__ 我们再试一下，原型链上没有findd()方法。 再试一下变量 console.log(person1.abc) 只是会undefined hasOwnProperty 我们想要看这个属性是它自身的还是原型链上的，怎么办呢？
50620编辑于 2023-01-12 - 来自专栏FinGet前端之路
原型，原型链，callapply
通过该构造函数产生的对象，可以继承该原型的属性和方法。原型也是对象。 用一张图简单解释一下定义。 constructor属性指向构造函数本身(Person) 每个实例都有一个隐式原型(proto)指向构造函数的原型对象(Person.prototype) 每个原型对象也有隐式原型(proto) // __proto__ 与 Person.prototype是指向同一个内存地址，这也就是 为什么实例没有属性或方法会到原型上去查找 function Person() { } Person.prototype.name 原型链 先扔一张图： 5.png Person.prototype. = new Son() 7.png 上图中红线表示的就是原型链了 Object.create() // Object.create(原型) var obj = {name: 'zhang',age
79120发布于 2019-06-28 - 来自专栏web前端记录
原型和原型链
prototype(原型)：prototype是Function对象的一个属性，它定义了构造函数制造出的对象的公用祖先（属性和方法），可以继承该原型的属性和方法。原型也是对象。 原型链基本概念：每个对象都会在其内部初始化一个属性，就是 proto，当我们访问一个对象的属性 时，如果这个对象内部不存在这个属性，那么他就会去proto里找这个属性，这个proto又会有自己的proto ，于是就这样 一直找下去，也就是我们平时所说的原型链的概念。 原型链--实现对象间的联系即继承的方法。 //es5写法 var Person = function(name,age){ this.name = name; }; Person.prototype.sayName = function()
70820发布于 2021-04-28 - 来自专栏各类技术文章~
原型、原型链和原型继承
该对象就是我们说的原型。 它的作用就是用来存放一些方法和属性，当以它为原型的对象，访问本身没有的一些属性或者方法，就会来到原型上面查找。 那么 构造函数的 prototype 属性，就是为将生产出来的实例指定原型所需要用到的，那些实例本身没有的属性或方法，就来这里查找。 也就是先有某原型，然后才有以该原型为原型的对象。 构造函数的 prototype 和实例对象的原型，其实是指向同一个对象的。 原型链 上面两节，我们搞清楚原型是什么，以及 构造函数 prototype 是什么了。那么原型链又是什么呢？ 那么原型本身也是一个对象，如果查找属性或方法时，到原型还没找到呢，那么就去原型的原型继续找。 而javascript 运行环境中是预设了一些对象来作为原型的,如图： 查找属性或方法时，向上追溯，经过的原型，就形成了一条链，所谓原型链。 至于运行环境预设了哪些原型，已经他们的关系如何，为什么？
1.1K10发布于 2021-11-02 - 来自专栏前端程序之路
原型与原型链
__proto__都指向实例的原型。 理解了原型的概念，下面我来理解原型链就好理解些了。 原型链 在JavaScript 中，每个对象通过__proto__属性指向它的原型对象，这个原型对象又有自己的原型，直到某个对象的原型为 null 为止，这种一级一级的链结构就称为原型链。 搜索会从原型链头开始，直到原型链的末端，寻找这个属性，这个例子中name属性就在对象本身找到的(person)，而age是在原型中找到的(Person.prototype)。 (prototype)是否在这个对象的原型链上。 总结 原型的存在是js的一个重点也是一个难点， 通过本篇，我们了解了原型与原型链，并且也介绍了一些原型常用的运用场景来加深我们对原型与原型链的理解。
85000发布于 2021-03-28 - 来自专栏前端小歌谣
原型和原型链
前言 我是歌谣 最好的种树是十年前 其次是现在 今天继续给大家带来的是原型和原型链的讲解 环境配置 npm init -y yarn add vite -D 修改page.json配置端口 {
40520编辑于 2023-11-11 - 来自专栏前端卡卡西
原型链
原型链 这里只是通过一些案例补充之前对原型，原型链，instanceof的细节。 <! ，即原型对象也是对象，是对象就可以通过原型链继承其原型上的属性和方法， * prototype是对象，所以prototype也可通过原型链继承其原型上的属性和方法 */ /** * 每个对象都可以通过原型链访问（或者说继承）其原型链上的属性和方法 * 使用构造函数创建的对象，可以通过原型链继承这个构造函数上的属性和方法 __proto__ === Father.prototype); //true /** * 这个构造函数的原型对象，即Father.prototype，也可通过原型链继续继承它 __proto__ === Array.prototype); //true // 同理，函数实际也是一个对象，因此，函数也可以通过其原型链访问其原型 console.log
47920编辑于 2022-02-25 - 来自专栏女程序员的日常_Lin
原型链
根据定义null没有原型，并作为原型链的最后一个环节。 几乎所有JS中的对象都是位于原型链顶端的Object的实例 基于原型链的继承 ---- 继承属性 JS对象有一个指向原型对象的链。 当试图访问一个对象的属性时，还会搜索该对象的原型，以及该对象的原型的原型，依次层层向上搜索，直到找到一个名字匹配的属性或者到达原型链的末尾。 f.prototype.c = 4; // 不要在f的原型上直接定义f.prototype = {b:3,c:4}；这样会直接破坏原型链 // o. [[prototype]]是null // 这就是原型链的末尾，即null // 根据定义，null就是没有[[prototype]] // 综上，这个原型链如下： // {a:1, b:2}---> / o这个对象继承了Object.prototype上面的所有属性 // Object.prototype的原型为null // 原型链如下 // o -->Object.prototype -->null
61020发布于 2020-03-12 - 来自专栏前端小歌谣
原型和原型链深入
前言 我是歌谣 最好的种树是十年前 其次是现在 今天继续给大家带来的是原型和原型链的深入讲解 环境配置 npm init -y yarn add vite -D 修改page.json配置端口
33710编辑于 2023-11-11 - 来自专栏Czy‘s Blog
JS原型与原型链
原型与原型链 JavaScript有着七种基本类型String、Number、Boolean、Null、Undefined、Symbol、Object，前六种为基本数据类型，Object为引用类型。 new Student(); console.log(stu1.from) // sdust console.log(stu2.from) // sdust __proto__ __proto__ 是原型链查询中实际用到的 Student.prototype.constructor === Student) // true console.log(stu.constructor === Student) // true 原型链 原型链可以简单理解为将原型连成一条链，js每一次获取对象中的属性都是一次查询过程，如果在自有属性中找不到就会去原型对象中查找，如果原型对象中还查不到，就回去原型对象的原型中查找，也就是按照原型链查找， 直到查找到原型链的顶端，也就是Object的原型。
2.3K50发布于 2020-08-27 - 来自专栏JS菌
图解原型和原型链
图解原型和原型链 原型和原型链是 JS 中不可避免需要碰到的知识点?，本文使用图片思维导图的形式缕一缕原型、原型链、实例、构造函数等等概念之间的关系? ： 20190314143837.png 我们把注释删掉，给实例同名属性，可以看到打印出来的属性就指向这个： 20190314143944.png 原型链 原型同样也可以通过 __proto__ 访问到原型的原型 、原型的原型、原型的原型的原型直到 Object 构造函数为止。 这个搜索的过程形成的链状关系就是原型链 20190314144733.png 如下图： 20190314145239.png 看到 null 了么，原型链搜索搜到 null 为止，搜不到那访问的这个属性就是不存在的 ： 20190314145540.png 以上，这就是原型、原型链、构造函数、实例、null 之间的关系。
71320发布于 2019-04-10 - 来自专栏藏经阁
【JavaScript】原型与原型链
实际上，这个prototype对象就是通过调用构造函数创建的对象的原型，使用原型对象的好处是，在它上面定义的属性和方法可以被所有实例对象共享。 理解原型 无论何时，只要创建一个函数，就会按照特定的规则为这个函数创建一个prototype属性（指向原型对象）。 ，而这在通过与原型实现继承时显得尤为重要（本章后面会介绍）。 ，这种影响是微妙且深远的，会影响所有继承了这个原型的实例对象。 原型层级 4. 原型和in操作符
67520编辑于 2023-03-14 - 来自专栏一路向前端
理解原型与原型链
原型设计带来的问题： 当查找一个对象的属性时，JavaScript 会根据原型链向上遍历对象的原型，直到找到给定名称的属性为止。 C对象只有一个d属性，执行for...in时先返回C.d，然后在从C的原型（B）中查找到并返回B.c，再从B的原型（A）中查找到并返回A.a和A.b，最后从A的原型（Object）中查找，发现Object 这就解释了原型链继承时查找属性的过程是先查找自身属性，当自身属性不存在时，会在原型链中逐级查找。 有时只需检查对象自身的属性，那么，这种消耗就是一种浪费，怎么解决呢？ hasOwnProperty 函数： hasOwnProperty 函数可以用来检查对象自身是否含有某个属性，返回值是布尔值，当属性不存在时不会向上查找对象原型链。 getOwnPropertyNames 函数： getOwnPropertyNames 函数可以获取对象所有的自身属性，返回值是由对象自身属性名称组成的数组，同样不会向上查找对象原型链。
80520发布于 2019-09-04 - 来自专栏前端卡卡西
js原型和原型链
每一个对象都会从原型对象上"继承"属性。 ; var person2 = new Person(); console.log(person1.name) // Kevin console.log(person2.name) // Kevin 原型链 __proto__ ，即 Person.prototype中查找，找到了 name 属性，结果为 Kevin。 原型和原型链 一张图搞懂： 函数与 Function 的关系 函数就是 Function 的实例. Object可以使用__proto__来访问对象的原型对象，即Object可通过__proto__访问Function的Function.prototype 原型继承的整个关系( 原型链 ) 可以知道所有的对象都有原型
2.6K10编辑于 2022-02-25 - 来自专栏clz
详解原型与原型链
详解原型与原型链 其实，刚开始学 JavaScript 时，就有学过原型与原型链的相关知识了，只是当时还没有养成写笔记的习惯，导致现在已经忘的七七八八了。 (因为 obj 自身是没有 constructor属性的，是通过原型链去它的原型上获取 constructor属性，所以覆盖该属性时，将不会再去原型链上查找) function Person(name) 实例对象在查找属性时，如果查找不到，就会沿着 __proto__去它的原型上查找，还找不到，则继续去原型的原型上查找，直到找到或到最顶层为止。这就是原型链的概念。 下面这张图就是原型链的简单图(找不到是在哪里截的图了，侵删) 原型链的作用 为对象设置默认值 利用原型为对象设置默认值。 __proto__ === Function.prototype); // true 经典原型链图 练手福利 题目来自JavaScript 之彻底理解原型与原型链 有加一道 function User
63930编辑于 2023-01-02 - 来自专栏cnblogs
Javascript的原型与原型链
再者，原型可能有一个非空隐式引用链接到它自己的原型，以此类推，这叫做 原型链 二、ES5中的Function与Object类型 理解Function与Object类型的之间的关系，对我们理解原型和原型链有很重要的帮助 __proto__); 输出结果如下： fn的原型：function () {} fn的原型链：function () {} fn的原型等于fn的原型链：true fn的原型的原型链：[object Object 四、产生的改变 ES5中用Function实现面向对象，而ES6提供了Class。 ES6的Class对原型与原型链更加规范化。 (obj)：读取对象的__proto__(原型对象) ES5中可以直接对__proto__赋值，但不建议这样使用。 ES5中对子类的prototype进行赋值后，还需要重定向prototype.constructor到子类的构造函数。
1.1K101发布于 2018-01-17 - 来自专栏菜鸟计划
javascript 原型及原型链详解
我们创建的每个函数都有一个 prototype （原型）属性，这个属性是一个指针，指向一个原型对象，而这个原型对象中拥有的属性和方法可以被所以实例共享。 当调用构造函数创建一个新实例后，该实例的内部将包含一个指针（内部属性），指向构造函数的原型对象。ECMA-262 第 5 版中管这个指针叫 [[Prototype]] 。 这是通过查找对象属性的过程来实现的。（会先在实例上搜索，如果搜索不到就会继续搜索原型。） alert(person2.friends); //"Shelby,Court,Van" alert(person1.friends === person2.friends); //true 五、原型链 然后层层递进，就构成了实例与原型的链条，这就是所谓原型链的基本概念。
1K80发布于 2018-04-10
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号