码迷,mamicode.com
首页 > Web开发 > 详细

编译原理之Lexical Analysis(js实现)

时间:2019-03-15 19:20:34      阅读:432      评论:0      收藏:0      [点我收藏+]

标签:href   putc   code   let   doctype   越界   utc   oct   图片   

// 实验存档

效果图:

技术图片

代码:

<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8">
        <title>Lexical_Analysis</title>
        <link href="https://fonts.googleapis.com/css?family=Noto+Serif+SC" rel="stylesheet">
        <style>
            main {
                /*对子元素开启弹性布局*/
                display: flex;
                /*弹性元素在必要的时候换行*/
                flex-wrap: wrap;
                /*将弹性元素居中*/
                justify-content: center;
            }
            
            textarea,
            button {
                font-family: ‘Noto Serif SC‘, STFangSong, serif;
                font-size: 17px;
            }
        </style>
    </head>

    <body>
        <main>
            <textarea name="input" rows="20" cols="40"></textarea>
            <textarea name="output" rows="20" cols="40"></textarea>
            <button name="compile">Lexical Analysis</button>
        </main>s

        <script>
            let inputBox = document.querySelector("textarea[name=input]");
            let outputBox = document.querySelector("textarea[name=output]");
            let btnCompile = document.querySelector("button[name=compile]");
            btnCompile.addEventListener("click", event => {
                let inputCode = inputBox.value;
                outputBox.value = JSON.stringify(Lexical_Analysis(inputCode));
            });
            /*
             * 规则:
            识别保留字:if、int、for、while、do、return、break、continue;
            单词种别码为1。
            其他的都识别为标识符;单词种别码为2。
            常数为无符号整形数;单词种别码为3。
            运算符包括:+、-、*、/、=、>、<、>=、<=、!= ;单词种别码为4。
            分隔符包括:,、;、{、}、(、); 单词种别码为5。
             */
            const reservedWords = [if, int, for, while, do, return, break, continue];
            const operators = [+, -, *, /, =, <, >, !, >=, <=, !=];
            const separators = [,, ;, {, }, (, )];

            function Lexical_Analysis(str) {
                /**
                 * current用于标识当前字符位置,
                 * str[cur]即为当前字符
                 */
                let cur = 0;
                /**
                 * tokens存储词法分析的最终结果
                 */
                let tokens = [];

                while(cur < str.length) {

                    if(/\s/.test(str[cur])) { // 跳过空格
                        cur++;
                    } else if(/[a-z]/i.test(str[cur])) { // 读单词
                        debugger;
                        let word = "" + str[cur++];
                        // 测试下一位字符,如果不是字母直接进入下一次循环(此时cur已经右移)
                        // 如果是则继续读字母,并将cur向右移动
                        while(cur < str.length && /[a-z]/i.test(str[cur])) {
                            // cur < str.length防止越界
                            word += str[cur++];
                        }
                        if(reservedWords.includes(word)) {
                            tokens.push({
                                type: 1,
                                value: word,
                            }); // 存储保留字(关键字)
                        } else {
                            tokens.push({
                                type: 2,
                                value: word,
                            }); // 存储普通单词                            
                        }
                    } else if(separators.includes(str[cur])) {
                        tokens.push({
                            type: 5,
                            value: str[cur++],
                        }); // 存储分隔符并将cur向右移动                                            
                    } else if(operators.includes(str[cur])) {
                        let operator = "" + str[cur++];
                        if([>, <, !].includes(operator)) {
                            // 如果下一个字符是=就添加到operator并再次向右移动cur
                            if(str[cur] = =) {
                                operator += str[cur++];
                            }
                        }
                        tokens.push({
                            type: 4,
                            value: operator,
                        }); // 存储运算符                        
                    } else if(/[0-9]/.test(str[cur])) {
                        let val = "" + str[cur++];
                        // cur < str.length防止越界
                        while(cur < str.length && /[0-9]/.test(str[cur])) {
                            val += str[cur++];
                        }
                        tokens.push({
                            type: 3,
                            value: val,
                        }); // 存储整数数字    
                    } else {
                        return "包含非法字符:" + str[cur];
                    }

                }
                return tokens;
            }
        </script>
    </body>
</html>

 

编译原理之Lexical Analysis(js实现)

标签:href   putc   code   let   doctype   越界   utc   oct   图片   

原文地址:https://www.cnblogs.com/xkxf/p/10538719.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!