如何在Blockly中创建可自动重命名的内部函数？

核心原理 #

Blockly内置的函数（比如随机颜色块的colourRandom）能在与用户定义变量重名时自动改名，核心是利用了代码生成器的名称冲突检测机制——生成代码时会自动追踪已使用的标识符（变量名、函数名），若内置函数名和用户变量名重复，就会给函数名添加后缀（如colourRandom2）避免冲突。

具体实现步骤 #

以下是参考内置随机颜色块实现的自定义函数块开发流程：

1. 定义自定义块的结构 #

先在Blockly的块定义中，给函数设置一个基础名称（比如customRandomNum），同时配置块的外观和输入输出：

Blockly.Blocks['custom_random_num'] = {
  init: function() {
    this.jsonInit({
      "message0": "生成随机整数",
      "output": "Number",
      "colour": 230,
      "tooltip": "生成0到2^24之间的随机整数",
      "helpUrl": ""
    });
  }
};

2. 配置代码生成器的名称管理 #

关键是在JavaScript代码生成器中，使用Blockly提供的Blockly.JavaScript.provideFunction_方法，这个方法会自动处理名称冲突：

Blockly.JavaScript['custom_random_num'] = function(block) {
  // 定义函数的基础名称和实现代码
  const functionName = Blockly.JavaScript.provideFunction_(
      'customRandomNum',
      ['function %1() {',
       '  return Math.floor(Math.random() * Math.pow(2, 24));',
       '}'].join('\n'));
  // 返回函数调用语句
  return [functionName + '();', Blockly.JavaScript.ORDER_FUNCTION_CALL];
};

3. 验证冲突处理效果 #

• 拖出这个自定义块，切换到JavaScript标签，会生成：

function customRandomNum() {
  return Math.floor(Math.random() * Math.pow(2, 24));
}

customRandomNum();

• 若创建同名变量customRandomNum并添加赋值块，切换到JavaScript标签，函数会自动重命名为customRandomNum2，生成代码：

var customRandomNum;

function customRandomNum2() {
  return Math.floor(Math.random() * Math.pow(2, 24));
}

customRandomNum2();

customRandomNum = 0;

关键细节说明 #

• Blockly.JavaScript.provideFunction_是实现自动重命名的核心：它会检查当前作用域中是否已存在同名标识符（变量或函数），如果存在就自动递增后缀数字，确保名称唯一。
• 函数的基础名称要尽量语义化，同时避免和Blockly内置标识符重复。

内容的提问来源于stack exchange，提问作者noname