当前位置:首页 > JavaScript

js原型链实现计算器

2026-04-05 02:29:34JavaScript

使用原型链实现计算器

通过原型链可以实现一个基本的计算器功能,利用原型继承来共享方法和属性。以下是一个基于原型链的计算器实现示例:

// 定义计算器构造函数
function Calculator() {
  this.currentValue = 0;
}

// 在原型上添加方法
Calculator.prototype.add = function(num) {
  this.currentValue += num;
  return this;
};

Calculator.prototype.subtract = function(num) {
  this.currentValue -= num;
  return this;
};

Calculator.prototype.multiply = function(num) {
  this.currentValue *= num;
  return this;
};

Calculator.prototype.divide = function(num) {
  this.currentValue /= num;
  return this;
};

Calculator.prototype.getValue = function() {
  return this.currentValue;
};

Calculator.prototype.clear = function() {
  this.currentValue = 0;
  return this;
};

// 使用计算器
const calc = new Calculator();
const result = calc.add(5).multiply(2).subtract(3).divide(2).getValue();
console.log(result); // 输出: 3.5

实现说明

  1. 构造函数定义
    创建Calculator构造函数,初始化currentValue为0,用于存储当前计算结果。

  2. 方法链式调用
    每个计算方法都返回this,支持链式调用,可以连续执行多个操作。

  3. 原型方法
    所有方法都定义在Calculator.prototype上,所有实例共享这些方法,节省内存。

  4. 基本运算功能
    实现了加(add)、减(subtract)、乘(multiply)、除(divide)四种基本运算,以及清除(clear)和获取结果(getValue)功能。

  5. 使用方法
    创建实例后可以通过链式调用执行连续运算,最后通过getValue获取结果。

扩展功能

可以通过原型链继续扩展计算器的功能:

js原型链实现计算器

Calculator.prototype.power = function(num) {
  this.currentValue = Math.pow(this.currentValue, num);
  return this;
};

Calculator.prototype.sqrt = function() {
  this.currentValue = Math.sqrt(this.currentValue);
  return this;
};

这种实现方式利用了JavaScript的原型继承特性,使代码结构清晰且易于扩展。

标签: 原型计算器
分享给朋友:

相关文章

js实现计算器

js实现计算器

实现基础计算器功能 使用JavaScript创建一个基础计算器需要处理数字输入、运算符逻辑和结果显示。以下是一个简单的实现示例: let currentInput = '0'; let previo…

vue实现计算器

vue实现计算器

Vue 实现计算器的方法 使用 Vue 实现计算器可以充分利用其响应式数据和组件化特性。以下是一个简单的实现方案: 创建 Vue 项目 使用 Vue CLI 或 Vite 初始化项目: npm i…

css制作计算器界面

css制作计算器界面

CSS制作计算器界面 基本结构 使用HTML创建计算器的基本结构,包含显示屏和按钮区域。显示屏用于显示输入和结果,按钮区域包含数字、运算符和功能键。 <div class="calculato…

php实现计算器程序

php实现计算器程序

实现基础计算器功能 使用PHP创建一个简单的计算器程序,可以处理基本的加减乘除运算。以下是一个基于表单提交的实现方式: <?php $result = ''; if ($_SERVER["RE…

js实现简单计算器

js实现简单计算器

实现基础功能 创建一个HTML文件,包含数字按钮、运算符按钮和显示结果的输入框。基本结构如下: <!DOCTYPE html> <html> <head>…

js原型链实现计算器

js原型链实现计算器

原型链实现计算器的基本思路 使用JavaScript的原型链机制可以实现一个计算器功能。原型链允许对象继承另一个对象的属性和方法,通过这种方式可以构建一个具有基本计算功能的对象,并通过原型扩展更复杂的…