JS继承定义与使用方法简单示例


Posted in Javascript onFebruary 19, 2020

本文实例讲述了JS继承定义与使用方法。分享给大家供大家参考,具体如下:

<script>
function Enemy() { 
  this.level = 50; 
  console.log("Enemy constructor"); 
}
Enemy.prototype.attack_play = function(){
  console.log("attack_play");
};
Enemy.prototype.wudiai = 100;
Enemy.wudiai = "1213";
Enemy.gongji = function(){
  console.log("gongji  asasasd "+ Enemy.wudiai);
}
function BossEnemy(){
  Enemy.call(this);
  console.log("Boss constructor");
}
// 写法1
// BossEnemy.prototype = {constructor: BossEnemy,};
// for(var i in Enemy.prototype){
//   BossEnemy.prototype[i] = Enemy.prototype[i];
// }
// 写法2
var a = function (){};
a.prototype = Enemy.prototype;
BossEnemy.prototype = new a();
BossEnemy.prototype.boss_attack = function(){
  console.log("boss_attack");
};
BossEnemy.staticFunc = function(){
  console.log("staticFunc called!");
};
var bos = new BossEnemy();
bos.boss_attack();
bos.attack_play();
BossEnemy.staticFunc();
console.log("==========================");
BossEnemy.prototype.attack_play = function(){
  Enemy.prototype.attack_play.call(this);
  console.log("BossEnemy attack play!");
}
bos.attack_play();
console.log("*****************************");
// 写法三 js6
class BingEnemy extends Enemy{
  constructor(){
    super();
    this.flag = true;
    this.name = "通天教主";
    this.level = 100;
  }
  static staticFunc(){
    console.log("static func called!");
  }
  get BingName(){
    return this.name;
  }
  set BingName(value){
    this.name = value;
  }
};
BingEnemy.haha ="123";
let bing = new BingEnemy();
console.log(bing);
BingEnemy.staticFunc();
bing.attack_play();
console.log(bing.BingName);
bing.BingName = "jade";
console.log(bing.BingName);
//console.log(BingEnemy.wudi);
console.log("============================");
</script>

运行结果:

JS继承定义与使用方法简单示例

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

更多关于JavaScript相关内容可查看本站专题:《JavaScript常用函数技巧汇总》、《javascript面向对象入门教程》、《JavaScript查找算法技巧总结》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
jQuery对象和DOM对象的相互转化实现代码
Mar 02 Javascript
Dojo 学习要点
Sep 03 Javascript
javascript自适应宽度的瀑布流实现思路
Feb 20 Javascript
jquery 字符串切割函数substring的用法说明
Feb 11 Javascript
使用canvas实现仿新浪微博头像截取上传功能
Sep 02 Javascript
js实现tab选项卡切换功能
Jan 13 Javascript
详解原生js实现offset方法
Jun 15 Javascript
Vue 与 Vuex 的第一次接触遇到的坑
Aug 16 Javascript
JS实现数组去重,显示重复元素及个数的方法示例
Jan 21 Javascript
jquery选择器和属性对象的操作实例分析
Jan 10 jQuery
JS 设计模式之:单例模式定义与实现方法浅析
May 06 Javascript
Javascript执行流程细节原理解析
May 14 Javascript
深入浅析golang zap 日志库使用(含文件切割、分级别存储和全局使用等)
Feb 19 #Javascript
vue中实现回车键登录功能
Feb 19 #Javascript
Vue中实现回车键切换焦点的方法
Feb 19 #Javascript
整理 node-sass 安装失败的原因及解决办法(小结)
Feb 19 #Javascript
Vue常用的全选/反选的示例代码
Feb 19 #Javascript
详解node和ES6的模块导出与导入
Feb 19 #Javascript
JS实现分页导航效果
Feb 19 #Javascript
You might like
对淘宝URL中ID提取的PHP代码
2013/09/01 PHP
php时区转换转换函数
2014/01/07 PHP
php表单请求获得数据求和示例
2014/05/15 PHP
PHP实现HTML生成PDF文件的方法
2014/11/07 PHP
php框架CI(codeigniter)自动加载与自主创建对象操作实例分析
2020/06/06 PHP
javascript 简练的几个函数
2009/08/29 Javascript
javascript 导出数据到Excel(处理table中的元素)
2009/12/18 Javascript
js过滤HTML标签以及空格的思路及代码
2013/05/24 Javascript
javascript实现简单的页面右下角提示信息框
2015/07/31 Javascript
js弹出对话框方式小结
2015/11/17 Javascript
设置点击文本框或图片弹出日历控件的实现代码
2016/05/12 Javascript
ThinkJS中如何使用MongoDB的CURD操作
2016/12/13 Javascript
使用vue.js实现checkbox的全选和多个的删除功能
2017/02/17 Javascript
jQuery Validate 无法验证 chosen-select元素的解决方法
2017/05/17 jQuery
JS使用对象的defineProperty进行变量监控操作示例
2019/02/02 Javascript
小白教程|一小时上手最流行的前端框架vue(推荐)
2019/04/10 Javascript
vue动态设置路由权限的主要思路
2021/01/13 Vue.js
python中cPickle用法例子分享
2014/01/03 Python
使用Python编写Linux系统守护进程实例
2015/02/03 Python
Python基于Matplotlib库简单绘制折线图的方法示例
2017/08/14 Python
Python元组及文件核心对象类型详解
2018/02/11 Python
opencv python 傅里叶变换的使用
2018/07/21 Python
Python3 执行系统命令并获取实时回显功能
2019/07/09 Python
基于python的selenium两种文件上传操作实现详解
2019/09/19 Python
ubuntu 18.04 安装opencv3.4.5的教程(图解)
2019/11/04 Python
澳大利亚冲浪和时尚服装网上购物:SurfStitch
2017/07/29 全球购物
廉政教育心得体会
2014/01/01 职场文书
校园演讲稿汇总
2014/05/21 职场文书
汉语专业毕业生自荐信
2014/07/06 职场文书
自我检讨书范文
2015/01/28 职场文书
2015年综治维稳工作总结
2015/04/07 职场文书
办公用品质量保证书
2015/05/11 职场文书
《七月的天山》教学反思
2016/02/19 职场文书
房屋转让协议书(标准范本)
2016/03/21 职场文书
JavaScript 实现页面滚动动画
2021/04/24 Javascript
Apache Hudi数据布局黑科技降低一半查询时间
2022/03/31 Servers