การสร้างโค้ด
จัดทุกอย่างให้เป็นระเบียบอยู่เสมอด้วยคอลเล็กชัน
บันทึกและจัดหมวดหมู่เนื้อหาตามค่ากำหนดของคุณ
การสร้างโค้ดคือกระบวนการเปลี่ยนบล็อกในพื้นที่ทํางานให้เป็นสตริงโค้ดที่ดําเนินการได้
การสร้างโค้ดมีความสําคัญอย่างยิ่ง เนื่องจากเป็นสิ่งทําให้บล็อกทําสิ่งต่างๆ ได้จริง เช่น ประเมินนิพจน์ทางคณิตศาสตร์ ย้ายตัวละครผ่านเขาวงกต หรือกําหนดค่าร้านค้าออนไลน์
คุณไม่สามารถ "เรียกใช้" บล็อกโดยตรง แต่ให้สร้างสตริงโค้ด แล้วเรียกใช้สตริงเหล่านั้นแทน
เครื่องมือสร้างรหัสภาษา
หากต้องการสร้างโค้ด คุณต้องเลือกภาษาแบบข้อความที่ต้องการสร้าง เนื่องจากแต่ละภาษามีเครื่องมือสร้างโค้ดของตัวเอง
เครื่องมือสร้างโค้ดภาษา (หรือที่เรียกกันทั่วไปว่าเครื่องมือสร้างโค้ด) คือคลาสที่จัดการกฎในการสร้างโค้ดสำหรับภาษาหนึ่งๆ โดยเฉพาะ แต่ไม่ใช่สำหรับแต่ละบล็อก เช่น จัดการเรื่องต่างๆ เช่น การจัดรูปแบบความคิดเห็น การเยื้องคำสั่ง และการยกข้อความ
Blockly มีเครื่องมือสร้างโค้ดในตัว 5 รายการ ดังนี้
- JavaScript ES5
- Python 3
- Lua 5.1
- Dart 2
- PHP 7
หากรายการนี้ไม่มีภาษาที่คุณต้องการสร้างโค้ด คุณสามารถสร้างเครื่องมือสร้างรหัสภาษาที่กำหนดเองได้ ดูตัวอย่างง่ายๆ ได้ที่ Codelab สร้างเครื่องมือสร้างที่กำหนดเอง ซึ่งจะสร้างเครื่องมือสร้างโค้ดภาษา JSON ดูตัวอย่างที่ซับซ้อนมากขึ้นได้ที่เครื่องมือสร้างโค้ด JavaScript โปรดทราบว่าคุณต้องเขียนตัวสร้างโค้ดบล็อกสําหรับบล็อกในตัวที่ต้องการใช้ด้วย
เครื่องมือสร้างโค้ดบล็อก
แต่ละบล็อกมีหน้าที่สร้างโค้ดของตนเอง เมื่อสร้างบล็อก คุณจะต้องเขียนเครื่องมือสร้างโค้ดบล็อกแยกต่างหากสำหรับแต่ละภาษาที่ต้องการรองรับ
เครื่องมือสร้างโค้ดบล็อกคือฟังก์ชันที่แสดงผลโค้ดของบล็อกนั้นในรูปแบบสตริง เช่น บล็อกที่เปรียบเทียบตัวเลข 2 รายการจะแสดงผลสตริงในรูปแบบ 'a < b'
และบล็อกที่แสดงคำสั่ง if จะแสดงผลสตริงในรูปแบบ 'if (...) {\n...\n};\n'
import {javascriptGenerator} from 'blockly/javascript';
import {pythonGenerator} from 'blockly/python';
// Write block-code generators for JavaScript and Python.
javascriptGenerator.forBlock['my_custom_block'] = function(block, generator) { /* ... */ };
pythonGenerator.forBlock['my_custom_block'] = function(block, generator) { /* ... */ };
เครื่องมือสร้างโค้ดบล็อกจะเรียกใช้โดยเครื่องมือสร้างโค้ดภาษา
ดูข้อมูลเพิ่มเติมได้ที่เครื่องมือสร้าง
สร้างและเรียกใช้โค้ด
แอปพลิเคชันจะสร้างรหัสได้ทุกเมื่อ เช่น อาจมีการสร้างโค้ดเมื่อผู้ใช้ปลายทางคลิกปุ่มหรือทุกครั้งที่ผู้ใช้ทําการเปลี่ยนแปลง
หลังจากสร้างโค้ดแล้ว คุณต้องหาวิธีเรียกใช้
การเลือกวิธีดำเนินการจะขึ้นอยู่กับแอปพลิเคชันนั้นๆ และอยู่นอกขอบเขตของ Blockly
ดูข้อมูลเพิ่มเติมได้ที่สร้างและเรียกใช้โค้ด
เนื้อหาของหน้าเว็บนี้ได้รับอนุญาตภายใต้ใบอนุญาตที่ต้องระบุที่มาของครีเอทีฟคอมมอนส์ 4.0 และตัวอย่างโค้ดได้รับอนุญาตภายใต้ใบอนุญาต Apache 2.0 เว้นแต่จะระบุไว้เป็นอย่างอื่น โปรดดูรายละเอียดที่นโยบายเว็บไซต์ Google Developers Java เป็นเครื่องหมายการค้าจดทะเบียนของ Oracle และ/หรือบริษัทในเครือ
อัปเดตล่าสุด 2025-07-25 UTC
[[["เข้าใจง่าย","easyToUnderstand","thumb-up"],["แก้ปัญหาของฉันได้","solvedMyProblem","thumb-up"],["อื่นๆ","otherUp","thumb-up"]],[["ไม่มีข้อมูลที่ฉันต้องการ","missingTheInformationINeed","thumb-down"],["ซับซ้อนเกินไป/มีหลายขั้นตอนมากเกินไป","tooComplicatedTooManySteps","thumb-down"],["ล้าสมัย","outOfDate","thumb-down"],["ปัญหาเกี่ยวกับการแปล","translationIssue","thumb-down"],["ตัวอย่าง/ปัญหาเกี่ยวกับโค้ด","samplesCodeIssue","thumb-down"],["อื่นๆ","otherDown","thumb-down"]],["อัปเดตล่าสุด 2025-07-25 UTC"],[[["\u003cp\u003eCode generation transforms Blockly blocks into executable code strings in various programming languages like JavaScript, Python, Lua, Dart, and PHP.\u003c/p\u003e\n"],["\u003cp\u003eBlockly offers built-in code generators for these languages, accessible through modules, Unpkg, or local scripts, along with the option to create custom generators.\u003c/p\u003e\n"],["\u003cp\u003eGenerating code involves defining how individual blocks translate to code in each target language, including handling fields, inner blocks, and code concatenation.\u003c/p\u003e\n"],["\u003cp\u003eCode generation can be triggered on demand or continuously as the user interacts with the blocks, allowing for dynamic updates and code execution.\u003c/p\u003e\n"],["\u003cp\u003eDevelopers can add preamble or postscript code to the generated output for including external definitions or initiating specific behaviors.\u003c/p\u003e\n"]]],["Code generation transforms visual blocks into executable code strings. A code generator handles language-specific formatting. Blockly offers built-in generators for JavaScript, Python, Lua, Dart, and PHP, accessible via modules, Unpkg, or local scripts. Custom generators are also supported. Each block's code generation rules must be defined per language. Generation occurs on demand or continuously via event listeners. Optional preamble/postscript code can be added. Execution of generated code is application-specific, and for JavaScript, JSInterpreter is suggested.\n"],null,[]]