首页 / JAVASCRIPT / 运算符重载应如何使用

运算符重载应如何使用

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了运算符重载应如何使用，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含7039字，纯文字阅读大概需要11分钟。

内容图文

这次给大家带来运算符重载应如何使用，运算符重载使用的注意事项有哪些，下面就是实战案例，一起来看一下。

最近要做数据处理，自定义了一些数据结构，比如Mat,Vector,Point之类的，对于加减乘除之类的四则运算还要重复定义，代码显得不是很直观，javascript没有运算符重载这个像C++、C#之类的功能的确令人不爽，于是想“曲线救国”，自动将翻译代码实现运算符重载，实现思路其实很简单，就是编写一个解释器，将代码编译。例如：

S = A + B (B - C.fun())/2 + D

翻译成

`S = replace(replace(A, '+', replace(replace(B,'',(replace(B,'-',C.fun())))),'/',2),'+',D)`

在replace函数中我们调用对象相应的运算符函数,replace函数代码如下：

/**
 * 转换方法
 * @param a
 * @param op
 * @param b
 * @returns {*}
 * @private
 */
export function __replace__(a,op,b){
  if(typeof(a) != 'object' && typeof(b) != 'object'){
    return new Function('a','b','return a' + op + 'b')(a,b)
  }
  if(!Object.getPrototypeOf(a).isPrototypeOf(b)
    && Object.getPrototypeOf(b).isPrototypeOf(a)){
    throw '不同类型的对象不能使用四则运算'
  }
  let target = null
  if (Object.getPrototypeOf(a).isPrototypeOf(b)) {
    target = new Function('return ' + b.__proto__.constructor.name)()
  }
  if (Object.getPrototypeOf(b).isPrototypeOf(a)) {
    target = new Function('return ' + a.__proto__.constructor.name)()
  }
  if (op == '+') {
    if (target.__add__ != undefined) {
      return target.__add__(a, b)
    }else {
      throw target.toString() +'\n未定义__add__方法'
    }
  }else if(op == '-') {
    if (target.__plus__ != undefined) {
      return target.__plus__(a, b)
    }else {
      throw target.toString() + '\n未定义__plus__方法'
    }
  }else if(op == '*') {
    if (target.__multiply__ != undefined) {
      return target.__multiply__(a, b)
    }else {
      throw target.toString() + '\n未定义__multiply__方法'
    }
  } else if (op == '/') {
    if (target.__pide__ != undefined) {
      return target.__pide__(a, b)
    }else {
      throw target.toString() + '\n未定义__pide__方法'
    }
  } else if (op == '%') {
    if (target.__mod__ != undefined) {
      return target.__mod__(a, b)
    }else {
      throw target.toString() + '\n未定义__mod__方法'
    }
  } else if(op == '.*') {
    if (target.__dot_multiply__ != undefined) {
      return target.__dot_multiply__(a, b)
    }else {
      throw target.toString() + '\n未定义__dot_multiply__方法'
    }
  } else if(op == './') {
    if (target.__dot_pide__ != undefined) {
      return target.__dot_pide__(a, b)
    }else {
      throw target.toString() + '\n未定义__dot_pide__方法'
    }
  } else if(op == '**') {
    if (target.__power__ != undefined) {
      return target.__power__(a, b)
    }else {
      throw target.toString() + '\n未定义__power__方法'
    }
  }else {
    throw op + '运算符无法识别'
  }
}

replace实现非常简单，不做过多解释，重要的部分是如何实现代码的编译。大学学习数据结构时四则运算的实现就是这翻译的基础，略微有些差异。简单描述一下流程：

1、分割表达式，提取变量和运算符获得元数组A
2、遍历元数组

如果元素是运算符加减乘除，则从堆栈中弹出上一个元素，转换为replace(last,操作符,
如果元素是‘）',则从堆栈中弹出元素，拼接直到遇到'('，并压入堆栈。这里需要注意‘（'元素前是否为函数调用或replace，如果是函数调用或replace，则需要继续向前弹出数据，闭合replace函数的闭合。
如果是一般元素，则查看前一个元素是否replace，如果是，则需要拼接‘)'使得replace函数闭合，否则直接将元素压入栈。

3、将2步骤中得到的栈顺序组合就得到编译后的表达式。

依据上述流程，实现代码：

/**
 * 表达式转换工具方法
 * @param code
 */
export function translate (code) {
  let data = []
  let tmp_code = code.replace(/\s/g,'')
  let tmp = []
  let vari = tmp_code.split(/["]+[^"]*["]+|[']+[^']*[']+|\*\*|\+|-|\*|\/|\(|\)|\?|>[=]|<[=]|={2}|:|&{2}|\|{2}|\{|\}|=|%|\.\/|\.\*|,/g)
  let ops = tmp_code.match(/["]+[^"]*["]+|[']+[^']*[']+|\*\*|\+|-|\*|\/|\(|\)|\?|>[=]|<[=]|={2}|:|&{2}|\|{2}|\{|\}|=|%|\.\/|\.\*|,/g)
  for (let i = 0,len = ops.length; i < len; i++) {
    if (vari[i] != '') {
      tmp.push(vari[i])
    }
    if (ops[i] != '') {
      tmp.push(ops[i])
    }
  }
  tmp.push(vari[ops.length])
  for (let i = 0; i < tmp.length; i++){
    let item = tmp[i]
    if(/\*\*|\+|-|\*|\/|%|\.\/|\.\*/.test(tmp[i])) {
      let top = data.pop()
      let trans = '__replace__(' + top + ',\'' + tmp[i] + '\','
      data.push(trans)
    }else{
      if (')' == tmp[i]) {
        let trans0 = tmp[i]
        let top0 = data.pop()
        while (top0 != '(') {
          trans0 = top0 + trans0
          top0 = data.pop()
        }
        trans0 = top0 + trans0
        let pre = data[data.length - 1]
        while(/[_\w]+[\.]?[_\w]+/.test(pre)
        && !/^__replace__\(/.test(pre)
        && pre != undefined) {
          pre = data.pop()
          trans0 = pre + trans0
          pre = data[data.length - 1]
        }
        pre = data[data.length - 1]
        while(pre != undefined
        && /^__replace__\(/.test(pre)){
          pre = data.pop()
          trans0 = pre + trans0 + ')'
          pre = data[data.length - 1]
        }
        data.push(trans0)
      }else {
        let pre = data[data.length - 1]
        let trans1 = tmp[i]
        while(pre != undefined
        && /^__replace__\(/.test(pre)
        && !/\*\*|\+|-|\*|\/|\(|\?|>[=]|<[=]|={2}|:|&{2}|\|{2}|\{|=|\}|%|\.\/|\.\*/.test(item)
        && !/^__replace__\(/.test(item)) {
          if(tmp[i + 1] == undefined){
            pre = data.pop()
            trans1 = pre + trans1 + ')'
            break;
          }else{
            pre = data.pop()
            trans1 = pre + trans1 + ')'
            pre = data[data.length - 1]
          }
        }
        data.push(trans1)
      }
    }
  }
  let result = ''
  data.forEach((value, key, own) => {
    result += value
  })
  return result
}

表达式编译的方法写好了，接下来就是如何使编写的代码被我们的翻译机翻译，也就是需要一个容器，两种方法：一种就是类构造器重新定义方法属性，另一种就是将代码作为参数传入我们自定义的方法。接下来介绍一下类构造器中重新定义方法：

export default class OOkay {
  constructor () {
    let protos = Object.getOwnPropertyNames(Object.getPrototypeOf(this))
    protos.forEach((proto, key, own) => {
      if(proto != 'constructor'){
        Object.defineProperty(this, proto, {
          value:new Function(translate_block(proto, this[proto].toString())).call(this)
        })
      }
    })
  }
}

由上面可以看出，我们使用Object.defineProperty在构造器中重新定义了，translate_block是对整个代码块分割得到进行翻译，代码如下：

/**
 * 类代码块转换工具
 * @param name
 * @param block
 * @returns {string}
 */
export function translate_block (name , block) {
  let codes = block.split('\n')
  let reg = new RegExp('^' + name + '$')
  console.log(reg.source)
  codes[0] = codes[0].replace(name,'function')
  for(let i = 1; i < codes.length; i++) {
    if (codes[i].indexOf('//') != -1) {
      codes[i] = codes[i].substring(0,codes[i].indexOf('//'))
    }
    if(/\*\*|\+|-|\*|\/|%|\.\/|\.\*/g.test(codes[i])){
      if (codes[i].indexOf('return ') != -1) {
        let ret_index = codes[i].indexOf('return ') + 7
        codes[i] = codes[i].substring(0,ret_index) + translate(codes[i].substring(ret_index))
      }else {
        let eq_index = codes[i].indexOf('=') + 1
        codes[i] = codes[i].substring(0,eq_index) + translate(codes[i].substring(eq_index))
      }
    }
  }
  return 'return ' + codes.join('\n')
}

对于新的类，我们只要继承OOkay类就可以在该类中使用运算符重载。对于继承自非OOkay类的，我们可以采用注入的方式,如下：

/**
   * 非继承类的注入方法
   * @param target
   */
  static inject (target) {
    let protos = Object.getOwnPropertyNames(Object.getPrototypeOf(target))
    protos.forEach((proto, key, own) => {
      if (proto != 'constructor') {
        Object.defineProperty(target, proto, {
          value:new Function(translate_block(proto, target[proto].toString())).call(target)
        })
      }
    })
  }

对于非类中的代码，我们需要一个容器，这里我采用了两种方式，一种以ookay脚本的方式使用，像这样
<script type='text/ookayscript'>
let a = a+b // a、b为对象实例
</script>
还有就是将代码作为参数传入__$$__方法，该方法编译代码并执行，如下：

static __$__(fn) {
    if(!(fn instanceof Function)){
      throw '参数错误'
    }
    (new Function(translate_block('function',fn.toString()))).call(window)()
  }

相信看了本文案例你已经掌握了方法，更多精彩请关注Gxl网其它相关文章！

内容总结

以上是互联网集市为您收集整理的运算符重载应如何使用全部内容，希望文章能够帮你解决运算符重载应如何使用所遇到的程序开发问题。如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容，请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端

扫描二维码推送至手机访问。

本文链接：https://qyyshop.com/info/287366.html

来源：【匿名】

【上一篇】使用parcel.js打包出错的问题【下一篇】javascript 怎么调用php方法

更多 ►

【运算符重载应如何使用】教程文章相关的互联网学习教程文章

Javascript开发技巧(JS入门、运算符、分支结构、循环结构)

一、Js简介和入门 <!DOCTYPE html><html> <head><meta charset="UTF-8"><title>JavaScript简介</title><!-- [使用JS的三种方式]1、HTML标签中内嵌JS（不提倡使用）：<button onclick="javascript:alert(‘小碧池！你真点啊！‘)">有本事点我呀！！！</button> 2、HTML页面中直接使用JS:<script type="text/javascript">//JS代码</script> 3、引用外部JS文件:<script language="JavaScript" src="JS文件路径"></script> [注意事项]...

JavaScript逻辑运算符【图】

JavaScript中有三种逻辑运算符：非（！）、与（&&）、或（||）一：！非！可以用来对一个值进行非运算（一）、对布尔值进行！非运算所谓非运算就是一个布尔值进行取反操作。1、一次运算true变false，false变true2、如果对一个值进行两次取反，值不会变化。对非布尔值进行取反操作，现将非布尔值变成布尔值。所以我们可以利用这个特点将其他类型的值转换成布尔值。可以对任意一个值进行两次非运算（取反），即可将其转换为Boolean...

从思维导图中学习javascript第二章运算符

1.对象运算符：delete删除指定的对象的属性，数组元素，变量2.？：条件运算符等于if else3.，一行语句中执行多个不同的操作原文：http://www.cnblogs.com/hengqianduan/p/4052000.html

JavaScript中赋值运算符的使用【代码】【图】

JavaScript中的赋值运算可以分为简单赋值运算和复合赋值运算。简单赋值运算是将赋值运算符（=）右边表达式的值保存到左边的变量中；而复合赋值运算混合了其他操作（例如算术运算操作）和赋值操作。例如： sum+=i; //等同于sum=sum+i;JavaScript中的赋值运算符如下表所示。例如，某员工的月薪为5000元，扣除各项保险费用共500元，个人所得税起征点是3500元，税率为3%，计算该员工的实际收入是多少。代码如下：01 <script ...

JavaScript权威设计--JavaScript表达式与运算符,语句(简要学习笔记六)【代码】【图】

1.delete是一元操作符，用来删除对象属性或者元素。var a={x:1,y:2 } delete a.x; //删除x属性 “x”in a //false；a对象中已经不存在x属性 alert(a.x) //undefined;这里还是存在“东西”的就如：var b=[1,2,3]; delete b[0]; b.length //3；还是3，虽然上面已经删除了b[0] 2.void运算符void忽略操作的值，因此在操作数具有辅助作用的时候使用void来让程序更具语义例子： void 3 //undefinedvoid 3+5 //NaN;void...

Web前端（六）-JavaScript（引入方式、注释、语法、变量、数据类型、运算符、各种语句、方法相关、页面相关、NaN、对象相关、对象分类、BOM浏览器对象模型）【代码】

JavaScript作用: 用来给页面添加动态的效果LiveScript 改成 JavaScript 为了蹭热度语言特点:属于脚本语言, 不需要编译直接解析执行.属于弱类型语言, 变量声明时不需要指定类型 Java: int x = 10; String name="tom"; x="Jerry";编译报错JavaScript: let x=10; let name="tom"; x="Jerry"; 不会报错安全性高: 这门语言由于是嵌入到html页面中,最终执行在客户端浏览器中的语言,所以对安全性要求较高交互性强: JS语言是嵌入到html页面...

javascript的布尔运算符【代码】

布尔运算符分为四种:取反运算符(!)且运算符(&&)或运算符(||)三元运算符( ? 表达式1 : 表达式2 )取反运算符(!)用于将任何值转换为布尔值后再变为相反值,即true变false,false变true 取反运算符对以下六个值返回false,其余都返回true:undefinednull‘‘false0NaN 如果对一个值取反两次,则相当于将其转换为了布尔值,与Boolean()函数的作用相同 !!1 等同于Boolean(‘1‘)且运算符(&&)且运算符用于多个表达式: 表达式1 && 表达式2 运算规...

JavaScript 无符号位移运算符 >>> 三个大于号的使用方法

JavaScript 无符号位移运算符 >>> 三个大于号的使用方法JavaScript中的无符号位移运算符是用三个大于号来表示的计算方法例 100>>>2100的二进制是01100100向右移2位后为00011001最后结果为25100>>>2==25无符号位移（>>>）和有符号位移（>>）的区别是有符号位移运算时如果数字为正数时位移后在前面补0，为负数时则在位移后在前面补1例100>>2==25 和上面的计算方法一样如果100为负数-100>>>2-100的二进制为-_-好长。1111111111111111...

JavaScript扩展运算符（...）【图】

对象的扩展运算符扩展运算符是三个点（...）。用于取出参数对象的所有可遍历属性，然后拷贝到当前对象之中。如上图所示，新建了一个对象a，然后通过扩展运算符将其属性x,y一并拷贝到b对象中。合并两个对象扩展运算符可以合并两个对象自定义属性合并对象时，可以将对象与一些属性进行合并，如下需要说明的是，如果用户自定义的属性，放在扩展运算符后面，则扩展运算符内部的同名属性会被覆盖掉。数组的扩展运算符复制数组数组是复合...

javascript运算符

(一) 算术运算符 + - * / % var++ ++var var-- --var A. + (1) 用于数值的运算 (2) 用于字符串的连接 *************************** 任何的数据类型和字符串相加都是等于相加以后的字符串 ************************* B. % (1)用于取一段范围的值 eg:取偶数 \取奇数 (2) 一般不用于小数，因为结...

JavaScript中的运算符

JavaScript中的运算符，JavaScript是具有全范围的运算符,包括算术、逻辑、位、赋值以及其他某些运算符。　　计算逻辑位运算赋值杂项　　描述符号描述符号描述符号描述符号描述符号　　负值-逻辑非!按位取反~赋值=删除deletewww.mlybyby.com　　递增++小于<按位左移<<运算赋值oP=typeof 运算符typeof　　递减--大于>按位右移>>voidvoid　　乘法*小于等于<=无符号右移>>>instanceofinstanceof　　除法/大于等于>=按位与&newnew　　取...

JavaScript学习杂记--几个需要注意的运算符【图】

一：==运算符<1> "10"==10 ?<2>true==1 ? <3> {valueOf:function(){return "10"}}==10?原理是这样的，如果一个对象和int/string比较的话，js内部会优先调用valueOf方法，也就是将对象数值化，其实这里好玩的地方就是我们自定义的valueOf重写了父类的valueOf方法，所以就是判断“10”==10。如果你的类中没有定义valueOf方法的话，js内部引擎还会再去找toString()方法，如果有则执行。“===”：这个多出来的“=”就是在“==”的基础上...

javascript学习笔记---ECMAScript运算符（逻辑运算符）【代码】

Boolean 运算符非常重要，它使得程序语言得以正常运行。Boolean 运算符有三种：NOT、AND 和 OR。ToBoolean 操作在学习各种逻辑运算符之前，让我们先了解一下 ECMAScript-262 v5 规范中描述的 ToBoolean 操作。抽象操作 ToBoolean 将其参数按照下表中的规则转换为逻辑值：参数类型结果UndefinedfalseNullfalseBoolean结果等于输入的参数（不转换）Number如果参数为 +0, -0 或 NaN，则结果为 false；否则为 true。String如果参数为空...

JavaScript位运算符 2【代码】

按位运算符是把操作数看作一系列单独的位，而不是一个数字值。所以在这之前，不得不提到什么是“位”：数值或字符在内存内都是被存储为0和 1的序列，每个0和1被称之为1个位,比如说10进制数据2在计算机内被存储为 0 0 0 0 0 0 1 0，当我们将内存内的位值改变之后，这个值代表的意义也就变了，比如把2前移动一位，现在存储单元里面变成了0 0 0 0 0 1 0 0,这个值表示的是十进制的4,这也就是按位操作符的运算原理。按位运算符有6个：&...

JavaScript中的运算符和语句【图】

一、JavaScript的运算符原文：https://www.cnblogs.com/yiluhuakai/p/8520251.html

首页 / JAVASCRIPT / 运算符重载应如何使用

运算符重载应如何使用

内容导读

内容图文

内容总结

内容备注

内容手机端

【运算符重载应如何使用】教程文章相关的互联网学习教程文章

重载 - 相关标签

JAVASCRIPT - 技术教程分类

JAVASCRIPT - 最新教程

JAVASCRIPT - 最热教程