js的继承操作案例

一、总结

1、要案例要求，内心中想出操作要点

二、js的继承操作案例

案例

练习1：具有默认值的构造函数

  • 实例描述：

    有时候在创建对象时候，我们希望某些属性具有默认值

  • 案例思路：

    在构造函数中判断参数值是否为undefined，如果是就为其制定一个默认值。

练习2：遍历对象属性和方法

  • 实例描述：

    通过for...in...语句遍历对象中的数据，包括属性和方法

  • 案例思路：

    for...in语句和if判断分别遍历对象的属性和方法。

练习3：属性的添加和删除

  • 实例描述：使用 delete 删除对象的属性(注：也可以删除方法，操作方法相同)

练习4：将一个对象赋值给另一个对象的属性

  • 实例描述：对象的属性可以是任何类型的值，包括另一个对象。

练习5：创建两个继承关系的对象

  • 实例描述：先创建一个人对象，然后再创建一个学生对象，让学生对象去继承人对象的属性和方法，同时学生对象又有自己的属性和方法。

代码

 <!DOCTYPE html>

 <html lang="zh-cn">

 <head>

     <meta charset="utf-8">

     <title>课堂演示</title>

 </head>

 <body>

  <script type="text/javascript">

  /*

   function Hero(name,type,home,weapon){

       this.name=name;

      this.type=type;

     this.home=home;

     this.weapon=weapon?weapon:'剑' ;

     this.skill=function(){

           alert(this.name+'向敌人发动了普通攻击')

     }

  }

  var user=new Hero('阿吉','战士','新手村')

  delete user.name;

  delete user.skill; //删除属性或方法

  user.sex='男' //添加属性



  document.write('user包含如下属性和方法：<hr/>')

  for (var i in user) {

   if (typeof(user[i])=='function') { //判断是否为函数用来输出属性和方法

      document.write('方法-'+i+':'+user[i]+'<br/>')

  }else{

         document.write('属性-'+i+':'+user[i]+'<br/>')

   }

  }

  function Hero(name,type,home,weapon){

     this.name=name;

   this.type=type;

     this.home=home;

     this.weapon=weapon?weapon:'剑' ;

     this.skill=function(){

           alert(this.name+'向敌人发动了普通攻击')

     }

  }

  function Sword(){

     this.Att=100;

     this.Level=1;

  }

  var xsj=new Sword();

  var user=new Hero('阿吉','战士','新手村',xsj)//将一个对象赋值给另一个对象的属性

  alert(user.weapon.Att)

  alert(user.weapon.Level)

   */

  function People(){

     this.type='人'

  }

  People.prototype.getType=function(){

         alert('这是一个人')

  }

  function Student(name,sex){

   People.call(this);

   this.name=name;

   this.sex=sex;

  }

  Student.prototype=new People()//学生继承人类

  Student.prototype.say=function(){

         alert('我是一名学生！')

  }

  var xiaoming=new Student('小明','男')

  alert(xiaoming.type)

  alert(xiaoming.name)

  xiaoming.getType()

  xiaoming.say()

  </script>

 </body>

 </html>

js的继承操作案例的更多相关文章

  1. js实现动态操作table

     本章案例为通过js,动态操作table,实现在单页面进行增删改查的操作. 简要案例如下: <%@ page language="java" contentType=&quo ...

  2. js数组的操作及数组与字符串的相互转化

    数组与字符串的相互转化 <script type="text/javascript">var obj="new1abcdefg".replace(/ ...

  3. [转]Node.JS使用Sequelize操作MySQL

    Sequelize官方文档  https://sequelize.readthedocs.io/en/latest/ 本文转自:https://www.jianshu.com/p/797e10fe23 ...

  4. AngularJS基于MVC的复杂操作案例

    AngularJS基于MVC的复杂操作案例 <!DOCTYPE html> <html> <head> <meta charset="UTF-8&q ...

  5. js 数组的操作

    js数组的操作 用 js有很久了,但都没有深究过js的数组形式.偶尔用用也就是简单的string.split(char).这段时间做的一个项目,用到数组的地方很多,自以为js高手的自己居然无从下手,一 ...

  6. js数组的操作 Full

    js数组的操作 用 js有很久了,但都没有深究过js的数组形式.偶尔用用也就是简单的string.split(char).这段时间做的一个项目,用到数组的地方很多,自以为js高手的自己居然无从下手,一 ...

  7. js的dom操作（整理）（转）

    js的dom操作整理(整理)(转) 一.总结 一句话总结: dom操作有用原生js的dom操作,也可以用对js封装过的jquery等插件来来更加方便的进行dom操作 1.dom是什么? 对于JavaS ...

  8. js的DOM操作整理（整理）

    js的DOM操作整理(整理) 一.总结 一句话总结: dom操作有用原生js的dom操作,也可以用对js封装过的jquery等插件来更加方便的进行dom操作 1.dom是什么? 对于JavaScrip ...

  9. js原生继承几种方式

    js原生继承 js本身并没有继承和类的概念,本质上是通过原型链(prototype)的形式实现的. 1.先写两个构造函数Parent和Child,用于将Child继承Parent function P ...

随机推荐

  1. HBase写入操作卡住长时间不返回的原因分析

    本文出处:http://blog.csdn.net/chaijunkun/article/details/44238163,转载请注明. 由于本人不定期会整理相关博文,会对相应内容作出完好.因此强烈建 ...

  2. JAVA File类 分析（二）

    本章開始介绍UNIX文件系统. 文件系统是怎样管理文件的呢?那咱们要先文件的存储介质開始--磁盘 磁盘是计算机系统的一个硬件设备,文件系统为了可以管理磁盘.对其进行了三层抽象(本文全部内容均指UNIX ...

  3. 深入分析JavaWeb Item23 -- jsp自己定义标签开发入门

    一.自己定义标签的作用 自己定义标签主要用于移除Jsp页面中的java代码. 二.自己定义标签开发和使用 2.1.自己定义标签开发步骤 1.编写一个实现Tag接口的Java类(标签处理器类) 要编写一 ...

  4. 31.Intellij idea 的maven项目如何通过maven自动下载jar包

    转自:https://blog.csdn.net/u012851114/article/details/81872981 maven项目自动加载jar包 所需工具如下: Intellij IDEA 1 ...

  5. js数组操作（增、删、改、查）

    数组是js中非常常用的一个对象,它有一些经典的操作,今天零度就为大家介绍介绍. 首先,声明一个数组的方法有两种: var arr = []; 或者 var arr = new Array(); 一般情 ...

  6. 认识Linux瘦客户机

           (本文完整版见http://os.51cto.com/art/201001/181448.htm)        随着Linux的发展,以及网络计算技术的发展和逐步深入的云计算,基于Li ...

  7. 最简单的基于FFmpeg的移动端例子：Android 视频转码器

    http://blog.csdn.net/leixiaohua1020/article/details/47056365

  8. 混合式框架-AngularJS

    简单介绍   AngularJS是为了克服HTML在构建应用上的不足而设计的.HTML是一门非常好的为静态文本展示设计的声明式语言,但要构建WEB应用的话它就显得乏力了.所以我做了一些工作(你也能够认 ...

  9. 【Java编码准则】の ＃01限制内存中敏感数据的生命周期

    当竞争对手的应用程序与我们的应用程序执行在同一个系统上时,我们的应用程序在内存中的敏感数据是非常easy被竞争对手获取的.假设我们的应用程序符合以下几种情况之中的一个,那么竞争对手能够获取到我们应用的 ...

  10. 10lession-if-else条件语句

    python的条件选择语句跟其他语言的及其相似,这里就不做详细记录,仅仅是看个例子好了 #!/usr/bin/python "]: print('1 in [1,2,3,"4&qu ...