@@ -14,8 +14,8 @@ quote}}
14
14
15
15
{{index organization, "code structure"}}
16
16
17
- The ideal program has a crystal clear structure. It's easy to explain
18
- how it works , and each part plays a well-defined role.
17
+ The ideal program has a crystal clear structure. The way it works is
18
+ easy to explain , and each part plays a well-defined role.
19
19
20
20
{{index "organic growth"}}
21
21
@@ -47,22 +47,22 @@ dirty.
47
47
48
48
_ Modules_ are an attempt to avoid these problems. A ((module)) is a
49
49
piece of program that specifies which other pieces it relies on (its
50
- _ dependencies_ ), and which functionality it provides for other modules
50
+ _ dependencies_ ) and which functionality it provides for other modules
51
51
to use (its _ ((interface))_ ).
52
52
53
53
{{index "big ball of mud"}}
54
54
55
55
Module interfaces have a lot in common with object interfaces, as we
56
56
saw them in [ Chapter ?] ( object#interface ) . They make part of the
57
- module available to the outside world, and keep the rest private. By
57
+ module available to the outside world and keep the rest private. By
58
58
restricting the ways in which modules interact with each other, the
59
- system becomes more like ((Lego )), where pieces interact through
59
+ system becomes more like ((LEGO )), where pieces interact through
60
60
well-defined connectors, and less like mud, where everything mixes
61
61
with everything.
62
62
63
63
{{index dependency}}
64
64
65
- The relations between modules are called dependencies . When a module
65
+ The relations between modules are called _ dependencies _ . When a module
66
66
needs a piece from another module, it is said to depend on that
67
67
module. When this fact is clearly specified in the module itself, it
68
68
can be used to figure out which other modules need to be present to be
@@ -97,9 +97,9 @@ might be able to apply the same piece in different programs.
97
97
98
98
But how do you set this up? Say I want to use the ` parseINI ` function
99
99
from [ Chapter ?] ( regexp#ini ) in another program. If it is clear what
100
- it depends on (in this case, nothing), I can just copy all the
101
- necessary code into my new project, and use it. But then, if I find a
102
- mistake in that code, I'll probably fix it in whichever program that
100
+ the function depends on (in this case, nothing), I can just copy all the
101
+ necessary code into my new project and use it. But then, if I find a
102
+ mistake in that code, I'll probably fix it in whichever program
103
103
I'm working with at the time and forget to also fix it in the other
104
104
program.
105
105
@@ -141,8 +141,10 @@ can be found on there. For example, an INI file parser, similar to the
141
141
one we built in [ Chapter ?] ( regexp ) , is available under the package
142
142
name ` ini ` .
143
143
144
+ {{index "command line"}}
145
+
144
146
[ Chapter ?] ( node ) will show how to install such packages locally using
145
- the ` npm ` (( command line)) program.
147
+ the ` npm ` command- line program.
146
148
147
149
Having quality packages available for download is extremely valuable.
148
150
It means that we can often avoid reinventing a program that a hundred
@@ -207,9 +209,9 @@ console.log(weekDay.name(weekDay.number("Sunday")));
207
209
208
210
This style of modules provides ((isolation)), to a certain degree, but
209
211
it does not declare dependencies. Instead, it just puts its
210
- ((interface)) into the ((global scope)), and expects its dependencies,
212
+ ((interface)) into the ((global scope)) and expects its dependencies,
211
213
if any, to do the same. For a long time this was the main approach
212
- used in web programming, but is mostly obsolete now.
214
+ used in web programming, but it is mostly obsolete now.
213
215
214
216
If we want to make dependency relations part of the code, we'll have
215
217
to take control of loading dependencies. Doing that requires being
@@ -257,7 +259,7 @@ console.log(plusOne(4));
257
259
```
258
260
259
261
This is precisely what we need for a module system. We can wrap the
260
- module's code in a function, and use that function's scope as module
262
+ module's code in a function and use that function's scope as module
261
263
((scope)).
262
264
263
265
## CommonJS
@@ -279,7 +281,7 @@ the module is loaded and returns its ((interface)).
279
281
{{index "exports object"}}
280
282
281
283
Because the loader wraps the module code in a function, modules
282
- automatically get their own local scope. The only thing they have to
284
+ automatically get their own local scope. All they have to
283
285
do is call ` require ` to access their dependencies, and put their
284
286
interface in the object bound to ` exports ` .
285
287
@@ -310,7 +312,7 @@ exports.formatDate = function(date, format) {
310
312
if (tag == "dddd") return days[date.getDay()];
311
313
});
312
314
};
313
- ````
315
+ ```
314
316
315
317
{{index "destructuring binding"}}
316
318
@@ -381,10 +383,10 @@ available in the module's ((scope)).
381
383
382
384
{{index resolution, "relative path"}}
383
385
384
- The way the string given to ` require ` is translated to an actual file
385
- name or web address differs in different systems. When it starts with
386
+ The way the string given to ` require ` is translated to an actual
387
+ filename or web address differs in different systems. When it starts with
386
388
` "./" ` or ` "../" ` , it is generally interpreted as relative to the
387
- current module's file name . So ` "./format-date" ` would be the file
389
+ current module's filename . So ` "./format-date" ` would be the file
388
390
named ` format-date.js ` in the same directory.
389
391
390
392
When the name isn't relative, Node.js will look for an installed
@@ -408,7 +410,7 @@ console.log(parse("x = 10\ny = 20"));
408
410
409
411
## ECMAScript modules
410
412
411
- ((CommonJS modules)) work quite well, and in combination with NPM they
413
+ ((CommonJS modules)) work quite well and, in combination with NPM,
412
414
have allowed the JavaScript community to start sharing code on a large
413
415
scale.
414
416
@@ -446,7 +448,7 @@ appear in front of a function, class, or binding definition (`let`,
446
448
` const ` , or ` var ` ).
447
449
448
450
An ES module's interface is not a single value, but a set of named
449
- ((binding))s. The above module binds ` formatDate ` to a function. When
451
+ ((binding))s. The preceding module binds ` formatDate ` to a function. When
450
452
you import from another module, you import the _ binding_ , not the
451
453
value, which means an exporting module may change the value of the
452
454
binding at any time, and the modules that import it will see its new
@@ -477,13 +479,13 @@ console.log(dayNames.length);
477
479
```
478
480
479
481
At the time of writing, the JavaScript community is in the process of
480
- adopting this module style. But this has been a slow process. It took
482
+ adopting this module style. But it has been a slow process. It took
481
483
a few years, after the format was specified, for browsers and Node.js
482
484
to start supporting it. And though they mostly support it now, this
483
485
support still has issues, and the discussion on how such modules
484
486
should be distributed through ((NPM)) is still ongoing.
485
487
486
- Many projects are written using ES modules, and then automatically
488
+ Many projects are written using ES modules and then automatically
487
489
converted to some other format when published. We are in a
488
490
transitional period in which two different module systems are used
489
491
side-by-side, and it is useful to be able to read and write code in
@@ -502,14 +504,14 @@ JavaScript.
502
504
503
505
To make this possible, they _ compile_ their code, translating it from
504
506
their chosen JavaScript dialect to plain old JavaScript—or even to a
505
- past version of JavaScript so that old ((browsers)) can run it.
507
+ past version of JavaScript— so that old ((browsers)) can run it.
506
508
507
509
{{index latency, performance}}
508
510
509
- Including a modular program that consists of two hundred different
511
+ Including a modular program that consists of 200 different
510
512
files in a ((web page)) produces its own problems. If fetching a
511
513
single ((file)) over the ((network)) takes 50 milliseconds, loading
512
- the whole program takes ten seconds, or maybe half that if you can
514
+ the whole program takes 10 seconds, or maybe half that if you can
513
515
load several files simultaneously. That's a lot of wasted time.
514
516
Because fetching a single big file tends to be faster than fetching a
515
517
lot of tiny ones, web programmers have started using tools that roll
@@ -544,7 +546,7 @@ Structuring programs is one of the subtler aspects of programming. Any
544
546
nontrivial piece of functionality can be modeled in various ways.
545
547
546
548
Good program design is subjective—there are trade-offs involved, and
547
- matters of taste. The best way to learn the value of well structured
549
+ matters of taste. The best way to learn the value of well- structured
548
550
design is to read or work on a lot of programs and notice what works
549
551
and what doesn't. Don't assume that a painful mess is "just the way it
550
552
is". You can improve the structure of almost everything by putting
@@ -569,7 +571,7 @@ you're likely to remember how to use it.
569
571
570
572
Even if there's no standard function or widely used package to
571
573
imitate, you can keep your modules predictable by using simple ((data
572
- structure))s and doing a single, focused thing. Many of the INI file
574
+ structure))s and doing a single, focused thing. Many of the INI- file
573
575
parsing modules on NPM provide a function that directly reads such a
574
576
file from the hard disk and parses it, for example. This makes it
575
577
impossible to use such modules in the browser, where we don't have
@@ -579,7 +581,7 @@ function.
579
581
580
582
{{index "pure function"}}
581
583
582
- Which points at another helpful aspect of module design—the ease with
584
+ Which points to another helpful aspect of module design—the ease with
583
585
which something can be composed with other code. Focused modules that
584
586
compute values are applicable in a wider range of programs than bigger
585
587
modules that perform complicated actions with side effects. An INI
@@ -611,8 +613,8 @@ An example of a slightly more complex data structure is the graph from
611
613
properties hold arrays of strings—the other nodes reachable from that
612
614
node.
613
615
614
- There are several different path-finding packages on ((NPM)), but none
615
- of them use this graph format. They usually allow the graph's edges to
616
+ There are several different pathfinding packages on ((NPM)), but none
617
+ of them uses this graph format. They usually allow the graph's edges to
616
618
have a weight, the cost or distance associated with it, which isn't
617
619
possible in our representation.
618
620
@@ -645,9 +647,9 @@ console.log(find_path(graph, "Post Office", "Cabin"));
645
647
```
646
648
647
649
This can be a barrier to composition—when various packages are using
648
- different data structures to describe similar things, it is difficult
649
- to combine them . Therefore, if you want to design for composability,
650
- find out what ((data structure))s other people are using, and when
650
+ different data structures to describe similar things, combining them
651
+ is difficult . Therefore, if you want to design for composability,
652
+ find out what ((data structure))s other people are using and, when
651
653
possible, follow their example.
652
654
653
655
## Summary
@@ -658,7 +660,7 @@ the part of the module that's visible from other modules, and the
658
660
dependencies are the other modules that it makes use of.
659
661
660
662
Because JavaScript historically did not provide a module system, the
661
- CommonJS system was built on top of it. But at some point it _ did_ get
663
+ CommonJS system was built on top of it. Then at some point it _ did_ get
662
664
a built-in system, which now coexists uneasily with the CommonJS
663
665
system.
664
666
@@ -696,7 +698,7 @@ would you create? Which module would depend on which other module, and
696
698
what would their interfaces look like?
697
699
698
700
Which pieces are likely to be available pre-written on NPM? Would you
699
- prefer to use an NPM package or to write them yourself?
701
+ prefer to use an NPM package or write them yourself?
700
702
701
703
{{hint
702
704
@@ -708,7 +710,7 @@ way to design a given module):
708
710
{{index "dijkstrajs package"}}
709
711
710
712
The code used to build the road graph lives in the ` graph ` module.
711
- Because I'd rather use ` dijkstrajs ` from NPM than our own path-finding
713
+ Because I'd rather use ` dijkstrajs ` from NPM than our own pathfinding
712
714
code, we'll make this build the kind of graph data that ` dijkstajs `
713
715
expects. This module exports a single function, ` buildGraph ` . I'd have
714
716
` buildGraph ` accept an array of two-element arrays, rather than
@@ -726,7 +728,7 @@ the `./roads` module, because it needs to be able to verify that a
726
728
given road exists. It also needs ` randomPick ` . Since that is a
727
729
three-line function, we could just put it into the ` state ` module as
728
730
an internal helper function. But ` randomRobot ` needs it too. So we'd
729
- have to either duplicate it, or put it into its own module. Since this
731
+ have to either duplicate it or put it into its own module. Since this
730
732
function happens to exist on NPM in the ` random-item ` package, a good
731
733
solution is to just make both modules depend on that. We can add the
732
734
` runRobot ` function to this module as well, since it's small and
@@ -745,7 +747,7 @@ be read on its own. Dividing code into modules also often suggests
745
747
further improvements to the program's design. In this case, it seems a
746
748
little odd that the ` VillageState ` and the robots depend on a specific
747
749
road graph. It might be a better idea to make the graph an argument to
748
- the state's constructor and to make the robots read it from the state
750
+ the state's constructor and make the robots read it from the state
749
751
object—this reduces dependencies (which is always good) and makes it
750
752
possible to run simulations on different maps (which is even better).
751
753
@@ -758,7 +760,7 @@ does tend to clutter your modules.
758
760
759
761
However, you should also not underestimate the work involved in
760
762
_ finding_ an appropriate NPM package. And even if you find one, it
761
- might not work well, or be missing some feature that you need. On top
763
+ might not work well or may be missing some feature you need. On top
762
764
of that, depending on NPM packages means you have to make sure they
763
765
are installed, you have to distribute them with your program, and you
764
766
might have to periodically upgrade them.
@@ -773,7 +775,7 @@ hint}}
773
775
{{index "roads module (exercise)"}}
774
776
775
777
Write a ((CommonJS module)), based on the example from [ Chapter
776
- ?] ( robot ) , which contains the array of roads and exports the graph
778
+ ?] ( robot ) , that contains the array of roads and exports the graph
777
779
data structure representing them as ` roadGraph ` . It should depend on a
778
780
module ` ./graph ` , which exports a function ` buildGraph ` that is used
779
781
to build the graph. This function expects an array of two-element
@@ -829,8 +831,8 @@ don't access each other's interface until after they finish loading,
829
831
cyclic dependencies are okay.
830
832
831
833
The ` require ` function given [ earlier in this
832
- chapter] ( modules#require ) supports this type of dependency cycles . Can
833
- you see how it handles them ? What would go wrong when a module in a
834
+ chapter] ( modules#require ) supports this type of dependency cycle . Can
835
+ you see how it handles cycles ? What would go wrong when a module in a
834
836
cycle _ does_ replace its default ` exports ` object?
835
837
836
838
{{hint
0 commit comments