You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
আগের অধ্যায়ে আমরা ইমপোর্ট এবং এক্সপোর্ট নিয়ে আলোচনা করেছি যাদের "static" বলা হয়। যার সিনট্যাক্স খুবই সাধারন।
3
+
Export and import statements that we covered in previous chapters are called "static". The syntax is very simple and strict.
4
4
5
-
প্রথমত, `import` এর কোন প্যারামিটার ডাইনামিক ভাবে আমরা জেনারেট করতে পারি না।
5
+
First, we can't dynamically generate any parameters of `import`.
6
6
7
-
মডিউলের পাথ অবশ্যই প্রিমিটিভ স্ট্রিং হতে হবে, ফাংশন কল হওয়া যাবে না। এটি কাজ করবে নাঃ
7
+
The module path must be a primitive string, can't be a function call. This won't work:
8
8
9
9
```js
10
-
import ... from*!*getModuleName()*/!*; //এরর, শুধুমাত্র "string" প্রযোজ্য
10
+
import ... from*!*getModuleName()*/!*; //Error, only from "string" is allowed
11
11
```
12
12
13
-
দ্বিতীয়ত, আমরা কন্ডিশনালি অথবা রান-টাইমে ইমপোর্ট করতে পারবো না।
13
+
Second, we can't import conditionally or at run-time:
14
14
15
15
```js
16
16
if(...) {
17
-
import ...; //এরর, এটি প্রযোজ্য নয়।
17
+
import ...; //Error, not allowed!
18
18
}
19
19
20
20
{
21
-
import ...; //এরর, আমারা কোন ব্লকের মধ্যে ইমপোর্ট রাখতে পারি না।
21
+
import ...; //Error, we can't put import in any block
22
22
}
23
23
```
24
24
25
-
তার কারন`import`/`export`এর উদ্দেশ্য হচ্ছে কোডের গঠনে মেরুদন্ডের ন্যায় কাজ করা। এটি একটি ভালো দিক, কোডের গঠন বিশ্লেষণ করে দেখা যায়, একটি বিশেষ টুলের দ্বারা মডিউল গুলোকে ফাইলে একসাথে রাখা যায়, অব্যবহৃত এক্সপোর্ট গুলো রিমুভ("tree-shaken") করা যায়. `imports/exports` এর সাধারন গঠনের কারনেই এটি সম্ভব হয়।
25
+
That's because`import`/`export`aim to provide a backbone for the code structure. That's a good thing, as code structure can be analyzed, modules can be gathered and bundled into one file by special tools, unused exports can be removed ("tree-shaken"). That's possible only because the structure of imports/exports is simple and fixed.
26
26
27
-
কিন্তু, প্রয়োজনে একটি মডিউলকে কিভাবে আমরা ডাইনামিকালি ইমপোর্ট করতে পারি?
27
+
But how can we import a module dynamically, on-demand?
28
28
29
-
## import() এক্সপ্রেশন
29
+
## The import() expression
30
30
31
-
`import(module)` এক্সপ্রেশনটি মডিউলকে লোড করে এবং একটি প্রমিস রিটার্ন করে যা একটি মডিউল অবজেক্টের মধ্যে রিসল্ভ হয়ে থাকে এবং এতে সমস্ত এক্সপোর্ট গুলো থাকে।
32
-
33
-
আমরা কোডের যে কোন জায়গায় এটি ডাইনামিকালি ব্যবহার করতে পারি, যেমনঃ
31
+
The `import(module)` expression loads the module and returns a promise that resolves into a module object that contains all its exports. It can be called from any place in the code.
34
32
33
+
We can use it dynamically in any place of the code, for instance:
35
34
36
35
```js
37
-
let modulePath =prompt("কোন মডিউলটি লোড করতে চান?");
36
+
let modulePath =prompt("Which module to load?");
38
37
39
38
import(modulePath)
40
39
.then(obj=><module object>)
41
-
.catch(err=><loading এরর, যদি কোন মডিউল না থাকে>)
40
+
.catch(err=><loading error, e.g. if no such module>)
42
41
```
43
42
44
-
অথবা, যদি এটি একটি `async` ফাংশনের ভিতর হয়ে থাকে তবে `let module = await import(modulePath)`ব্যবহার করতে পারি।
43
+
Or, we could use `let module = await import(modulePath)`if inside an async function.
45
44
46
-
যেমন, আমাদের যদি নিম্নলিখিত মডিউল থাকে `say.js`:
45
+
For instance, if we have the following module `say.js`:
47
46
48
47
```js
49
48
// 📁 say.js
@@ -56,7 +55,7 @@ export function bye() {
56
55
}
57
56
```
58
57
59
-
...তবে ডাইনামিক ইমপোর্টটি হতে পারেঃ
58
+
...Then dynamic import can be like this:
60
59
61
60
```js
62
61
let {hi, bye} =awaitimport('./say.js');
@@ -65,35 +64,35 @@ hi();
65
64
bye();
66
65
```
67
66
68
-
অথবা, যদি`say.js`এর ডিফল্ট এক্সপোর্ট থাকেঃ
67
+
Or, if`say.js`has the default export:
69
68
70
69
```js
71
70
// 📁 say.js
72
71
exportdefaultfunction() {
73
-
alert("মডিউল লোড হয়েছে (export default)!");
72
+
alert("Module loaded (export default)!");
74
73
}
75
74
```
76
75
77
-
...তারপর এটাকে এক্সেস করার জন্য আমরা মডিউল অব্জেক্টের `default`প্রপার্টি ব্যাবহার করতে পারি।
76
+
...Then, in order to access it, we can use `default`property of the module object:
78
77
79
78
```js
80
79
let obj =awaitimport('./say.js');
81
80
let say =obj.default;
82
-
//অথাবা, এক লাইনে: let {default: say} = await import('./say.js');
81
+
//or, in one line: let {default: say} = await import('./say.js');
83
82
84
83
say();
85
84
```
86
85
87
-
এখানে সম্পূর্ণ উদাহারনটি রয়েছেঃ
86
+
Here's the full example:
88
87
89
88
[codetabs src="say" current="index.html"]
90
89
91
90
```smart
92
-
রেগুলার স্ক্রিপ্টে ডাইনামিক ইমপোর্ট কাজ করে, তার জন্য `script type="module" প্রয়োজন হয় না।
91
+
Dynamic imports work in regular scripts, they don't require `script type="module"`.
93
92
```
94
93
95
94
```smart
96
-
যদিও `import()` দেখতে ফাংশন কলের মতো, কিন্তু এটি একটি (`super()` মতো) বিশেষ সিন্টেক্স যার জন্য "parentheses" ব্যবহার করতে হয়।
95
+
Although `import()` looks like a function call, it's a special syntax that just happens to use parentheses (similar to `super()`).
97
96
98
-
তাই আমারা `import` কে কোন ভেরিয়েবলে কপি অথবা `call/apply` করা যায় না।
97
+
So we can't copy `import` to a variable or use `call/apply` with it. That's not a function.
0 commit comments