<!DOCTYPE html>

 <html>

     <head>

         <meta charset="UTF-8">

         <title></title>

     </head>

     <body>

         <h1>结算程序</h1>

         <p>

             <input type="text" placeholder="原价" id="money" />

         </p>

         <p>

             <select id="level">

                 <option value="0">普通顾客</option>

                 <option value="1">VIP会员</option>

                 <option value="2">金卡会员</option>

                 <option value="3">砖石会员</option>

             </select>

         </p>

         <p>

             <input type="button"id="btn" value="结算" />

         </p>

         <p id="result"></p>

         <script src="test_4es5.js" type="text/javascript" charset="utf-8"></script>

     </body>

 </html>

原型定义对象的方式缺点是较为麻烦，但是好处是创建对象里面不包括变量和方法的声明

原型定义的对象创建的速度快，占用内存小，推荐使用

 function Calculator() {

 }

 Calculator.prototype.money = null;

 Calculator.prototype.level = null;

 Calculator.prototype.pay = function() {

     if(this.level == 0) {

         return this.money;

     } else if(this.level == 1) {

         return `${this.money * 0.96}元`;

     } else if(this.level == 2) {

         return this.money * 0.92;

     } else if(this.level == 3) {

         return this.money * 0.85;

     } else {

         throw "会员等级错误";

     }

 }

 function DoubleElevenCalculator() {

 };

 DoubleElevenCalculator.prototype = new Calculator();

 DoubleElevenCalculator.prototype.pay = function() {

     if(this.level == 0) {

         var num = Math.floor(this.money / 200);

         return `实际需支付${this.money}元,赠送${num}张50元代金券`;

     } else if(this.level == 1) {

         var num = Math.floor(this.money / 500);

         return `实际需支付${this.money*0.9}元,赠送${num}张100元餐券`

     } else if(this.level == 2) {

         var num = Math.floor(this.money / 300);

         return `实际需支付${this.money*0.85}元,赠送${num}张100元代金券`;

     } else if(this.level == 3) {

         var num = Math.floor(this.money / 200);

         return `实际需支付${this.money*0.8}元,赠送${num}张100元代金券`;

     } else {

         throw "会员等级错误";

     }

 }

 var btn = document.querySelector("#btn");

 btn.addEventListener("click", function() {

     //var calculator = new Calculator();

     var calculator = new DoubleElevenCalculator();

     calculator.money = document.querySelector("#money").value;

     var money = new Number(money);

     calculator.level = document.querySelector("#level").value;

     var level = new Number(level);

     var temp = calculator.pay();

     document.querySelector("#result").innerHTML = temp;

 });
 
 /*

  * 发法一new Object()

  * 对象只能调用一次，不能重复利用，也不能被继承

  */

 /*

 var plane = new Object();

 plane.speed=800;

 plane.fly=function(){

     console.log("飞行速度"+this.speed);

 }

 plane.fly();

 */

 /*

  * 方法二json

  */

 /*

  var plane={

     speed:800,

     fly:function(){

         console.log("飞行速度"+this.speed);

     }

 }

 plane.fly();

  */

 /*

  * 方法3函数模拟类

  * 不能继承

  */

 /*

 function Plane(){

     this.speed=800;

     this.fly=function(){

         console.log("飞行速度"+this.speed);

     }

 }

 var plane =new Plane();

 plane.fly();

 */

 /*

  * 方法4    最好

  */

 function Plane() {

 }

 Plane.prototype.speed = null;

 Plane.prototype.fly = function() {

     console.log("飞行速度" + this.speed);

 }

 var plane = new Plane();

 plane.speed = 800;

 plane.fly();

 function FightPlane() {

 }

 FightPlane.prototype = new Plane(); //继承父类prototype所有的内容

 FightPlane.prototype.fly = function() {

     console.log("战斗机飞行速度" + this.speed)

 }

 plane = new FightPlane();

 plane.speed = 2000;

 plane.fly();

JS5模拟类的更多相关文章

  1. js模拟类

    ECMAScript6已经支持了class,但之前版本都不支持类,但是可以通过一些方法来模拟类. js中的类,既是重点,也是难点,很多时候都感觉模棱两可. 首先强调一下js中很重要的3个知识点:thi ...

  2. JavaScript 高级篇之闭包、模拟类,继承（五）

    本篇主要分享我对闭包的理解及使用闭包完成私有属性.模拟类.继承等,结合大量例子,希望大家能快速掌握!首先让我们先从一些基本的术语开始吧     一.javascript中的闭包 1.我们一起先来理解什 ...

  3. poj1068解题报告（模拟类）

    POJ 1068,题目链接http://poj.org/problem?id=1068 题意: 对于给出给出的原括号串S,对应两种数字密码串P.W: S         (((()()()))) P- ...

  4. 在 JavaScript 中使用构造器函数模拟类

    今天,我们要讲的是在 JavaScript 中使用构造器函数(construcor function)模拟类. 构造器函数简介 你可以使用 ES6 的 class 关键字来实现类,不过我建议你使用传统 ...

  5. 【游戏开发】在Lua中实现面向对象特性——模拟类、继承、多态

    一.简介 Lua是一门非常强大.非常灵活的脚本语言,自它从发明以来,无数的游戏使用了Lua作为开发语言.但是作为一款脚本语言,Lua也有着自己的不足,那就是它本身并没有提供面向对象的特性,而游戏开发是 ...

  6. [原创]Javascript模拟“类”的综合实现方式以及部分细节【截至ES6】

    [原创]Javascript模拟“类”的综合实现方式以及部分细节[截至ES6] 前言   最近几个旧项目里使用的图片编辑插件出现Bug, 经Review 后确定需要在其内外均做些改动,但是头疼的发现部 ...

  7. [LeetCode] 数学计算模拟类问题：加法，除法和幂，注意越界问题。题 剑指Offer，Pow(x, n) ，Divide Two Integers

    引言 数学计算的模拟类题目,往往是要求实现某种计算(比如两数相除),实现的过程中会有所限定,比如不允许乘法等等. 这类题目首先要注意计算过程中本身的特殊情况.比如求相除,则必须首先反映过来除数不能为0 ...

  8. 【转载】【游戏开发】在Lua中实现面向对象特性——模拟类、继承、多态

    [游戏开发]在Lua中实现面向对象特性——模拟类.继承.多态   阅读目录 一.简介 二.前提知识 三.Lua中实现类.继承.多态 四.总结 回到顶部 一.简介 Lua是一门非常强大.非常灵活的脚本语 ...

  9. javascript模拟类的最佳实践

    1:怎样模拟一个类 在sencha touch2 系列里面定义一个类和new出这个类的对象 Ext.define( "Animal", { config: { name: null ...

随机推荐

  1. SQL语言知识点总结

    1.DQL.DML.DDL.DCL的概念与区别 一.SQL(Structure Query Language)语言是数据库的核心语言. SQL的发展是从1974年开始的,其发展过程如下: 1974年- ...

  2. 第6章 Overlapped I/O， 在你身后变戏法 ---被激发的 Event 对象 -4

    以文件 handle 作为激发机制,有一个明显的限制,那就是没办法说出到底是哪一个 overlapped 操作完成了.如果每个文件 handle 只有一个操作等待决定,上述问题其实并不成为问题.但是如 ...

  3. Javascript 中 ==(相等运算符) 和 ===(严格相等运算符) 区别

    在JS中,"==="叫做严格运算符,"=="叫做相等运算符. 它们的区别是相等运算符(==)比较两个值是否相等,严格相等运算符(===)比较它们是否为" ...

  4. 1001 数组中和等于K的数对 1002 数塔取数问题 1003 阶乘后面0的数量 1004 n^n的末位数字 1009 数字1的数量

    1001 数组中和等于K的数对 基准时间限制:1 秒 空间限制:131072 KB 分值: 5 难度:1级算法题 给出一个整数K和一个无序数组A,A的元素为N个互不相同的整数,找出数组A中所有和等于K ...

  5. 委托、事件、Observer观察者模式的使用解析二

    一.设计模式-Observer观察者模式 Observer设计模式是为了定义对象间的一种一对多的依赖关系,以便于当一个对象的状态改变时,其他依赖于它的对象会被自动告知并更新.Observer模式是一种 ...

  6. sqlserver游标使用和循环

    /*** 游标的使用 讲了这个多游标的优点,现在我们就亲自来揭开游标的神秘的面纱. 使用游标的顺序: 声名游标.打开游标.读取数据.关闭游标.删除游标. 1.3.1声明游标 最简单游标声明:DECLA ...

  7. DataGridView一些常用操作

    SqlConnection conn = new SqlConnection('Server=(local);DataBase=test;User=sa;Pwd=sa'); SqlDataAdapte ...

  8. 原生JS实现音乐播放器！

      前  言            最近在复习JS,觉得音乐播放器是个挺有意思的东西,今天就来用我们最原生的JS写一个小小的音乐播放器~ 主要功能: 1.支持循环.随机播放 2.在播放的同时支持图片的 ...

  9. 有人提了一个问题：一定要RESTful吗？

    写在前面的话 这个问题看起来就显得有些萌,或者说类似的问题都有些不靠谱,世上哪有那么多一定的事情,做开发都不一定做多久呢,所以说如果你有这个疑问的话是真真有点儿不着调,不过可能也就是随口一问吧,没有深 ...

  10. （转）Python-正则表达式

    在前面我们已经搞定了怎样获取页面的内容,不过还差一步,这么多杂乱的代码夹杂文字我们怎样把它提取出来整理呢?下面就开始介绍一个十分强大的工具,正则表达式! 1.了解正则表达式 正则表达式是对字符串操作的 ...