javascript 关于new()继承的笔记
近期的一些学习总结,如有错误不严谨地方,希望指正!
使用new操作符会有如下操作:
1.创建一个对象temp = {},
2. temp.__proto__ = A.prototype,
3. A.call(temp, arguments),
4. return temp.
function a(name){
this.name="a";
}
function b(name){
this.name="b";
}
a.prototype.show=function(){
console.log("showaaaaa");
}
b.prototype.show=function(){
console.log("showbbbbb");
}
一:使用a = new b()的方式
a=new b();
console.log(a);
console.log(a.prototype);
console.log(a.__proto__);
console.log(a.constructor);
a.show();
a.prototype.show();
输出:
b {name: "b", show: function} // 使用a = new b()时相当于a原有的值被清空了,然后把b的this属性和原型属性赋给a,值和function都绑定在a的属性上
undefined //未定义a的prototype属性
b {show: function} //a = new b()的方式a有一个隐藏属性__proto__指向b.prototype
function b(name){ //同第一个
this.name="b";
}
showbbbbb //同第一个
Uncaught TypeError: Cannot read property 'show' of undefined //同第二个
二:使用 a.prototype = new b()
a.prototype=new b();
console.log(a);
console.log(a.prototype);
console.log(a.__proto__);
console.log(a.constructor);
// a.show();
a.prototype.show();
a.show();
输出:
function a(name){ //使用a.prototype=new b()时a原有的属性等未改变
this.name="a";
}
b {name: "b", show: function} // 但是a的prototype被b的this属性和原型属性完全覆盖了,所以a原有的prototype.show没有了
function Empty() {} //a没有__proto__属性,a.prototype才有__proto__属性指向b.prototype
function Function() { [native code] } //重写了a.prototype所以a.constructor为空,需要再定义一次a的constructor指向
showbbbbb //同第二条
Uncaught TypeError: undefined is not a function //a的没有show这个函数,a.prototype才有
三:a = new b()和a.prototype = new b()一起用
a=new b(); ①
a.prototype=new b(); ②
console.log(a);
console.log(a.prototype);
console.log(a.__proto__);
console.log(a.prototype.__proto__);
console.log(a.constructor);
a.prototype.show();
a.show();
输出:
b {name: "b", prototype: b, show: function} //①里a被b的的this和原型属性覆盖,然后②里又给a添加了一个prototype属性
b {name: "b", show: function} //②里被赋予了prototype
b {show: function} //a和a.prototype都有了一个__proto__属性
b {show: function}
function b(name){
this.name="b";
}
showbbbbb //由②得来
showbbbbb //由①得来
javascript 关于new()继承的笔记的更多相关文章
- 【转载】Javascript原型继承-学习笔记
阮一峰这篇文章写的很好 http://www.ruanyifeng.com/blog/2011/06/designing_ideas_of_inheritance_mechanism_in_javas ...
- JavaScript继承学习笔记
JavaScript作为一个面向对象语言(JS是基于对象的),可以实现继承是必不可少的,但是由于本身并没有类的概念,所以不会像真正的面向对象编程语言通过类实现继承,但可以通过其他方法实现继承.(jav ...
- 浅谈 JavaScript 中的继承模式
最近在读一本设计模式的书,书中的开头部分就讲了一下 JavaScript 中的继承,阅读之后写下了这篇博客作为笔记.毕竟好记性不如烂笔头. JavaScript 是一门面向对象的语言,但是 ES6 之 ...
- Javascript prototype 及 继承机制的设计思想
我一直很难理解Javascript语言的继承机制. 它没有"子类"和"父类"的概念,也没有"类"(class)和"实例" ...
- 《javascript权威指南》读书笔记——第二篇
<javascript权威指南>读书笔记——第二篇 金刚 javascript js javascript权威指南 今天是今年的196天,分享今天的读书笔记. 第2章 词法结构 2.1 字 ...
- 《javascript权威指南》读书笔记——第一篇
<javascript权威指南>读书笔记——第一篇 金刚 javascript js javascript权威指南 由于最近想系统学习下javascript,所以开始在kindle上看这本 ...
- 【09-23】js原型继承学习笔记
js原型继承学习笔记 function funcA(){ this.a="prototype a"; } var b=new funcA(); b.a="object a ...
- javascript 之 prototype继承机制
理解Javascript语言的继承机制 javascript没有"子类"和"父类"的概念,也没有"类"(class)和"实例&qu ...
- JavaScript寄生组合式继承分析
JavaScript寄生组合式继承特点: 避免了在子类prototype上创建不必要多余的属性,相比直接继承基类的实例效率要高. 是JavaScript 实现继承的最有效方式. <script& ...
随机推荐
- (转)MySQL 5.6 OOM 问题解决分享
本文来自:杨德华的原创分享 | MySQL 5.6 OOM 问题解决分享 原文:http://www.cnblogs.com/zhoujinyi/p/5763112.html 延伸阅读:Linux的内 ...
- (转)Mysql备份还原数据库之mysqldump实例及参数详细说明
http://www.xuejiehome.com/blfl-2.html http://www.cnblogs.com/xuejie/archive/2013/01/11/2856911.html ...
- C++的开源跨平台日志库glog学习研究(三)--杂项
在前面对glog分别做了两次学习,请看C++的开源跨平台日志库glog学习研究(一).C++的开源跨平台日志库glog学习研究(二)--宏的使用,这篇再做个扫尾工作,算是基本完成了. 编译期断言 动态 ...
- 转载 linux umount 时出现device is busy 的处理方法--fuser
http://www.cnblogs.com/spicy/p/6894333.html (原文链接) 当任何目录有 mount, 然后有程序使用/挂在那个目录上的话, 就没有办法 umount 掉, ...
- 【数组】Game of Life
题目: According to the Wikipedia's article: "The Game of Life, also known simply as Life, is a ce ...
- ES6 箭头函数(Arrow Functions)
ES6 箭头函数(Arrow Functions) ES6 可以使用 "箭头"(=>)定义函数,注意是函数,不要使用这种方式定义类(构造器). 一.语法 具有一个参数的简单函 ...
- 数据库学习---SQL基础(二)
数据库学习---SQL基础(一) 数据库学习---SQL基础(二) 数据库学习---SQL基础(三) 上篇复习的sql的增删改查,and ,or ,>=, <=,!=等逻辑运算符,还有in ...
- Python函数中的可变参数
在Python函数中,还可以定义可变参数. 如:给定一组数字a,b,c……,请计算a2 + b2 + c2 + ……. 要定义出这个函数,我们必须确定输入的参数.由于参数个数不确定,我们首先想到可以把 ...
- 玩转mongodb(四):细说插入、更新、删除和查询
插入: 使用insert或save方法想目标集合插入一个文档: db.person.insert({"name":"ryan","age": ...
- 转载《浅析MVC框架中View层的优雅设计及实例》
在基于B/S的应用程序开发中,从基本的技术分工上来说就是两大块,一是软件显示界面,另一个是程序逻辑.在N年前的脚本语言时代,无论是asp.php还是jsp,我们基本是都是把这两者柔和在一起的.尽管我们 ...