近期的一些学习总结,如有错误不严谨地方,希望指正!

使用new操作符会有如下操作:

1.创建一个对象temp = {},
2. temp.__proto__ = A.prototype,
3. A.call(temp, arguments),
4. return temp.

  1. function a(name){
  2. this.name="a";
  3. }
  4. function b(name){
  5. this.name="b";
  6. }
  7. a.prototype.show=function(){
  8. console.log("showaaaaa");
  9. }
  10. b.prototype.show=function(){
  11. console.log("showbbbbb");
  12. }

一:使用a = new b()的方式

  1. a=new b();
  2. console.log(a);
  3. console.log(a.prototype);
  4. console.log(a.__proto__);
  5. console.log(a.constructor);
      a.show();
  6. a.prototype.show();

输出:

  1. b {name: "b", show: function} // 使用a = new b()时相当于a原有的值被清空了,然后把b的this属性和原型属性赋给a,值和function都绑定在a的属性上
  2. undefined //未定义a的prototype属性
  3. b {show: function} //a = new b()的方式a有一个隐藏属性__proto__指向b.prototype
  4. function b(name){ //同第一个
  5. this.name="b";
  6. }
  7. showbbbbb //同第一个
  8. Uncaught TypeError: Cannot read property 'show' of undefined //同第二个

二:使用 a.prototype = new b()

  1. a.prototype=new b();
  2. console.log(a);
  3. console.log(a.prototype);
  4. console.log(a.__proto__);
  5. console.log(a.constructor);
  6. // a.show();
  7. a.prototype.show();
  8. a.show();

输出:

  1. function a(name){ //使用a.prototype=new b()时a原有的属性等未改变
  2. this.name="a";
  3. }
  4. b {name: "b", show: function} // 但是a的prototype被b的this属性和原型属性完全覆盖了,所以a原有的prototype.show没有了
  5. function Empty() {} //a没有__proto__属性,a.prototype才有__proto__属性指向b.prototype
  6. function Function() { [native code] } //重写了a.prototype所以a.constructor为空,需要再定义一次a的constructor指向
  7. showbbbbb //同第二条
  8. Uncaught TypeError: undefined is not a function //a的没有show这个函数,a.prototype才有

三:a = new b()和a.prototype = new b()一起用

  1. a=new b();
  2. a.prototype=new b();
  3. console.log(a);
  4. console.log(a.prototype);
  5. console.log(a.__proto__);
       console.log(a.prototype.__proto__);
  6. console.log(a.constructor);
  7. a.prototype.show();
  8. a.show();

输出:

  1. b {name: "b", prototype: b, show: function} //①里a被b的的this和原型属性覆盖,然后②里又给a添加了一个prototype属性
  2. b {name: "b", show: function} //②里被赋予了prototype
  3. b {show: function} //a和a.prototype都有了一个__proto__属性
    b {show: function}
  4. function b(name){
  5. this.name="b";
  6. }
  7. showbbbbb //由②得来
  8. showbbbbb //由①得来

javascript 关于new()继承的笔记的更多相关文章

  1. 【转载】Javascript原型继承-学习笔记

    阮一峰这篇文章写的很好 http://www.ruanyifeng.com/blog/2011/06/designing_ideas_of_inheritance_mechanism_in_javas ...

  2. JavaScript继承学习笔记

    JavaScript作为一个面向对象语言(JS是基于对象的),可以实现继承是必不可少的,但是由于本身并没有类的概念,所以不会像真正的面向对象编程语言通过类实现继承,但可以通过其他方法实现继承.(jav ...

  3. 浅谈 JavaScript 中的继承模式

    最近在读一本设计模式的书,书中的开头部分就讲了一下 JavaScript 中的继承,阅读之后写下了这篇博客作为笔记.毕竟好记性不如烂笔头. JavaScript 是一门面向对象的语言,但是 ES6 之 ...

  4. Javascript prototype 及 继承机制的设计思想

    我一直很难理解Javascript语言的继承机制. 它没有"子类"和"父类"的概念,也没有"类"(class)和"实例" ...

  5. 《javascript权威指南》读书笔记——第二篇

    <javascript权威指南>读书笔记——第二篇 金刚 javascript js javascript权威指南 今天是今年的196天,分享今天的读书笔记. 第2章 词法结构 2.1 字 ...

  6. 《javascript权威指南》读书笔记——第一篇

    <javascript权威指南>读书笔记——第一篇 金刚 javascript js javascript权威指南 由于最近想系统学习下javascript,所以开始在kindle上看这本 ...

  7. 【09-23】js原型继承学习笔记

    js原型继承学习笔记 function funcA(){ this.a="prototype a"; } var b=new funcA(); b.a="object a ...

  8. javascript 之 prototype继承机制

    理解Javascript语言的继承机制 javascript没有"子类"和"父类"的概念,也没有"类"(class)和"实例&qu ...

  9. JavaScript寄生组合式继承分析

    JavaScript寄生组合式继承特点: 避免了在子类prototype上创建不必要多余的属性,相比直接继承基类的实例效率要高. 是JavaScript 实现继承的最有效方式. <script& ...

随机推荐

  1. linux中查找某端口,并关闭对应的端口

    1,netstat -ntlp  (n表示不反向域名杰斯 t表示查看tcp协议的连接 l查看正在监听端口 p获取进程号和端口) 2,然后直接kill -9 端口号 参考全文:https://linux ...

  2. 使用subgit进行svn迁移至git(branch,tags)

    前言: 最近公司需要将整体项目从svn迁移至gitlab上,经过几天的研究,现记录一下流程 整体思路是进行一次导入: 先通过subgit将svn整个import至本地,在与git上的项目进行合并. 1 ...

  3. Docker笔记:常用命令汇总

    Docker常用命令汇总 启动服务 [root@localhost ~]# service docker start Redirecting to /bin/systemctl start docke ...

  4. springboot-15-启动时加载数据的方法CommandLineRunner

    有时需要爱项目启动时, 去加载一些配置文件什么的, 可以使用监听器的方式加载, 这是可以通过实现接口 CommandLineRunner来实现需求: Spring Boot应用程序在启动后,会遍历Co ...

  5. gocommand:一个跨平台的golang命令行执行package

    最近在做一个项目的时候,需要使用golang来调用操作系统中的命令行,来执行shell命令或者直接调用第三方程序,这其中自然就用到了golang自带的exec.Command. 但是如果直接使用原生e ...

  6. 个人总结(Alpha阶段)

    Alpha总结 我们在alpha 结束之后, 每位写一个博客, 回顾并总结自己的alpha 过程,哪些方面做的好的,哪些方面做得不足需要改进的 提出问题 同时,大家一定会在过程中产生了很多问题, 结合 ...

  7. 2019.2.1 现有vue-cli项目引入ESLint

    ESLint 不管是多人合作还是个人项目,代码规范是很重要的.这样做不仅可以很大程度地避免基本语法错误,也保证了代码的可读性. 可能在早期建立项目的时候,因为一些原因没有引入eslint.单元测试等, ...

  8. ELK 方案

    转自:https://blog.csdn.net/enweitech/article/details/81744250 今天临时收到一个企业客户的项目需求,需要对所有WIndows业务服务器的日志进行 ...

  9. CSS3文本属性

    text-shadow(文本阴影) <h1>我有文字阴影</h1> h1{ color:#ffff00; text-shadow:1px 2px 2px #000000; } ...

  10. C# list的合并

    转自:https://www.cnblogs.com/liguanghui/archive/2011/11/09/2242309.html List<int> listA = new Li ...