关于JS面向对象中原型和原型链以及他们之间的关系及this的详解
2017-05-13 19:25
519 查看
一:原型和原型对象:
1.函数的原型prototype:函数才有prototype,prototype是一个对象,指向了当前构造函数的引用地址。
2.函数的原型对象__proto__:所有对象都有__proto__属性, 当用构造函数实例化(new)一个对象时,会将新对象的__proto__属性指向 构造函数的prototype。
注:在上述代码中Person是构造函数,zhangsan则是该构造函数的一个实例化对象。
以下用一张图来解释原型对象和函数的原型之间的关系:
由以上图片可以清楚的看出来函数原型和原型对象之间的联系:
zhangsan是构造函数的一个实例化对象,它的__proto__则是指向它的构造函数prototype,即Person.prototype;
构造函数Person()的__proto__指向函数总类Function的prototype,而Function()本身也会指向Function的prototype,
Person.prototype和Function.prototype都hi会指向Object总类的prototype,即Object.prototype,Object()的__proto__指向Function.prototype
Object.prototype的__proto__会指向null。
综上:
①所有函数的__proto__都是指向Function的prototype。
②构造函数new出来的对象__proto__指向构造函数的prototype。
③非构造函数实例化出的对象或者对象的prototype的__proto__指向Object的prototype。
④Object的prototype指向null。
二:this详解:
1.谁最终调用函数,this指向谁。
①this指向的永远只可能是对象!!!
②this指向谁永远不取决于this写在哪,而是取决于函数在哪调用
③this指向的对象,称之为函数的上下文context,也叫函数的调用者
2.this指向的规律(与函数调用的方式息息相关):
this指向的情况,取决于函数调用方式有哪些,
①通过函数名()直接调用:this指向window
②通过对象.函数名()调用的:this指向这个对象
③函数通过数组的一个元素,通过数组下标调用的,this指向这个数组
④函数作为window内置函数的回调函数调用时,this指向window如setTimeout setInterval 等
⑤函数作为构造函数用new关键字调用时,this指向新new出的对象。
实例:
①通过函数名()直接调用:this指向window。
②通过对象.函数()调用的:this指向这个对象。
狭义对象:
广义对象:
③函数通过数组的一个元素,通过数组下标调用的,this指向这个数组 。
④函数作为window内置函数的回调函数调用时,this指向window。
⑤函数作为构造函数用new关键字调用时,this指向新new出的对象。
以上就是原型链和this的 详解。
1.函数的原型prototype:函数才有prototype,prototype是一个对象,指向了当前构造函数的引用地址。
2.函数的原型对象__proto__:所有对象都有__proto__属性, 当用构造函数实例化(new)一个对象时,会将新对象的__proto__属性指向 构造函数的prototype。
以下用一张图来解释原型对象和函数的原型之间的关系:
由以上图片可以清楚的看出来函数原型和原型对象之间的联系:
zhangsan是构造函数的一个实例化对象,它的__proto__则是指向它的构造函数prototype,即Person.prototype;
构造函数Person()的__proto__指向函数总类Function的prototype,而Function()本身也会指向Function的prototype,
Person.prototype和Function.prototype都hi会指向Object总类的prototype,即Object.prototype,Object()的__proto__指向Function.prototype
Object.prototype的__proto__会指向null。
综上:
①所有函数的__proto__都是指向Function的prototype。
②构造函数new出来的对象__proto__指向构造函数的prototype。
③非构造函数实例化出的对象或者对象的prototype的__proto__指向Object的prototype。
④Object的prototype指向null。
二:this详解:
1.谁最终调用函数,this指向谁。
①this指向的永远只可能是对象!!!
②this指向谁永远不取决于this写在哪,而是取决于函数在哪调用
③this指向的对象,称之为函数的上下文context,也叫函数的调用者
2.this指向的规律(与函数调用的方式息息相关):
this指向的情况,取决于函数调用方式有哪些,
①通过函数名()直接调用:this指向window
②通过对象.函数名()调用的:this指向这个对象
③函数通过数组的一个元素,通过数组下标调用的,this指向这个数组
④函数作为window内置函数的回调函数调用时,this指向window如setTimeout setInterval 等
⑤函数作为构造函数用new关键字调用时,this指向新new出的对象。
实例:
狭义对象:
相关文章推荐
- 关于JS面向对象中原型和原型链以及他们之间的关系及this的详解
- JS面向对象(2) -- this的使用,对象之间的赋值,for...in语句,delete使用,成员方法,json对象的使用,prototype的使用,原型继承与原型链
- 关于js中,原型对象,原型链,构造函数,实例之间关系的理解与区别
- js的 function, javascript内置对象apply,call,this概念及之间的关系详解
- JavaScript的原型链继承__propt__、prototype、constructor的理解、以及他们之间相互的关系。
- js的 function, javascript内置对象,this概念及之间的关系
- JS面向对象-原型对象,实例对象,构造函数的关系
- 学习JavaScript 的必备 (一),让您对js的 function, javascript内置对象,this概念及之间的关系不再迷惑
- 关于StatusBar,TitleBar,ActionBar之间的区别以及他们的高度的计算。
- 关于gcc、glibc和binutils模块之间的关系,以及在现有系统上升级glibc
- 关于 printk函数 与 控制台 以及 kernel.printk 的关系 详解
- 关于gcc、glibc和binutils模块之间的关系,以及在现有系统上如何升级的总结
- 对js的 function.javascript内置对象,this概念及之间的关系不再迷惑
- JS 之原型,实例,构造函数之间的关系
- 页面自动跳转与http302、html refresh以及js跳转之间的关系
- 关于Cocos2d 开发中有关精灵、精灵帧、精灵帧缓存、精灵表单以及plist文件之间的关系
- 你可知道类和对象,以及他们之间的关系?
- 让您对js的 function, javascript内置对象,this概念及之间的关系不再迷惑
- 关于gcc、glibc和binutils模块之间的关系,以及在现有系统上如何升级的总结
- 关于gcc、glibc和binutils模块之间的关系,以及在现有系统上如何升级的总结