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

使用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()继承的笔记的更多相关文章

  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. jQuery中的100个技巧(译)

    1.当document文档就绪时执行JavaScript代码. 我们为什么使用jQuery库呢?原因之一就在于我们可以使jQuery代码在各种不同的浏览器和存在bug的浏览器上完美运行. <sc ...

  2. 2018春招-今日头条笔试题-第二题(python)

    题目描述:2018春招-今日头条笔试题5题(后附大佬答案-c++版) 解题思路: 利用深度优先搜索 #-*- coding:utf-8 -*- class DFS: ''' num:用于存储最后执行次 ...

  3. Chapter 3 Phenomenon——5

    I saw several things simultaneously. 我同时看见了几件事情. Nothing was moving in slow motion,the way it does i ...

  4. j2ee高级开发技术课程第二周(web请求的整个过程、XML)

    博客非原创,只是收集整理了一下网上的一些文章 一.web请求的整个过程 1)把URL分割成几个部分:协议.网络地址.资源路径.其中网络地址指示该连接网络上哪一台计算机,可以是域名或者IP地址,可以包括 ...

  5. Low Power之CPF/UPF

    1 CPF The Common Power Format is a standard promoted by the Low Power Coalition at Si2. CPF is also ...

  6. Object类上的方法

    1.getClass: public final native Class<?> getClass(); 返回当前对象运行时的类的对象. 2.hashCode: public native ...

  7. vs未能解析此远程名称: 'api.nuget.org'

    知道了DNS地址我们就可以来修改了,点击电脑右下角的连接图标,选择“打开网络和共享中心”,当然也可以在控制面板中“网络和Internet”进入“打开网络和共享中心”:   进入“网络和共享中心”后,我 ...

  8. java JDBC 数据库链接

    1.准备环境搭建: myeclipse,sql2005,jdbc. 2.都下载完之后开始进行安装 ,前两个是属于数据库软件,正常安装即可(注意数据库登陆不要使用windows验证) <1> ...

  9. Jquery Easy UI初步学习(三)数据增删改

    第二篇只是学了加载用datagrid加载数据,数据的增删改还没有做,今天主要是解决这个问题了. 在做增删改前需要弹出对应窗口,这就需要了解一下EasyUi的弹窗控件. 摘自:http://philoo ...

  10. 【转】关于JTA,XA,ACID

    对于我们这种初学者,可能会使用spring带给我们的@Transactional,可能了解JTA,可能会使用jotm.atomikos,又会遇到一些名词XA,支持XA的数据库驱动等等诸多问题,然后就会 ...