【原型链中的prototype、__proto__和constructor的关系】的更多相关文章

JS原型链中的prototype与_proto_的个人理解与详细总结

一直认为原型链太过复杂,尤其看过某图后被绕晕了一整子,今天清理硬盘空间(渣电脑),偶然又看到这图,勾起了点回忆,于是索性复习一下原型链相关的内容,表达能力欠缺逻辑混乱别见怪(为了防止新人__(此处指我)__被在此绕晕,图片就放在末尾了.) 以下三点需要谨记 1.每个对象都具有一个名为__proto__的属性: 2.每个构造函数(构造函数标准为大写开头,如Function(),Object()等等JS中自带的构造函数,以及自己创建的)都具有一个名为prototype的方法(注意:既然是方法,那么就…

关于JS中原型链中的prototype与_proto_的个人理解与详细总结

一直认为原型链太过复杂,尤其看过某图后被绕晕了一整子,今天清理硬盘空间(渣电脑),偶然又看到这图,勾起了点回忆,于是索性复习一下原型链相关的内容,表达能力欠缺逻辑混乱别见怪(为了防止新人__(此处指我)__被在此绕晕,图片就放在末尾了.) 以下三点需要谨记 1.每个对象都具有一个名为__proto__的属性: 2.每个构造函数(构造函数标准为大写开头,如Function(),Object()等等JS中自带的构造函数,以及自己创建的)都具有一个名为prototype的方法(注意:既然是方法,那么就…

JS中原型链中的prototype与_proto_的个人理解与详细总结（**************************************************************）

一直认为原型链太过复杂,尤其看过某图后被绕晕了一整子,今天清理硬盘空间(渣电脑),偶然又看到这图,勾起了点回忆,于是索性复习一下原型链相关的内容,表达能力欠缺逻辑混乱别见怪(为了防止新人__(此处指我)__被在此绕晕,图片就放在末尾了.) 以下三点需要谨记 1.每个对象都具有一个名为__proto__的属性: 2.每个构造函数(构造函数标准为大写开头,如Function(),Object()等等JS中自带的构造函数,以及自己创建的)都具有一个名为prototype的方法(注意:既然是方法,那么就…

原型链中的prototype、__proto__和constructor的关系

先来看一张图,这张图可以说是围绕以下代码完整的描述了各对象之间的关系.接下来我们来看看如何一步步画出这张图. function Foo(){}; var foo = new Foo(); 首先,明确几点概念(现在不懂没关系),后面会不断提到: 过程1:只要创建一个函数Foo,就会为该函数创建一个prototype属性,这个属性指向函数的原型对象: 过程2:原型对象会默认去取得constructor属性,指向构造函数. 过程3:当调用构造函数创建一个新实例foo后,该实例的内部将包含一个指针__p…

JS中原型链中的prototype与_proto_的个人理解与详细总结

1.对象的内部属性[[prototype]]和属性__proto__:每个对象都具有一个名为__proto__的属性: 2.函数的属性prototype:每个构造函数(构造函数标准为大写开头,如Function(),Object()等等JS中自带的构造函数,以及自己创建的)都具有一个名为prototype的方法(注意:既然是方法,那么就是一个对象(JS中函数同样是对象),所以prototype同样带有__proto__属性): 3.每个对象的__proto__属性指向自身构造函数的prototy…

原型链继承中的prototype、__proto__和constructor的关系

前不久写了有关原型链中prototype.__proto__和constructor的关系的理解,这篇文章说说在原型链继承中的prototype.__proto__和constructor的关系. 通过以下最简单的原型链继承(省略了属性和方法)来讨论: 1 function SuperType(){}; 2 function SubType(){}; //继承了SuperType 3 SubType.protoType = new SuperType(); //创建了一个SubType的实例 4…

深入理解JavaScript原型：prototype,__proto__和constructor

JavaScript语言的原型是前端开发者必须掌握的要点之一,但在使用原型时往往只关注了语法,其深层的原理并未理解透彻.本文结合笔者开发工作中遇到的问题详细讲解JavaScript原型的几个关键概念,如有错误,欢迎指正. 1. JavaScript原型继承 提到JavaScript原型,用处最多的场景便是实现继承.然而在实现继承时总有一些细节处理不到位,引起一些看起来莫名其妙的问题.比如使用下述代码: function Animal(){} Animal.prototype = {}; func…

javascript原型链中 this 的指向

为了弄清楚Javascript原型链中的this指向问题,我写了个代码来测试: var d = { d: 40 }; var a = { x: 10, calculate: function (z) { return this.x + this.y + z + this.d }, __proto__:d }; var b = { y: 20, __proto__: a }; var c = { y: 30, __proto__: a }; 运行如下的代码进行测试: console.log(b.c…

js delete删除对象属性，delete删除不了变量及原型链中的变量

js delete删除对象属性,delete删除不了变量及原型链中的变量 一.delete删除对象属性 function fun(){ this.name = 'gg'; } var obj = new fun(); console.log(obj.name);//gg delete obj.name; console.log(obj.name); //undefined 二.delete删除不了变量 var name = 'gg'; delete name; console.log(name)…

原型及原型链，以及prototype和__proto__属性（笔记便于以后复习）

首先,js的数据结构有 原始类型(5种):Boolean.Number.String.Null.Underfined, 然后是引用类型:Array.Date.Error.RegExp.Function.Object,注意这里,引用类型的返回值,其实只有2种,也就是Function和Object,用typeof就可以判断出. js一切都是对象,Function自然也是对象,甚至Function比Object的功能更强大,new Function出来的变量,比如: function Foo(){}…

JavaScript各种继承方式（一）：原型链继承（prototype chaining）

一 原理 子类的构造函数的原型对象,是父类的构造函数创建的实例. function Fruit(){ this.name = '水果'; this.nutrition=['维生素','膳食纤维']; } Fruit.prototype.eat = function(){ console.log('eat'); }; function Mango(){ } // 继承父类的方法 Mango.prototype = new Fruit(); // 修改父类的构造函数的原型对象的constructor…

再次理解JS的prototype,__proto__和constructor

个人总结: 下面这篇文章很好的讲解了js原型,原型链,个人的总结是要记住这三个属性 prototype.__proto__和constructor 首先明确,js中一切都是对象object(A). (这里用A来表示) 这个对象object分为 实例对象(B)(A和B是两个不同的对象...这个意思很难表达),函数,原型这三种类型. 只要是函数就有prototype属性,它指向,这个函数的原型. 只要是对象(A)就有__proto__属性,它指向实例化这个对象的函数的原型. 只要是原型就有const…

一张图理清js原型链（通过内置对象的引用关系）

很多同学估计写了几年js也没有搞清内置对象之间的原型链关系,鄙人抽空手绘了一张简图,以作参考: 简单说明一下,上图中annonymous()函数相当于是所有函数的根(它本身也是函数),他上面提供了一些针对函数的方法. %ArrayPrototype%等的命名是采用ecma-262规范中的名称. root object对象本身没有定义名称,这里我只是为了表示方便,取名root object,代表所有对象的根对象…

实践一些js中的prototype, __proto__, constructor

<!DOCTYPE html> <html> <head> <title>ExtJs</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <link rel="stylesheet" type="text/css" href="ExtJs/…

js prototype __proto__ instanceof constructor

JS中有两个特殊的对象:Object与Function,它们都是构造函数,用于生成对象. Object.prototype是所有对象的祖先,Function.prototype是所有函数的原型,包括构造函数. 可以将JS的对象分为三类:用户创建对象,构造函数对象,原型对象. 所有对象中都有一个__proto__属性,其指向此对象的原型. 构造函数对象有prototype,指向其原型对象,通过此构造函数创建对象时,新创建对象的__proto__属性将会指向构造函数的prototype属性. fun…

JavaScript原型链中toString()方法输出alert()和console.log()得到不同的结果

<script language="javascript"> function myObj(){ var total = 0; } myObj.prototype.add = function(a,b){ this.total = a + b; } myObj.prototype.toString = function(){ return this.total; } var obj = new myObj(); obj.add(1,2); console.log(obj);…

javascript 中isPrototypeOf 、hasOwnProperty、constructor、prototype等用法

hasOwnProperty:是用来判断一个对象是否有你给出名称的属性或对象,此方法无法检查该对象的原型链中是否具有该属性,该属性必须是对象本身的一个成员. isPrototypeOf是用来判断要检查其原型链的对象是否存在于指定对象实例中,是则返回true,否则返回false. instanceof  操作检查对象中是否有名为 property 的属性.也可以检查对象的原型,判断该属性是否为原型链的一部分. Java代码 hasOwnProperty:   var obj = {a:1,b:2}…

[我的理解]Javascript的原型与原型链

一.原型与原型链的定义 原型:为其他对象提供共享属性的对象 注:当构造器创建一个对象,为了解决对象的属性引用,该对象会隐式引用构造器的"prototype"属性.程序通过constructor.prototype可以直接引用到构造器的"prototype"属性.并且添加到对象原型里的属性,会通过继承与所有共享此原型的对象共享. 原型链:每个由构造器创建的对象,都有一个隐式引用(叫做对象的原型)链接到构造器的"prototype"属性.再者,原型可…

JavaScript-原型&原型链&原型继承

JavaScript-原型&原型链&原型继承 JavaScript的原型是一个重要的知识点,很多扩展应用都是从原型出发的.要说原型,我们先简单说一下函数创建过程.上一篇文章用闭包实现类和继承中用的是原型继承,今天就讲一讲原型继承.更多继承在后面的文章中更新. 函数创建过程 function Xzavier() {}; 1.创建一个对象(有constructor属性及[[Prototype]]属性),其中[[Prototype]]属性不可访问.不可枚举.2.创建一个函数(有name.prot…

JavaScript-原型对象与原型链

原型对象 1.每个对象一定会有一个原型对象 2.原型对象实际是构造实例对象的构造器中的一个属性,只不过这个属性是个对象 3.这个原型对象中的属性与方法,都会被对象实例所共享(类似python中的类方法,类属性) 4.但,原型对象的属性不是对象实例的属性,只要修改原型对象上的属性和方法,变动就会立刻体现在所有对象实例上. 5.JavaScript对每个创建的对象都会设置一个属性__proto__ ,指向它的原型对象xxx.prototype. 比如按照传统方法创建一个构造器 function Pe…

JS原型，原型链，类，继承，class，extends，由浅到深

一.构造函数和原型 1.构造函数.静态成员和实例成员 在ES6之前,通常用一种称为构造函数的特殊函数来定义对象及其特征,然后用构造函数来创建对象.像其他面向对象的语言一样,将抽象后的属性和方法封装到对象内部. function Person(uname, age) { this.uname = uname; this.age = age; this.say = function() { console.log('我叫' + this.uname + ',今年' + this.age + '岁.'…

一张图搞懂 Javascript 中的原型链、prototype、__proto__的关系 转载加自己的总结

1. JavaScript内置对象 所谓的内置对象 指的是:JavaScript本身就自己有的对象 可以直接拿来就用.例如Array String 等等.JavaScript一共有12内置对象    其中10个函数类型( String,Number,Boolean,Array,Function,Date,RegExp,Error,Object,Event )函数类型 有 __proto__和 prototype 属性 2个对象类型(Math,JSON) 对象类型只有__proto__属性. 下面…

Javascript中的原型链、prototype、__proto__的关系

javascript  2016-10-06  1120  9 上图是本宝宝用Illustrator制作的可视化信息图,希望能帮你理清Javascript对象与__proto__.prototype和原型链之间的关系.如果暂时看不懂也没关系,这篇文章让你从0变成1. 0.感性认识JS里的“德罗斯特效应”之原型链 如果你打开浏览器的控制面板,随便输入一个JS内置的构造器函数,比如Array,控制台输出的是一个名为Array的函数体,这好像并没有什么稀奇的,但是,当你接着输入Array.protot…

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

说到prototype,就不得不先说下new的过程. 我们先看看这样一段代码: 1 <script type="text/javascript"> 2 var Person = function () { }; 3 var p = new Person(); 4 </script> 很简单的一段代码,我们来看看这个new究竟做了什么?我们可以把new的过程拆分成以下三步: <1> var p={}; 也就是说,初始化一个对象p. <2>…

【转】理解js中的原型链，prototype与__proto__的关系

说到prototype,就不得不先说下new的过程. 我们先看看这样一段代码: 1 <script type="text/javascript"> 2 var Person = function () { }; 3 var p = new Person(); 4 </script> 很简单的一段代码,我们来看看这个new究竟做了什么?我们可以把new的过程拆分成以下三步: <1> var p={}; 也就是说,初始化一个对象p. <2>…

[转]理解js中的原型链，prototype与__proto__的关系

本文转自:http://rockyuse.iteye.com/blog/1426510 说到prototype,就不得不先说下new的过程. 我们先看看这样一段代码: 1 <script type="text/javascript"> 2 var Person = function () { }; 3 var p = new Person(); 4 </script> 很简单的一段代码,我们来看看这个new究竟做了什么?我们可以把new的过程拆分成以下三步: &…

javascript中prototype、constructor以及__proto__之间的三角关系

三者暧昧关系简单整理 在javascript中,prototype.constructor以及__proto__之间有着“著名”的剪不断理还乱的三角关系,楼主就着自己对它们的浅显认识,来粗略地理理以备忘,有不对之处还望斧正. 楼主的一句话理解就是:某个对象的constructor属性返回该对象构造函数,其__proto__属性是个对象,值和其构造函数的prototype属性值一致. 先来说说prototype.prototype的解释是“原型”,js的所有函数都有一个prototype属性,其属…

JavaScript 构造函数 prototype属性和_proto_和原型链 constructor属性 apply(),call()和bind() 关键字this

1.构造函数: 通常构造函数首字母需要大写,主要是为了区别ECMAScript的其它函数.(高程三 P145) 构造函数与其他函数的唯一区别,就在于调用它们的方式不同.只要通过new来调用,任何函数都是构造函数:而任何函数,如果不通过new来调用,那么它和普通函数也没有任何区别.(P146) 所谓"构造函数",其实就是一个普通函数,但是内部使用了this变量.对构造函数使用new运算符,就能生成实例,并且this变量会绑定在实例对象上. (就是一个普通的函数,与其他函数没有任何区别,可…

帮你彻底搞懂JS中的prototype、__proto__与constructor（图解）

作为一名前端工程师,必须搞懂JS中的prototype.__proto__与constructor属性,相信很多初学者对这些属性存在许多困惑,容易把它们混淆,本文旨在帮助大家理清它们之间的关系并彻底搞懂它们.这里说明一点,__proto__属性的两边是各由两个下划线构成(这里为了方便大家看清,在两下划线之间加入了一个空格:_ _proto_ _),本文基于谷歌浏览器(版本 72.0.3626.121)的实验结果所得.   现在正式开始! 让我们从如下一个简单的例子展开讨论,并配以相关的图帮助理解…

JS中的prototype、__proto__与constructor属性

作为一名前端工程师,必须搞懂JS中的prototype.__proto__与constructor属性,相信很多初学者对这些属性存在许多困惑,容易把它们混淆,本文旨在帮助大家理清它们之间的关系并彻底搞懂它们.这里说明一点,__proto__属性的两边是各由两个下划线构成(这里为了方便大家看清,在两下划线之间加入了一个空格:_ _proto_ _).   现在正式开始!让我们从如下一个简单的例子展开讨论,并配以相关的图帮助理解: function Foo() {...};let f1 = new…