react-js
tyler_download
这个作者很懒,什么都没留下…
展开
-
Reactjs+BootStrap开发自制编程语言Monkey的编译器:词法解析1
设计Monkey语言的词法解析器原创 2017-11-10 11:58:51 · 769 阅读 · 0 评论 -
自制Monkey语言编译器:解释执行哈希表对象
我们在上节完成了对哈希表对象的解析,这一节我们给编译器添加执行哈希表对象的功能,完成本节代码后,编译器能执行以下代码:let hash = {'hello':'world'}let y = hash['hello']当编译器执行上面代码后,变量y的值就是字符串’world’,接下来我们看相关代码的实现。我们需要在解释器中创建哈希表的符号对象,因此先添加如下代码:class ...原创 2018-08-10 17:14:59 · 443 阅读 · 0 评论 -
自制Monkey编程语言编译器:增加数组操作API和Mapsh数据类型
前一节,我们为Monkey语言以及其编译器增加了内置API len,以及数组数据类型,内置的len函数调用能作用到数组和字符串上,分别返回数组的元素个数和字符串的字符长度。本节我们继续增加三个能作用到数组上的内置API,这样Monkey语言能更方便的支持数组操作。我们在这里要增加的第一个API叫first。他返回数组首个元素,也就是它的作用与myArray[0]等价,但用first获得首个元素...原创 2018-07-13 11:55:31 · 383 阅读 · 0 评论 -
reactjs开发自制编程语言编译器:实现变量绑定和函数调用
在编程时,我们会初始化一个变量,给变量赋初值,例如下面语句:let x = 5*5;上面代码被编译器解读后,变量x就会和数值25绑定在一起。下次使用到变量x时,编译器会读取它绑定的值,然后用于相关代码的执行,例如下面代码:let y = x + 5;编译器执行上面语句后,变量y就会跟数值30绑定起来,本节我们就先增加变量绑定的功能。变量绑定功能不难实现,我们只要创建一个...原创 2018-05-18 16:41:13 · 609 阅读 · 0 评论 -
自制Monkey语言编译器:解释执行if..else判断语句
任何编程语言都少不了条件判断语句,Monkey语言也一样,有自己的If…else条件判断指令,本节我们看看如何解释执行该条件判断语句。根据我们原有的解释执行机制,我们只要在原框架的基础上添加若干代码就可以实现本节功能。当本节代码完成后,执行结果如下: 如图中的if else 语句被编译器解释执行后,在控制台的输出如下: 根据输出可知,编译器在执行了if里面的条件判断后,执行了if模块里...原创 2018-03-29 16:56:13 · 721 阅读 · 0 评论 -
自制Monkey语言编译器:解释执行return语句和错误处理控制
在高级编程语言中,大多含有一个指令叫return,也就是程序的执行指令流遇到该语句后不再往下执行,而是返回上一层,如果return后面附带数据的话,程序会把数据夹带到调用栈上一层的代码执行路径。本节我们就给Monkey语言编译器增加解释执行return语句的功能,完成本节代码后,编译器能解释执行如下代码:代码中存在两个if 间套,内层if执行return语句附带返回整数10,外层if 最后...原创 2018-04-03 17:57:39 · 475 阅读 · 0 评论 -
开发自制语言Monkey编译器:实现复杂算术表达式的执行
前几节,我们大费周章的详细解释如何对复杂的算术表达式进行语法解析,也就是让程序懂得理解复杂的算术表达式,本节我们探讨如何执行复杂表达式对应的运算并给出最终结果。我们先看这么个算术表达式:(5 + 10 * 2 + 15 / 3) * 2 + -10上面算术表达式涉及到多种运算符,再加上含有括号,因此程序在解读这个表达式时,还需考虑到运算的优先级。我们看看如何让程序懂得把这个运算式的结果计算...翻译 2018-02-23 17:31:34 · 663 阅读 · 0 评论 -
自制monkey语言编译器:符号系统与代码执行
前几节,我们介绍了如何使用语法解析算法对代码进行解析。语法解析的目的是为了明白代码语句的意图,例如对于语句: c = a + b; 语法解析后,编译器就明白代码是想把变量a和b的值相加,再把结果赋值给变量c.然而要想实现这样的结果,编译器还得需要不少辅助信息,例如变量a和b对应的数值是多少,这些辅助信息我们会存储在一种称之为符号表的数据结构中。在前几节语法解析时,代码实际上建造了一种树形结构,...原创 2018-02-16 18:07:53 · 491 阅读 · 0 评论 -
reactjs自制Monkey语言编译器:解析组合表达式,ifelse语句块和间套函数调用
在网易云课堂上,我启动过一个编译器开发课程链接如下:用java开发C语言编译器我们的计算机教育时常流于肤浅,在面对难度较大的基础理论时,总是喜欢侃侃而谈,说起来头头是道,看起似乎很牛逼的样子,但本质上却是大而无当,空洞无物。任何上过大学,专业是计算机的同学或许能深有体会,像操作系统,编译原理,计算机网络等学科的基础理论内容,老师在课堂上讲解总是流于表面,各种深奥的大词从老师嘴里不断飘出,搞原创 2018-01-19 15:49:25 · 504 阅读 · 0 评论 -
使用普拉特分析法解析极为复杂的算术表达式
用普拉特解析法解析足够复杂的算术表达式原创 2018-01-03 17:13:11 · 1281 阅读 · 0 评论 -
Reactjs开发自制编程语言Monkey的编译器:语法解析
语法解析器入门,解析let 语句原创 2017-12-21 15:23:44 · 720 阅读 · 0 评论 -
Reactjs开发自制编程语言Monkey的编译器:使用组件的state机制实现屏幕取词
实现翻译软件似的屏幕取词功能原创 2017-12-01 16:02:48 · 492 阅读 · 0 评论 -
Reactjs开发自制编程语言Monkey的编译器:高能技术干货之语法高亮2
在web上实现关键字实时语法高亮效果原创 2017-11-18 16:39:34 · 709 阅读 · 0 评论 -
Reactjs开发自制编程语言Monkey的编译器:高能技术干货之语法高亮1
使用分词算法,和观察者模式等技术,即时遍历DOM结构树,实现关键字的即时语法高亮效果原创 2017-11-17 16:15:16 · 5318 阅读 · 0 评论 -
利用web work实现多线程异步机制,打造页面单步调试IDE
我们已经完成了整个编译器的开发,现在我们做一个能够单步调试的页面IDE,完成本章代码后,我们可以实现下面如图所示功能:页面IDE可以显示每行代码所在的行,单击某一行,在改行前面会出现一个红点表示断点,点击Parsing按钮后,进入单步调试模式,然后每点一次step按钮,页面就会执行一条语句,被执行的语句会以黄色高亮,同时左边还有一个箭头表明当前编译器正在执行该语句,此时我们把鼠标挪动到变量名上...原创 2018-10-01 17:55:20 · 387 阅读 · 0 评论