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& ...
随机推荐
- linux中查找某端口,并关闭对应的端口
1,netstat -ntlp (n表示不反向域名杰斯 t表示查看tcp协议的连接 l查看正在监听端口 p获取进程号和端口) 2,然后直接kill -9 端口号 参考全文:https://linux ...
- 使用subgit进行svn迁移至git(branch,tags)
前言: 最近公司需要将整体项目从svn迁移至gitlab上,经过几天的研究,现记录一下流程 整体思路是进行一次导入: 先通过subgit将svn整个import至本地,在与git上的项目进行合并. 1 ...
- Docker笔记:常用命令汇总
Docker常用命令汇总 启动服务 [root@localhost ~]# service docker start Redirecting to /bin/systemctl start docke ...
- springboot-15-启动时加载数据的方法CommandLineRunner
有时需要爱项目启动时, 去加载一些配置文件什么的, 可以使用监听器的方式加载, 这是可以通过实现接口 CommandLineRunner来实现需求: Spring Boot应用程序在启动后,会遍历Co ...
- gocommand:一个跨平台的golang命令行执行package
最近在做一个项目的时候,需要使用golang来调用操作系统中的命令行,来执行shell命令或者直接调用第三方程序,这其中自然就用到了golang自带的exec.Command. 但是如果直接使用原生e ...
- 个人总结(Alpha阶段)
Alpha总结 我们在alpha 结束之后, 每位写一个博客, 回顾并总结自己的alpha 过程,哪些方面做的好的,哪些方面做得不足需要改进的 提出问题 同时,大家一定会在过程中产生了很多问题, 结合 ...
- 2019.2.1 现有vue-cli项目引入ESLint
ESLint 不管是多人合作还是个人项目,代码规范是很重要的.这样做不仅可以很大程度地避免基本语法错误,也保证了代码的可读性. 可能在早期建立项目的时候,因为一些原因没有引入eslint.单元测试等, ...
- ELK 方案
转自:https://blog.csdn.net/enweitech/article/details/81744250 今天临时收到一个企业客户的项目需求,需要对所有WIndows业务服务器的日志进行 ...
- CSS3文本属性
text-shadow(文本阴影) <h1>我有文字阴影</h1> h1{ color:#ffff00; text-shadow:1px 2px 2px #000000; } ...
- C# list的合并
转自:https://www.cnblogs.com/liguanghui/archive/2011/11/09/2242309.html List<int> listA = new Li ...