Skip to content

Commit 5c648e3

Browse files
committed
Add explanations in docs about JS and global variables
1 parent 13467a9 commit 5c648e3

File tree

1 file changed

+28
-3
lines changed

1 file changed

+28
-3
lines changed

newIDE/docs/Supported-JavaScript-features-and-coding-style.md

+28-3
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
# Supported JavaScript features and coding styles
22

3+
> *tl;dr:* the game engine is a classic "ES5" JavaScript project and needs caution. The editor is a modern, shiny codebase with bundling and latest JavaScript features.
4+
35
## For the game engine (GDJS) and extensions
46

57
Most of the game engine and extensions are written using "classic" JavaScript "ES5" syntax, i.e: using `function` and `var` for declaring functions. "Classes" are declared using `function` for the constructor, and function declared on the `prototype` of the class for methods.
@@ -8,15 +10,32 @@ Most of the game engine and extensions are written using "classic" JavaScript "E
810
911
Hence the recommendation **currently** is to stay with "ES5" syntax and do a *cautious adoption* of new features. If you know that your extension will only be used on evergreen browsers and platforms like Electron, arrow functions and const/let are good practice.
1012

13+
> Android 4.x is supported by GDevelop so we still need to avoid fat arrows functions (`=>`) and `let`/`const`.
14+
1115
In the **future**, we might default to newer JavaScript syntax if supported on most platforms (and potentially run a "codemod" to transform and modernize the whole codebase).
1216

17+
### Can I declare variables in the global scope? (i.e: what about bundling?)
18+
19+
In short: no.
20+
21+
The game engine and extensions don't have any advanced bundling applied using Webpack.
22+
This means that all the JS files from the game engine/extensions are living in the "global scope". Hence, if you writing `var myVariable = 1;` outside of a function, then `myVariable` will be a global variable.
23+
24+
This is problematic because global variables are polluting the global namespace and, worse, can be overriden by other extensions/scripts.
25+
26+
To avoid this:
27+
28+
* Always declare your objects and functions as part of `gdjs`: `gdjs.MyExtension = {};`, `gdjs.MyExtension.someStaticVariableOrFunction`...
29+
* For objects/behaviors, the convention is to attach them to `gdjs` too: `gdjs.MyRuntimeObject`, `gdjs.MyRuntimeBehavior`...
30+
* More generally, don't use `var something = blabla` outside of any function or object.
31+
1332
### What about typing?
1433

1534
> ℹ️ Typing is adding annotation about the type of variables, to enable auto completion and have automatic verification for bugs.
1635
17-
It's recommended to add JSDoc annotation so that the game engine and your extensions can have:
36+
It's recommended to add **[JSDoc annotation](https://jsdoc.app/index.html)** so that the game engine and your extensions can have:
1837
* *documentation* auto-generated
19-
* *auto-completion* provided by **[Typescript]**.
38+
* *auto-completion* provided by **[Typescript](https://www.typescriptlang.org/)**.
2039
* in the **future**, static verification for bugs with **Typescript**.
2140

2241
### What about code formatting?
@@ -30,6 +49,12 @@ The editor sources are processed by Babel, which *transpiles* the JavaScript lat
3049

3150
All source files should use the arrow function (`=>`), `class`, `let`/`const` and anything that makes the codebase more readable, concise and less error prone.
3251

52+
### Can I declare variables in the global scope? (i.e: what about bundling?)
53+
54+
In short: you don't need to worry because all files are bundled.
55+
56+
This is because the editor sources are bundled with Webpack. Anything that you declare is scoped to the file - the only thing available outside are the thing that you expose with `export` and that you `import` something else. The joy!
57+
3358
### What about typing?
3459

3560
The codebase is typed using **[Flow](https://flow.org/)**. It's a powerful typechecker that does not require any recompilation.
@@ -40,4 +65,4 @@ While properly typing can be seen as cumbersome, it's something that is rather q
4065

4166
### What about code formatting?
4267

43-
All the code is auto formatted with Prettier. Install it in your IDE/text editor and never think about formatting again in your life 🎉
68+
All the code is auto formatted with Prettier. Install it in your IDE/text editor and never think about formatting again in your life. The joy! 🎉

0 commit comments

Comments
 (0)