Giter VIP home page Giter VIP logo

js-interpreter's Introduction

js-interpreter

详细说明见 你好,JS 解释器

语法树 AST

在生成语法树前,需要先进行分词 Token

通过模块acornJS代码解析为AST树。

如将代码段解析为如下结构:

let a = 1;
{
  "type": "Program",
  "start": 0,
  "end": 10,
  "body": [
    {
      "type": "VariableDeclaration",
      "start": 0,
      "end": 10,
      "declarations": [
        {
          "type": "VariableDeclarator",
          "start": 4,
          "end": 9,
          "id": {
            "type": "Identifier",
            "start": 4,
            "end": 5,
            "name": "a"
          },
          "init": {
            "type": "Literal",
            "start": 8,
            "end": 9,
            "value": 1,
            "raw": "1"
          }
        }
      ],
      "kind": "let"
    }
  ],
  "sourceType": "module"
}

作用域 Scope

在每一个新的块中需要创建新的作用域

JS中作用域主要分为三个部分:

  • 全局作用域
  • 函数作用域
  • 块作用域

本解释器中,作用域中存储相关的变量信息,包含declaregetset三个部分。

针对var const let三类变量进行存储,各自具备各自的声明与使用特点。

var

  • 允许重复声明
  • 声明提前至函数作用域全局作用域
  • 全局作用域下变量直接赋值,则当作var处理

const

  • 不允许重复声明
  • 不允许重新赋值
  • 不能声明提前

let

  • 不允许重复声明
  • 不能声明提前

函数 Function

本解释器中处理以下几类函数:

  • 普通函数 function() {}
  • 箭头函数 () => {}
  • 异步函数 async function() {}
  • 生成器函数 funtion* (){}

对于函数的处理,需创建新的函数返回,在新的函数中对原函数进行调用。

额外注意:

  • 参数的处理,创建新的作用域,当前作用域
  • return的处理,在递归中将return返回
  • 箭头函数的返回方式有两种

异步 Async

异步函数将基于 Generator 来实现,处理asyncawait字段。

通过asyncToGenerator函数来同步执行异步函数,见lib.js

生成器 Generator

生成器的实现直接借用 API 来完成,处理yieldfunction *{}

yield

生成器的特点在于中断恢复,即中断当前执行环境,恢复上一次的执行环境。

正因此,yield不能像return一样前提,需要将递归函数同样封装为 generator

gen.next()返回值为如下对象:

{
  value: "xx",
  done: false // true
}

js-interpreter's People

Contributors

mrpluto0 avatar

Stargazers

 avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.