# js-execute-demo

**Repository Path**: xsw1999/js-execute-demo

## Basic Information

- **Project Name**: js-execute-demo
- **Description**: 执行输入的字符串格式代码
- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2024-07-09
- **Last Updated**: 2024-07-18

## Categories & Tags

**Categories**: Uncategorized

**Tags**: JavaScript, 代码运行

## README

# 介绍
用于执行以 input 或 textarea 方式输入的 js 代码，并返回执行结果
借助这种方式，可在 web 页面中编写一些外部脚本，并在代码中执行
> 输入的代码会放在一个沙箱中执行，此插件只返回脚本的返回值

# 效果
![image](./public/demo.gif)

<!-- # 效果
见 - [点此跳转](https://gitee.com/xsw1999/js-execute-demo)  -->

# 开始使用
## 安装
```js
npm install js-execute
```
## 使用示例
```js
import JSRunner from 'js-execute';

// 创建实例
const runner = new JSRunner(({code, data}) => {
  console.log('runner result = ', data)
});

// 执行代码
let inputCode = `
  let a = 1;
  let b = 2;
  let c = this.c;   // 通过 this.c 获取传入的参数
  return a + b + c    // return 最终结果
`
let props = { c: 3 } // c 作为自定义参数传入
runner.execute(inputCode, props) 
```

# 参数说明
## 创建实例
传入回调函数，在每次执行代码后调用，返回代码执行结果<br/>
```注意：代码的返回值需要主动 return 出来```

回调函数的入参格式为：
```js
({ 
  code, // code: 代码执行状态， 0: 成功  1: 失败
  data  // data: 执行代码后的返回值，由输入的代码决定
}) => {}
```
```注意：使用 code 只能捕获代码执行过程中出现的问题，而 代码结构不正确 导致的问题无法被捕获，建议在外部单独捕获这类问题```
## 执行代码
```js
execute(inputCode, props)
```
| 参数 | 说明 |
| - | - |
| inputCode | 由用户输入的 js 代码 |
| props | 自定义传入的参数，类型为 Object / null |

```js
关于代码执行的一些说明：
  1. 若需要返回值，请确保代码结尾将结果 return 出来
  2. props 需要为 Object 类型，在代码执行过程中，通过 this 获取 props 中的属性
```