JavaScript in 10 Days: Day 3
Today’s plan is to make more progress on Atencio.
Setting up eslint
To get eslint
to work with flycheck
in emacs, I needed a few more steps.
Install eslint
globally: npm install -g eslint
.
At first emacs threw cryptic errors, and it turned out that eslint
was the source. To use the JoJ .eslintrc
file, run eslint
on a sample file and install the necessary dependenceis from the .eslintrc
file based on the errors. For me, it was:
npm install --save-dev babel-eslint
npm install eslint-plugin-flowtype@latest --save-dev
vnpm install eslint-plugin-fp@latest --save-dev
Then, disable js2-mode
checkers and use eslint
with flycheck
instead:
(setq js2-mode-show-parse-errors nil)
(setq js2-mode-show-strict-warnings nil)
(add-hook 'js2-mode-hook
#'js2-imenu-extras-mode)
(add-hook 'js2-mode-hook
(defun my-js2-mode-setup ()
(flycheck-mode t)
(when (executable-find "eslint")
(flycheck-select-checker 'javascript-eslint))))
See the updated elisp config file.
Interestingly, esiint
often shows one or two errors when I copy-paste Atencio’s code, but none of them cause Babel compilation or runtime issues, and I don’t know nearly enough JS to opine further.
Day 3 Talks / Articles
The first video that came up when searching for Kyle Simpson was “Mo’Problems Mo’Nads – City JS Conf 2020” (maybe because of my search history on mondads..?)
A decent talk, but there are probably better articulartions of the motivation for using monads. I remember this post was useful for talking about intro to monads with JavaScript folks.
JoJ
Chapter 3 Linked, compositional object models
“Objects Linked to Other Objects” (OLOO)
- Using
Object.create()
and aninit()
function to encapsulate private state - Clear management of the object context up the chain of objects
- No boilerplate code as with classes or constructor functions
Object.assign()
- for existing properties, uses [[Set]] (so an object setter
set
can be used); for new properites, uses the [[DefineOwnProperty]] internal process - can use defaults for unspecified fields
Assembling objects using mixin composition
- Assiging with multiple objects (potentially using the spread operator for syntax)
- Each mixin should be self-contained and simple, to be composed together with other such objects
- aka “dynamic concatenation”
- with classes, Object.assing() extends the class’s prototype dynamically
- Object.assign() has LIFO precedence (right-most first), avoiding ambiguity / resolution conflicts if there are multiple implemnetations in the mixins
- Note - mixins bind tightly to the public interface, and the shape of the join is not very obvious
JoJ Code
I mostly copy-pasted JoJ code into files, looked at the eslint
errors if present, and added some console.log
s to get some output.
Note that the day3/src/txn2.js
file is incomplete and won’t compile with npx babel
.
Other Code
Building on yesterday’s fold
, here is flatten
implemented with foldR
(a fairly expensive operation with this implementation):
function toArrayHelper<T>(xs: ConsList<T>, arr: Array<T>): Array<T> {
if (xs === null) {
return arr;
}
else {
let [h, t] = xs
arr.push(h);
return toArrayHelper(t, arr);
}
}
function concat<T>(xs: ConsList<T>, ys: ConsList<T>): ConsList<T> {
if (xs === null) {
return ys;
}
else {
let [h, t] = xs
return cons(h, concat(t, ys));
}
}
function flatten<T>(xss: ConsList<ConsList<T>>): ConsList<T> {
return foldR((a, b) => concat(a, b), empty as ConsList<T>, xss);
}
Testing the result with xs, ys, zs
as inputs [1,2,3], [4,5,6], [7,8,9]
…
const nested = fromArray([xs, ys, zs]) as ConsList<ConsList<number>>;
console.log('Flatten |> toArray', toArray(flatten(nested)));
The result looks good:
% tsc && node fold.js
Flatten |> toArray [ 1, 2, 3, 4, 5, 6, 7, 8, 9 ]
Wrapping Up
Atencio’s book is one of the better programming books I’ve read, insofar as (1) all the code I’ve tried so far works (2) there is the right amonut of detail, with links to further reading (3) there is a story and motivating example that runs throughout.
I’d probably get more out of it if I knew a bit more JavaScript, but it’s still digestible (and the motivating example happens to be something I’ve worked on recently – a toy blockchain implementation).
If anything is missing, maybe it’s exercises or further questions for readers to ponder, but that may be more of a stylistic choice (i.e. it’s just not that kind of a book).
Todo / To Read
- builder pattern
- More chapters of Atencio
- Eloquent JavaScript has exercises at the end of chapters, which might be worth exploring
- Figure out how to use
outDir
(?) to compile.js
files to separate subdirectory - Compiling with both TypeScript with Babel
- Kyle Simpson, You Don’t Know JS
- Composing Software, by Eric Elliot (https:// leanpub.com/composingsoftware)