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 相关文章推荐
JavaScript中的运算符种类及其规则介绍
Sep 26 Javascript
js中reverse函数的用法详解
Dec 26 Javascript
js清空表单数据的两种方式(遍历+reset)
Jul 18 Javascript
windows8.1+iis8.5下安装node.js开发环境
Dec 12 Javascript
js+jquery实现图片裁剪功能
Jan 02 Javascript
Vuex之理解Getters的用法实例
Apr 19 Javascript
使用cropper.js裁剪头像的实例代码
Sep 29 Javascript
JS实现的新闻列表自动滚动效果示例
Jan 30 Javascript
Node.js + express基本用法教程
Mar 14 Javascript
JS html事件冒泡和事件捕获操作示例
May 01 Javascript
微信小程序-API接口安全详解
Jul 16 Javascript
详解Vue.js和layui日期控件冲突问题解决办法
Jul 25 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
深入PHP5中的魔术方法详解
2013/06/17 PHP
php中session使用示例
2014/03/29 PHP
常用PHP框架功能对照表
2014/10/23 PHP
PHP遍历XML文档所有节点的方法
2015/03/12 PHP
PHP 进度条函数的简单实例
2017/09/19 PHP
javascript基础的动画教程,直观易懂
2007/01/10 Javascript
JSON 和 JavaScript eval使用说明
2010/06/13 Javascript
javascript 得到文件后缀名的思路及实现
2020/05/09 Javascript
jQuery实现“扫码阅读”功能
2015/01/21 Javascript
jquery实现上传文件大小类型的验证例子(推荐)
2016/06/25 Javascript
JQuery组件基于Bootstrap的DropDownList(完整版)
2016/07/05 Javascript
Bootstrap时间选择器datetimepicker和daterangepicker使用实例解析
2016/09/17 Javascript
基于Bootstrap仿淘宝分页控件实现代码
2016/11/07 Javascript
Nodejs高扩展性的模板引擎 functmpl简介
2017/02/13 NodeJs
bootstrap 下拉多选框进行多选传值问题代码分析
2017/02/14 Javascript
Angular 表单控件示例代码
2017/06/26 Javascript
Vue脚手架的简单使用实例
2018/07/10 Javascript
Vue配合iView实现省市二级联动的示例代码
2018/07/27 Javascript
Bootstrap Table实现定时刷新数据的方法
2018/08/13 Javascript
vue 实现cli3.0中使用proxy进行代理转发
2019/10/30 Javascript
微信小程序接入腾讯云验证码的方法步骤
2020/01/07 Javascript
JavaScript实现左右滚动电影画布
2020/02/06 Javascript
python简单实现基于SSL的IRC bot实例
2015/06/15 Python
利用python微信库itchat实现微信自动回复功能
2017/05/18 Python
python中的数据结构比较
2019/05/13 Python
详解Django 时间与时区设置问题
2019/07/23 Python
python文件和文件夹复制函数
2020/02/07 Python
python等差数列求和公式前 100 项的和实例
2020/02/25 Python
销售人员中英文自荐信
2013/09/22 职场文书
电子商务专业个人的自我评价
2013/12/19 职场文书
会计自荐信范文
2014/03/09 职场文书
工伤赔偿协议书范本
2014/04/15 职场文书
道德大讲堂实施方案
2014/05/14 职场文书
检讨书模板大全
2015/05/07 职场文书
董事长助理工作总结2015
2015/07/23 职场文书
初中物理教学反思
2016/02/19 职场文书