वैरिएबल, प्रोग्रामिंग का एक अहम कॉन्सेप्ट है. Blockly, Python और JavaScript जैसी डाइनैमिक टाइप वाली भाषाओं के साथ काम करता है. इसके अलावा, थोड़ी ज़्यादा मेहनत करके, Java या C जैसी मज़बूत टाइप वाली भाषाओं (या स्टैटिक टाइप वाली भाषाओं) के लिए भी जानकारी जोड़ी जा सकती है.
डाइनैमिक टाइप वाली भाषाओं और स्टैटिक टाइप वाली भाषाओं के बारे में ज़्यादा जानने के लिए, डेटा टाइप के बारे में जानकारी: स्टैटिक, डाइनैमिक, मज़बूत, और कमज़ोर लेख पढ़ें.
Blockly, वैरिएबल फ़ील्ड उपलब्ध कराता है. ये डाइनैमिक ड्रॉपडाउन बॉक्स होते हैं, जिनमें उपयोगकर्ता के दिए गए वैरिएबल के नाम दिखते हैं. यहां इसका एक उदाहरण दिया गया है.

डिफ़ॉल्ट रूप से, Blockly किसी भी टाइप को वैरिएबल के तौर पर असाइन करने की अनुमति देता है. साथ ही, Blockly के उपलब्ध कराए गए सभी जनरेटर, डाइनैमिक टाइप वाली भाषाओं के लिए होते हैं. अगर इसके बजाय, टाइप वाली भाषा का इस्तेमाल किया जा रहा है, तो Blockly को कॉन्फ़िगर करके, उसे इस्तेमाल किया जा सकता है. इसके लिए, यह तरीका अपनाएं:
- वैरिएबल टाइप और उसके ब्लॉक तय करें, इनमें गेटर और सेटर भी शामिल हैं.
- टूलबॉक्स को कॉन्फ़िगर करें ताकि आप अपने वैरिएबल टाइप और ब्लॉक का इस्तेमाल कर सकें.
- वैरिएबल और उनके ब्लॉक के लिए जनरेटर तय करें.
टाइप न किए गए वैरिएबल ब्लॉक
वैरिएबल को ऐक्सेस करने और उसमें बदलाव करने के लिए, सबसे बुनियादी ब्लॉक, गेटर और सेटर ब्लॉक होते हैं. आइए, Blockly के उपलब्ध कराए गए गेटर और सेटर ब्लॉक के बारे में जानते हैं.
JSON
// Block for variable getter.
{
"type": "variables_get",
"message0": "%1",
"args0": [
{ // Beginning of the field variable dropdown
"type": "field_variable",
"name": "VAR", // Static name of the field
"variable": "%{BKY_VARIABLES_DEFAULT_NAME}" // Given at runtime
} // End of the field variable dropdown
],
"output": null, // Null means the return value can be of any type
...
},
// Block for variable setter.
{
"type": "variables_set",
"message0": "%{BKY_VARIABLES_SET}",
"args0": [
{
"type": "field_variable",
"name": "VAR",
"variable": "%{BKY_VARIABLES_DEFAULT_NAME}"
},
{
"type": "input_value", // This expects an input of any type
"name": "VALUE"
}
],
...
}
JavaScript
// Block for variable getter.
Blockly.Blocks['variables_get'] = {
init: function() {
this.appendDummyInput()
.appendField(new Blockly.FieldVariable("VAR_NAME"), "FIELD_NAME");
this.setOutput(true, null);
...
}
};
// Block for variable setter.
Blockly.Blocks['variables_set'] = {
init: function() {
this.appendValueInput("NAME")
.setCheck(null)
.appendField("set")
.appendField(new Blockly.FieldVariable("VAR_NAME"), "FIELD_NAME")
.appendField("to");
this.setOutput(true, null);
...
}
};
इससे ये दो ब्लॉक बनते हैं:

ध्यान देने वाली अहम बात यह है कि वैरिएबल गेटर के "आउटपुट" को 'शून्य' पर सेट करने से, रिटर्न वैल्यू किसी भी टाइप की हो सकती है. इसके अलावा, ध्यान दें कि वैरिएबल सेटर के इनपुट में कोई भी चेक तय नहीं किया गया है. इसलिए, वैरिएबल को किसी भी टाइप की वैल्यू पर सेट किया जा सकता है.
टाइप किए गए वैरिएबल ब्लॉक
टाइप की जांच करने वाले गेटर और सेटर जोड़े जा सकते हैं. उदाहरण के लिए, अगर आपने
"Panda" टाइप का वैरिएबल बनाया है, तो यहां दी गई परिभाषाओं से, सही टाइप वाला
गेटर और सेटर बनता है.
JSON
// Block for Panda variable getter.
{
"type": "variables_get_panda",
"message0": "%1",
"args0": [
{
"type": "field_variable",
"name": "VAR",
"variable": "%{BKY_VARIABLES_DEFAULT_NAME}",
"variableTypes": ["Panda"], // Specifies what types to put in the dropdown
"defaultType": "Panda"
}
],
"output": "Panda", // Returns a value of "Panda"
...
},
// Block for Panda variable setter.
{
"type": "variables_set_panda",
"message0": "%{BKY_VARIABLES_SET}",
"args0": [
{
"type": "field_variable",
"name": "VAR",
"variable": "%{BKY_VARIABLES_DEFAULT_NAME}",
"variableTypes": ["Panda"],
"defaultType": "Panda"
},
{
"type": "input_value",
"name": "VALUE",
"check": "Panda" // Checks that the input value is of type "Panda"
}
],
"previousStatement": null,
"nextStatement": null,
...
}
JavaScript
// Block for Panda variable getter.
Blockly.Blocks['variables_get_panda'] = {
init: function() {
this.appendDummyInput()
.appendField(new Blockly.FieldVariable(
"VAR_NAME", ['Panda'], 'Panda'), "FIELD_NAME");
this.setOutput(true, 'Panda');
...
}
};
// Block for Panda variable setter.
Blockly.Blocks['variables_set_panda'] = {
init: function() {
this.appendValueInput("NAME")
.setCheck('Panda')
.appendField("set")
.appendField(new Blockly.FieldVariable(
"VAR_NAME", null, ['Panda'], 'Panda'), "FIELD_NAME")
.appendField("to");
this.setPreviousStatement(true, null);
this.setNextStatement(true, null);
...
}
};
इससे दो टाइप के ब्लॉक बनते हैं: एक गेटर और एक सेटर. इनके ड्रॉपडाउन में, सिर्फ़
"Panda" टाइप के वैरिएबल दिखते हैं. इनके इनपुट और आउटपुट में, सिर्फ़
"Panda" टाइप के कनेक्शन स्वीकार किए जाते हैं. फ़ील्ड का defaultType, variableTypes कलेक्शन में मौजूद किसी एक वैल्यू पर सेट होना चाहिए. variableTypes कलेक्शन उपलब्ध कराते समय, defaultType को सेट न करने पर, गड़बड़ी दिखेगी.
डिफ़ॉल्ट रूप से, उपयोगकर्ता को यह बताने के लिए कोई विज़ुअल इंडिकेटर नहीं होता कि किस टाइप का इस्तेमाल किया जा रहा है. वैरिएबल टाइप में अंतर करने का एक आसान तरीका, रंग का इस्तेमाल करना है.
टूलबॉक्स में वैरिएबल जोड़ना
वैरिएबल के इस नए टाइप को उपयोगकर्ताओं के लिए काम का बनाने के लिए, आपको नए वैरिएबल बनाने और उनका इस्तेमाल करने का तरीका जोड़ना होगा.
अगर आपके पास पहले से वैरिएबल के लिए कोई डाइनैमिक कैटगरी नहीं है, तो एक नई कैटगरी बनाएं.

कैटगरी में अपने नए गेटर और सेटर जोड़ें.

वैरिएबल बनाने का बटन
इसके बाद, उपयोगकर्ता को वैरिएबल बनाने का तरीका चाहिए. इसका सबसे आसान तरीका, "वैरिएबल बनाएं" बटन का इस्तेमाल करना है.
बटन बनाते समय, कॉलबैक कॉल करें
Blockly.Variables.createVariableButtonHandler(button.getTargetWorkspace(), null, 'panda');
और "Panda" टाइप का वैरिएबल बन जाएगा!
उपयोगकर्ताओं को एक से ज़्यादा टाइप के वैरिएबल बनाने की अनुमति देने का सबसे आसान तरीका है कि हर टाइप के लिए एक "बनाएं" बटन हो. जैसे, स्ट्रिंग वैरिएबल बनाएं, नंबर वैरिएबल बनाएं, पांडा वैरिएबल बनाएं.
अगर आपके पास दो या तीन से ज़्यादा वैरिएबल टाइप हैं, तो आपके पास बहुत सारे बटन हो सकते हैं. ऐसे में, @blockly/plugin-typed-variable-modal का इस्तेमाल करें. इससे एक पॉप-अप दिखेगा, जिसमें उपयोगकर्ता अपनी पसंद का वैरिएबल टाइप चुन सकते हैं.
जनरेटर तय करना
आखिर में, आपको वैरिएबल के नए ब्लॉक के लिए, ब्लॉक-कोड जनरेटर तय करने होंगे. वैरिएबल की सूची को सीधे तौर पर Workspace.getVariableMap().getAllVariables() से भी ऐक्सेस किया जा सकता है. इससे सभी टाइप के सभी वैरिएबल मिलते हैं. वहीं, Workspace.getVariableMap().getVariablesOfType() से किसी खास टाइप के सभी वैरिएबल मिलते हैं.