对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属性,这个属性引 ...
随机推荐
- Eureka的故事,专注能让你看到别人看不到的事情
有这么一句古老的箴言: 如果你手里有一把锤子,所有东西看上去都像钉子. 其实这句话已经是老调中的老调重弹了,我们程序员有很多锤子:OO.设计模式.语言(C, C++, Java, Python, Ru ...
- App上架出现问题-ERROR ITMS-90034
1.打开钥匙串,显示->显示已过期的证书,因为有些过期的证书会被钥匙串隐藏起来,让过期的证书都显示出来,删掉过期的证书. 2.经检查,我发现我的AppleWWDRCA.cer证书过期了,所以我就 ...
- Oracle官方文档在线查看
1.9i Oracle官方文档在线查看 http://www.oracle.com/pls/db92/homepage 2.10g Oracle官方文档线查看 http://www.oracle.co ...
- v$osstat
SQL> select * from v$osstat; STAT_NAME VALUE OSSTAT_ID COMMENTS CUM ----------------------------- ...
- CSS 编码规范
转自: https://segmentfault.com/a/1190000005046830 CSS书写格式 1.格式化代码 1.1文件 [建议]:CSS文件使用无BOM的UTF-8编码 1.2缩进 ...
- Java基础之线程——管理线程同步代码块(BankOperation4)
控制台程序. 除了同步类对象的方法之外,还可以把程序中的语句或代码块制定为synchronized,这种方式更强大,因为可以指定哪个对象从语句或代码块的同步中获益,而不像同步方法那样仅仅是包含代码的对 ...
- Python之urllib2
urllib2 - extensible library for opening URLs Note The urllib2 module has been split across several ...
- MySQL编码问题
client 下的default_character_set=utf8; 它是需要的,可是它的作用是干吗的? 它的作用等同执行以下3个命令 SET character_set_client = utf ...
- JS不兼容减号,css属性转驼峰写法
<script> function changeFormat(str) { return str.replace(/-(\w)/g, function(k, r) { return r.t ...
- SQL查询 练习题
设有一数据库,包括四个表:学生表(Student).课程表(Course).成绩表(Score)以及教师信息表(Teacher).四个表的结构分别如表1-1的表(一)~表(四)所示,数据如表1-2的表 ...