对js原型的理解
1.值类型和引用类型,引用类型都是对象,通过typeof()测试类型,instanceof测试是否是对象。对象是属性的集合。
2.对象都是由函数创建的,函数又是一个对象。
3.函数有一个默认的属性,叫prototype,这个prototype的属性值是一个对象,即属性的集合,默认只有constructor这个属性,指向函数本身,prototype里面可以增加自己的属性。
function Fn(){}
Fn.prototype.name="王福朋";
Fn.prototype.getYear = function(){return 1988;};

var fn=new Fn();
console.log(fn.name);
console.(fn.getYear());
Fn是一个函数,fn对象从Fn函数new出来,这样fn对象就可以调用Fn.prototype中的属性。
每个对象都有一个隐藏的属性叫"__proto__",这个属性引用了创建这个对象的函数的prototype,即fn._proto_===Fn.prototype。
每个对象都有一个'__proto__',可成为"隐式原型"。
var obj={};
console.log(obj.__proto__);
用console.log(obj.__proto__)查看,返回值与Object.prototype的属性一样。
即obj.__proto__===Object.prototype;所以,每个对象都有一个__proto__属性指向创建该对象的函数的prototype;
自定义函数的prototype本质是和var obj={}是一样的,由Object创建,所以它的__proto__指向的是Object.prototype,而Object.prototype是一个特例,它的__proto__指向null。

(图片来自 王福朋的博客园)


自定义函数Foo.__proto__指向Function.prototype,Object.__proto__指向Function.prototype,Function.__proto__指向Function.prototype.
Function.prototype指向的对象的__proto__指向Object.prototype.
4.typeof对引用类型只能检测是否是对象或者函数,不能检测出是数组还是New Number等等,用Instanceof可以。
instanceof运算符的第一个变量是一个对象A第二个变量一般是一个函数B,判断规则是:
沿着A 的__proto__这条线来找,同时沿着B的prototype这条线来找,如果两条线能找到同一个引用,即同一个对象,那么就返回true,如果找到重点还未重合,则返回false。

instanceof表示的是一种继承关系,或者原型链的结构。
5.原型链 即是访问一个对象的属性时,先在基本属性中查找,如果没有,再沿着__proto__这条线向上找。
通过hasOwnProperty,能够区分属性到底是基本的还是从原型中找到的。
function Foo(){}
var f1=new Foo();
f1.a=10;
Foo.prototype.a=100;
Foo.prototype.b=200;
var item;
for(itrm in f1){
console.log(item);//输除a b;如果为if(f1.hasOwnProperty(item)){console.log(item);};则只返回a;
}
f1的hasOwnProperty方法来自于Object.prototype。
所有对象的原型链都会找到Object.prototype,因此所有对象都有有Object.prototyp的方法,这就是所谓的"继承"。
对象或者函数被new出来后,可能没有属性,可以自己添加。如果继承方法不合适,可以进行修改。
function Foo(){}
var f=new Foo(){
return:'name';
};
console.log(f1.toString());//name
6.执行上下文
即在"准备工作"中完成的工作:
变量、函数表达式--变量声明,默认赋值为undefined
this--赋值
函数声明--赋值;
JavaScript在执行一个代码段之前,都会进行这些—“准备工作”来执行上下文,这个“代码段”分三种情况--全局代码(<script>//代码段</script>),函数体,eval代码。
对js原型的理解的更多相关文章
- 37.js----浅谈js原型的理解
浅谈Js原型的理解 一.js中的原型毫无疑问一个难点,学习如果不深入很容易就晕了! 在参考了多方面的资料后,发现解释都太过专业,对于很多还没有接触过面向对象 语言的小白来说,有理解不了里面 ...
- js原型链理解(2)--原型链继承
1.原型链继承 2.constructor stealing(构造借用) 3.组合继承 js中的原型链继承,运用的js原型链中的__proto__. function Super(){ this.se ...
- 浅谈Js原型的理解
一.js中的原型毫无疑问一个难点,学习如果不深入很容易就晕了! 在参考了多方面的资料后,发现解释都太过专业,对于很多还没有接触过面向对象 语言的小白来说,有理解不了里面的专有名词!如果你没 ...
- 浅谈对js原型的理解
一. 在JavaScript中,一切皆对象,每个对象都有一个原型对象(prototype),而指向该原型对象的内部指针则是__proto__.当我们对对象进行for in 或者for of遍历时,就 ...
- js原型链理解(3)--构造借用继承
构造借用(constructor strealing) 1.为什么已经存在原型链继承还要去使用构造借用 首先看一下这个例子 function Super(){ this.sets = [0,1,2]; ...
- JS原型链理解
1. 每个对象都有原型属性(__proto__)2. 对象的原型(__proto__)指向其构造函数(Class)的prototype属性3. 构造函数(Class)的prototype属性本身也是一 ...
- js原型链理解(4)-经典继承
经典继承就是组合继承,就是组合构造函数和原型链的优点混合继承. 1.避免引用类型的属性初始化 2.避免相同方法的多次初始化 function Super(name){ this.ages = [100 ...
- 简单粗暴地理解js原型链--js面向对象编程
原型链理解起来有点绕了,网上资料也是很多,每次晚上睡不着的时候总喜欢在网上找点原型链和闭包的文章看,效果极好. 不要纠结于那一堆术语了,那除了让你脑筋拧成麻花,真的不能帮你什么.简单粗暴点看原型链吧, ...
- 对于js原型和原型链继承的简单理解(第一种,原型链继承)
原型是js中的难点加重点,也是前端面试官最爱问的问题之一,因为面试官可以通过被面试者对原型的理解.来判断被面试者对js的熟悉程度. 原型的定义 Js所有的函数都有一个prototype属性,这个属性引 ...
随机推荐
- 理解MapReduce
理解MapReduce Hadoop的MapReduce过程具有如下形式: 1) map: (K1, V1) => list(K2, V2) 2) redu ...
- HTML调用servlet(二)
5.修改数据 5.1编写查询条件页面 修改单条数据的时候,首先是查询出单个数据的详细信息,然后根据实际需要部分修改或者全部修改.修改之后,数据会提交到数据库,数据库中保存更新以后的数据. 查询出单条数 ...
- Fzu oj2194星系碰撞(排序+并查集+路径压缩)
Problem 2194 星系碰撞 Accept: 14 Submit: 48Time Limit: 30000 mSec Memory Limit : 327680 KB Proble ...
- csuoj 1395: Timebomb
http://acm.csu.edu.cn/OnlineJudge/problem.php?id=1395 1395: Timebomb Time Limit: 1 Sec Memory Limit ...
- [原创]java WEB学习笔记84:Hibernate学习之路-- -映射 一对一关系 ,基外键的方式实现
本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱 ...
- AJax 学习笔记二(onreadystatechange的作用)
AJax 学习笔记二(onreadystatechange的作用) 当发送一个请求后,客户端无法确定什么时候会完成这个请求,所以需要用事件机制来捕获请求的状态XMLHttpRequest对象提供了on ...
- Junit单元测试-环境配置
JUnit是Java单元测试框架,已经在Eclipse中默认安装.目前主流的有JUnit3和JUnit4.JUnit3中,测试用例需要继承TestCase类.JUnit4中,测试用例无需继承TestC ...
- 夺命雷公狗jquery---1选择元素的3种方法
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- java 操作excel 文件
JAVA EXCEL API:是一开放源码项目,通过它Java开发人员可以读取Excel文件的内容.创建新的Excel文件.更新已经存在的Excel文件.使用该API非Windows操作系统也可以通过 ...
- form 表单jquery验证插件使用
第一部分:表单样式 <form action="#" method="post" id="regist"> <tabl ...