【自定义对象】
1.基本概念
①对象是拥有一系列无无序属性和方法的集合
②键值对：对象中的数据，用以键值对的形式存在，对象的每个属性和方法，都对应一个键值，以键取值
③属性：描述对象特征的一系列变量称为属性【对象中的变量】
④方法：描述对象行为的一系列函数称为方法【对象中的函数】
2.对象的声明：
①使用字面量声明：var obj = {
key1:"value1",
key2:"value2",
func1:func(){}
}
对象的数据是以键值对形式存储，键与值之间用":"分隔,多个键值对之间用","分隔。
对象中的键可以是出了数组对象以外的任何数据类型但是一般我们只用普通变量名为键。
对象中的值可以是任何数据类型，包括数组和对象。
②使用new关键字声明
var obj = new Object()
obj.key1 = value1
obj.key2 = value2
obj.func = function(){}
3.对象中属性和方法的读写
①.运算符：对象名.属性   对象名.方法();
②通过[“key]调用，对象名.["属性名"] 对象名.["方法名"]();
如果键中包含其他字符，则只能用第②种方式。
对象中直接写变量名默认为调用全局变量，如果需要调用对象自身的属性或者方法，需要使用对象名.属性。或者this.属性
person.age this.age都可以，但推荐使用this关键字。
③删除对象属性的方法delete 对象名.属性名/方法名
 
案例
<!DOCTYPE html>
<html>
 <head>
  <meta charset="UTF-8">
  <title></title>
  <script type="text/javascript">
   /*
    */
 var classes = {
  //先声明一个classes类
  className : "HTML5-1705",
  studentCount : 27,
  students : [
   {name:"张三",sex:"女",chinese:20,maths:30,english:80,sum:90},
   {name:"李四",sex:"女",chinese:80,maths:65,english:85,sum:75},
   {name:"王五",sex:"男",chinese:68,maths:48,english:75,sum:94}
  ],
  addStudent : function(){
   //添加学生信息的行为
   var name = prompt("请输入学员姓名：");
   var sex = prompt("请输入学员性别：");
   var chinese = parseFloat(prompt("请输入学员语文成绩："));
   var maths = parseFloat(prompt("请输入学员数学成绩："));
   var english = parseFloat(prompt("请输入学员英语成绩："));
   var sum = chinese + maths + english;
   var student = {
    name : name,
    sex : sex,
    chinese : chinese,
    maths : maths,
    english : english,
    sum : sum
   }
   this.students.push(student);
   this.students.sort(function(a,b){
    return b.sum - a.sum;
   });
  },
  showStudent : function(){
   //显示学生信息的行为
   var arr = this.students;
   console.log("\tHTML5-1705班成绩展示");
   console.log("序号\t姓名\t性别\t语文\t数学\t英语\t总分");
   arr.sort(function(a,b){
    return b.sum - a.sum;
   });
   arr.forEach(function(item,index){
    console.log((index+1)+"\t\t"+item.name+"\t"+item.sex+"\t\t"+item.chinese+"\t\t"+item.maths+"\t\t"+item.english+"\t\t"+item.sum);
   })
  },
  delStudent : function(){
   //删除学生信息的行为
   if(this.students.length<=0) {
    alert("没有学员数据，无法删除！");
    return;
   }
   var no = prompt("请输入要删除的学员序号：");
   if(no<1 || no> this.students.length){
    alert("序号输入有误！请确认学员序号重新输入！");
    return;
   }
   this.students.splice(no-1,1);
  },
  searchStudent : function(){
   //查询学生信息的行为
   var no = prompt("请输入要查询的学员序号：");
   var arr = this.students;
   if(no<1 || no > arr.length){
    alert("查无此人！请确认序号！");
   }else{
    console.log("查询完成！查询到学员信息如下：");
    console.log("序号\t姓名\t性别\t语文\t数学\t英语\t总分");
    console.log(no+"\t\t"+arr[no-1].name+"\t"+arr[no-1].sex+"\t\t"+arr[no-1].chinese+"\t\t"+arr[no-1].maths+"\t\t"+arr[no-1].english+"\t\t"+arr[no-1].sum);
   }
  },
  updateStudent : function(){
   //修改学生信息的行为
   if(this.students.length<=0) {
    alert("没有学员数据，无法修改！");
    return;
   }
   var no = prompt("请输入要修改的学员序号：");
   if(no<1 || no> this.students.length){
    alert("序号输入有误！请确认学员序号重新输入！");
    return;
   }
   if(!confirm("您确认修改学员是【"+this.students[no-1].name+"】吗？")){
    alert("操作已取消！");
    return;
   }
   var name = prompt("请输入学员姓名：");
   var sex = prompt("请输入学员性别：");
   var chinese = parseFloat(prompt("请输入学员语文成绩："));
   var maths = parseFloat(prompt("请输入学员数学成绩："));
   var english = parseFloat(prompt("请输入学员英语成绩："));
   var sum = chinese + maths + english;
   var student = {
    name : name,
    sex : sex,
    chinese : chinese,
    maths : maths,
    english : english,
    sum : sum
   }
   this.students[no-1] = student;
  }
 }
 
 console.log("\t成绩管理系统");
 console.log("1、展示学员信息\t2、学员信息录入\n3、删除学员信息\t4、查询学员信息\n5、修改学员信息\t6、退出系统");
 while (true){
  var num = parseInt(prompt("请输入操作序号"));
  var is = false;
  switch (num){
   case 1:
    classes.showStudent();
    break;
   case 2:
    classes.addStudent();
    console.log("信息录入成功！");
    classes.showStudent();
    break;
   case 3:
    classes.delStudent();
    console.log("信息删除成功！");
    classes.showStudent();
    break;
   case 4:
    classes.searchStudent();
    break;
   case 5:
    classes.updateStudent();
    console.log("信息修改成功！");
    classes.showStudent();
    break;
   case 6:
    console.log("系统退出成功！");
    is = true;
    break;
   default:
    alert("序号输入有误！");
    break;
  }
  if(is) break;
  
  console.log("是否继续？(输入N退出系统)");
  var isGo = prompt("请输入序号：N退出系统，其他字符继续");
  if(isGo == "N" || isGo == "n"){
   console.log("系统退出成功！");
   break;
  }
  
 } 
  </script>
 </head>
 <body>
 </body>
</html>

JS自定义对象以及相关成绩系统完整案例演示的更多相关文章

  1. JS 自定义对象 属性

    js自定义对象 一,概述 在Java语言中,我们可以定义自己的类,并根据这些类创建对象来使用,在Javascript中,我们也可以定义自己的类,例如定义User类.Hashtable类等等. 目前在J ...

  2. js自定义对象.属性 笔记

    <一> js自定义对象 一,概述 在Java语言中,我们可以定义自己的类,并根据这些类创建对象来使用,在Javascript中,我们也可以定义自己的类,例如定义User类.Hashtabl ...

  3. js自定义对象

    一,概述 在Java语言中,我们可以定义自己的类,并根据这些类创建对象来使用,在Javascript中,我们也可以定义自己的类,例如定义User类.Hashtable类等等. 目前在Javascrip ...

  4. JS自定义对象，正则表达式，JQuery中的一些知识点

    一:自定义对象 1.基本概念:①对象:包含一系列无序属性和方法的集合.②键值对:对象中的数据是以键值对的形式存在的,以键取值.③属性:描述对象特征的一系列变量.[对象中的变量]④方法:描述对象行为的一 ...

  5. js自定义对象 (转)

    原文地址:https://sjolzy.cn/js-custom-object.html 29 March 2010 9:53 Monday by 小屋 javascript进阶之对象篇 一,概述 在 ...

  6. Node.js自定义对象事件监听与发射

    一.Node.js是以事件驱动的,那我们自定义的一些js对象就需要能监听事件以及发射事件.在Node.js中事件使用一个EventEmitter对象发出,该对象在events模块中.它应该是使用观察者 ...

  7. js 中对象--属性相关操作

    查询属性: 可以用 对象.属性 来查询属性和属性方法               或者                    对象[“属性”]  来查询属性和属性方法 演示代码: <script ...

  8. js自定义对象和类

    1.工厂方式 <script type="text/javascript"> function createObject(name){        var p = n ...

  9. JS 创建自定义对象的方式方法

    一.概述 还记得刚开始做项目的时候,看到别人封装的js工具类百思不得其解,看来看去看不懂,深挖一下,其实就是自己没有耐下心去看,但是遇到问题不解决,总会遇到的,今天还是遇到了,就去找了找帖子,重新思考 ...

随机推荐

  1. RabbitMQ入门-Routing直连模式

    Hello World模式,告诉我们如何一对一发送和接收消息: Work模式,告诉我们如何多管齐下高效的消费消息: Publish/Subscribe模式,告诉我们如何广播消息 那么有没有灵活强一点的 ...

  2. git远程仓库之添加远程库

    现在的情景是,你已经在本地创建了一个Git仓库后,又想在GitHub创建一个Git仓库,并且让这两个仓库进行远程同步,这样,GitHub上的仓库既可以作为备份,又可以让其他人通过该仓库来协作,真是一举 ...

  3. 转载的log4cplus使用指南

    以下转载的log4cplus使用指南的版本可能不是最新,仅作参考了解.应以最新安装包中的示例代码为准. 目    录1 Log4cplus简介    52 安装方法    53 主要类说明    64 ...

  4. session和cookie的辨析[阅读]

    session和cookie是网站浏览中较为常见的两个概念,也是比较难以辨析的两个概念,但它们在点击流及基于用户浏览行为的网站分析中却相当关键.基于网上一些文章和资料的参阅,及作者个人的应用体会,对这 ...

  5. Weex和React Native框架对比与选择

    工作原理 大致基本类同,JS-Native桥和前端渲染框架,只是使用框架技术不一样: Weex 阿里内部早期研发的一个通过 JSON 数据描述 native 渲染的项目WeApp以及Vue.js这款优 ...

  6. 2015 Tencent 线上模拟测试题

    第一题  下面的程序的输出结果是: A. 134122 B. 123412 C. 14302012 D. 143212 #include <iostream> using namespac ...

  7. PHP魔术方法

    魔术方法:两个下划线开头的格式. PHP中的魔术方法总结 :__construct, __destruct , __call, __callStatic,__get, __set, __isset, ...

  8. 7.21.06 java内存模型

    资料来源:http://www.cnblogs.com/smile361/archive/2013/11/25/3441553.html 程序计数器: 当前线程所执行的字节码的行号指示器 本地方法栈: ...

  9. Virtualbox虚拟机Ubuntu共享文件夹设置 自动挂载

    1. 安装增强功能包(Guest Additions) 安装好Ubuntu 14.04 后,运行Ubuntu并登录.然后在VirtualBox的菜单里选择"设备(D)" -> ...

  10. vue.js基础知识篇(6):组件详解

    第11章:组件详解 组件是Vue.js最推崇也最强大的功能之一,核心目标是可重用性. 我们把组件代码按照template.style.script的拆分方式,放置到对应的.vue文件中. 1.注册 V ...