JS原型继承四步曲及原型继承图一览


Posted in Javascript onNovember 28, 2017

一:js原型继承四步曲

//js模拟类的创建以及继承
 //动物(Animal),有头这个属性,eat方法
 //名字这个属性
 //猫有名字属性,继承Animal,抓老鼠方法
 
 //第一步:创建父类
 function Animal(name){
  this.name = name;
 }
 //给父类添加属性方法
 Animal.prototype.eat = function(){
  console.log(this.name + " eating...");
 
 }
 //第二步:创建子类 
 function Cat(name){
  Animal.call(this,name);

 }
 //第三步:确定继承的关系
 Cat.prototype = Object.create(Animal.prototype);
 
 //第四步:改造构造器
 //改变了某个构造器的原型之后,紧接着的代码一定是改构造器
 Cat.prototype.constructor = Cat;
 
 Cat.prototype.zhualaoshu = function(){
  console.log(this.name + " 抓 老鼠");
 }
 
 var mao = new Cat("猫");
 mao.eat();
 mao.zhualaoshu();

JS原型继承四步曲及原型继承图一览 

二: 原型继承图


JS原型继承四步曲及原型继承图一览

下图辅助理解

JS原型继承四步曲及原型继承图一览

练习提巩固理解、

函数Foo的__proto的值等于Foo.prototype,对吗? 不对
Object的prototype可以修改吗?能与不能原因是什么 不可以
顶级constructor是谁? Function()
顶级原型对象是谁? Object.prototype
对象的construtor成员是个属性还是个方法? 方法
Function有没有__proto__,为什么?值等于Object.prototype吗? 有,是Function.prototype;
所有的构造器的__proto__都等于其对应的prototype 不对
创建类形式的继承的四部曲是什么? 创建父类——>创建子类——>确定继承关系——>改构造器
Function的constructor与prototype值可以修改吗? 可以
Object.prototype === Object.__proto__吗? 不对
Function.prototype === Function.__proto__吗?
function F(){}; var f1 = new F();f1.__proto__ === Object.prototype吗? 不对

以上这篇JS原型继承四步曲及原型继承图一览就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
一个轻量级的javascript库 pj介绍
Dec 19 Javascript
基于jQuery的倒计时插件代码
May 07 Javascript
jQuery中filter()和find()的区别深入了解
Sep 25 Javascript
fmt:formatDate的输出格式详解
Jan 09 Javascript
深入理解JavaScript系列(30):设计模式之外观模式详解
Mar 03 Javascript
javascript汉字拼音互转的简单实例
Oct 09 Javascript
JavaScript字符串_动力节点Java学院整理
Jun 27 Javascript
解决vue-cli项目打包出现空白页和路径错误的问题
Sep 04 Javascript
JS左右无缝轮播功能完整实例
May 16 Javascript
JS利用prototype给类添加方法操作详解
Jun 21 Javascript
vue.js中ref及$refs的使用方法解析
Oct 08 Javascript
探究一道价值25k的蚂蚁金服异步串行面试题
Aug 21 Javascript
weebox弹出窗口不居中显示的解决方法
Nov 27 #Javascript
Dropify.js图片宽高自适应的方法
Nov 27 #Javascript
jfinal与bootstrap的登出实战详解
Nov 27 #Javascript
JQuery 又谈ajax局部刷新
Nov 27 #jQuery
Bootstrap实现翻页效果
Nov 27 #Javascript
jQuery Datatables表头不对齐的解决办法
Nov 27 #jQuery
JS使用贪心算法解决找零问题示例
Nov 27 #Javascript
You might like
PHP新手上路(八)
2006/10/09 PHP
php中http_build_query 的一个问题
2012/03/25 PHP
php简单防盗链实现方法
2015/07/29 PHP
PHP中的empty、isset、isnull的区别与使用实例
2019/03/22 PHP
js字符串的各种格式的转换 ToString,Format
2011/08/08 Javascript
JavaScript自定义事件介绍
2013/08/29 Javascript
Json解析的方法小结
2016/06/22 Javascript
jQuery使用serialize()表单序列化时出现中文乱码问题的解决办法
2016/07/27 Javascript
基于JavaScript实现拖动滑块效果
2017/02/16 Javascript
Vue 中mixin 的用法详解
2018/04/23 Javascript
详解angularjs跨页面传参遇到的一些问题
2018/11/01 Javascript
Nodejs模块的调用操作实例分析
2018/12/25 NodeJs
修改vue源码实现动态路由缓存的方法
2020/01/21 Javascript
微信小程序获取当前时间及星期几的实例代码
2020/09/20 Javascript
python算法学习之基数排序实例
2013/12/18 Python
跟老齐学Python之玩转字符串(2)
2014/09/14 Python
详解Django缓存处理中Vary头部的使用
2015/07/24 Python
Eclipse中Python开发环境搭建简单教程
2016/03/23 Python
python自动裁剪图像代码分享
2017/11/25 Python
在Python程序员面试中被问的最多的10道题
2017/12/05 Python
使用numba对Python运算加速的方法
2018/10/15 Python
对pycharm 修改程序运行所需内存详解
2018/12/03 Python
详解如何在Apache中运行Python WSGI应用
2019/01/02 Python
Python3安装pip工具的详细步骤
2019/10/14 Python
解决django框架model中外键不落实到数据库问题
2020/05/20 Python
纯CSS3打造属于自己的“小黄人”
2016/03/14 HTML / CSS
介绍一下Java的安全机制
2012/06/28 面试题
质检部经理岗位职责
2014/02/19 职场文书
任命书怎么写
2014/06/04 职场文书
国际经济贸易专业自荐信
2014/06/13 职场文书
信息管理与信息系统专业求职信
2014/06/21 职场文书
实习单位推荐信
2015/03/27 职场文书
2016党校学习心得体会范文
2016/01/07 职场文书
高中生社会实践心得体会
2016/01/14 职场文书
SQL实现LeetCode(197.上升温度)
2021/08/07 MySQL
 Python 中 logging 模块使用详情
2022/03/03 Python