Tạo và chạy mã

Ứng dụng của bạn có thể tạo mã bất cứ lúc nào. Ví dụ: nó có thể tạo mã khi người dùng cuối nhấp vào một nút hoặc mỗi khi người dùng thực hiện thay đổi.

Để biết thông tin tổng quan về quá trình tạo mã, hãy xem phần Tạo mã.

Nhập công cụ tạo mã ngôn ngữ

Để tạo mã, bạn cần có một công cụ tạo mã. Bạn có thể nhập trình tạo mã ngôn ngữ bằng một trong các phương thức sau.

Mô-đun

import {javascriptGenerator} from 'blockly/javascript';
import {pythonGenerator} from 'blockly/python';
import {phpGenerator} from 'blockly/php';
import {luaGenerator} from 'blockly/lua';
import {dartGenerator} from 'blockly/dart';

// Generate code for all the blocks in the workspace.
const jsCode = javascriptGenerator.workspaceToCode(workspace);
const pythonCode = pythonGenerator.workspaceToCode(workspace);
const phpCode = phpGenerator.workspaceToCode(workspace);
const luaCode = luaGenerator.workspaceToCode(workspace);
const dartCode = dartGenerator.workspaceToCode(workspace);

Unpkg

Bạn phải thêm trình tạo sau khi thêm Blockly.

<script src="https://unpkg.com/blockly"></script>
<script src="https://unpkg.com/blockly/javascript_compressed"></script>
<script src="https://unpkg.com/blockly/python_compressed"></script>
<script src="https://unpkg.com/blockly/php_compressed"></script>
<script src="https://unpkg.com/blockly/lua_compressed"></script>
<script src="https://unpkg.com/blockly/dart_compressed"></script>

// Generate code for all the blocks in the workspace.
const jsCode = javascript.javascriptGenerator.workspaceToCode(workspace);
const pythonCode = python.pythonGenerator.workspaceToCode(workspace);
const phpCode = php.phpGenerator.workspaceToCode(workspace);
const luaCode = lua.luaGenerator.workspaceToCode(workspace);
const dartCode = dart.dartGenerator.workspaceToCode(workspace);

Tập lệnh nội dung

Bạn phải thêm trình tạo sau khi thêm Blockly.

<script src="blockly_compressed.js"></script>
<script src="javascript_compressed.js"></script>
<script src="python_compressed.js"></script>
<script src="php_compressed.js"></script>
<script src="lua_compressed.js"></script>
<script src="dart_compressed.js"></script>

// Generate code for all the blocks in the workspace.
const jsCode = javascript.javascriptGenerator.workspaceToCode(workspace);
const pythonCode = python.pythonGenerator.workspaceToCode(workspace);
const phpCode = php.phpGenerator.workspaceToCode(workspace);
const luaCode = lua.luaGenerator.workspaceToCode(workspace);
const dartCode = dart.dartGenerator.workspaceToCode(workspace);

Tạo mã

Để tạo mã, hãy sử dụng hàm workspaceToCode của trình tạo.

const code = javascriptGenerator.workspaceToCode(workspace);

Cập nhật liên tục

Các bản cập nhật liên tục cho phép bạn hiển thị hoặc chạy mã bất cứ khi nào người dùng thực hiện thay đổi. Tạo mã là một thao tác nhanh, vì vậy, việc này ít ảnh hưởng đến hiệu suất. Bạn có thể thực hiện việc này bằng cách sử dụng một trình nghe sự kiện.

const supportedEvents = new Set([
  Blockly.Events.BLOCK_CHANGE,
  Blockly.Events.BLOCK_CREATE,
  Blockly.Events.BLOCK_DELETE,
  Blockly.Events.BLOCK_MOVE,
]);

function updateCode(event) {
  if (workspace.isDragging()) return; // Don't update while changes are happening.
  if (!supportedEvents.has(event.type)) return;

  const code = javascriptGenerator.workspaceToCode(workspace);
  document.getElementById('textarea').value = code;
}

workspace.addChangeListener(updateCode);

Thêm mã lời mở đầu hoặc tái bút

Sau khi tạo mã, bạn có thể tuỳ ý thêm mã trước khi bắt đầu hoặc sau khi kết thúc mã đã tạo.

let code = javascriptGenerator.workspaceToCode(workspace);
// Add a preamble and a postscript to the code.
const preamble = 'import {MyLibrary} from \'/path/to/my/library\';\n'
const postscript = 'MyLibrary.myKickoffFunction();\n';
code = preamble + code + postscript;

Mã phần mở đầu thường được dùng để thêm các định nghĩa bên ngoài vào đầu mã. Mã Postscript thường được dùng để gọi các hàm nhằm bắt đầu hành vi ở cuối mã.

Nếu mã được tạo có thể chạy ngay, thì bạn không cần thêm phần mở đầu hoặc phần tái bút.

Thực thi mã

Sau khi tạo mã, bạn cần tìm ra cách thực thi mã đó. Quyết định cách thực thi là rất cụ thể cho từng ứng dụng và nằm ngoài phạm vi của Blockly.

Nếu bạn muốn thực thi mã JavaScript, hãy xem phần Tạo và chạy JavaScript. Phần này thảo luận về một số tính năng đặc biệt của công cụ tạo mã JavaScript, cũng như JSInterpreter mà nhóm Blockly đề xuất như một cách để thực thi JavaScript một cách an toàn.

Các ngôn ngữ khác yêu cầu các công cụ khác.