This is a pretty good demonstration of the pattern. I will say that in practice, I would prefer to simply use bare object syntax over the use of new with constructor functions. When I do use constructors, I'd now prefer the class syntax.
class Employee {
constructor(type, name) {
this.type = type;
this.name = name;
}
}
class Developer extends Employee {
constructor(name) {
base("Developer", name);
}
}
class Tester extends Employee {
constructor(name) {
base("Developer", name);
}
}
class EmployeeFactory {
static types = [
Developer,
Tester,
}
create(type, name, ...options) {
const TypedEmployee = EmployeeFactory.types[type];
return TypedEmployee && new TypedEmployee(name, ...options);
}
}
I did put type before name above, as imho it should be first as this will work better with a spread operator.
The size of this library could be problematic... I'm unsure of the dependency on @babel/core as this should not be relying on that level of translation for a shared component library.
I'm not the one who down-voted, all the same, still would be cautious in its' use. Would be better to publish the mjs modules directly instead of translating, or only transforming those specific features needed for this module in its' output.
It is also missing a LICENSE file in the project, even though MIT is marked in the package.json.
missing `label > input[type=checkbox] + span` and related for styling checkbox and radio input... by practice, I will wrap them in a label, and separate the text for the label next to the input element.
<label>
<input type="checkbox ...>
<span>text</span>
</label>
This way you can use the checked, etc and hide the input control and insert a custom graphic or character before the span to stylize the control itself and the text, where the label wrapping will capture mouse clicks or spacebar activation and toggle the input itself.
If you are dealing with a security focused implementation, there's also sessionStorage which has pretty much the same interface, but limited to a single tab/window. I use this for development in syncing/storing redux state, so that it can refresh the screen and keep the same redux state.
It also helps if you need to be able to impersonate other users in another tab, etc. You can pass an initial key/token when opening a new windows.
Niggle: this output is *NOT* JSON. JSON is a string, it's always a string that represents a primitive value, array or object structure in JavaScript notation.
What you have is an RSS parser for JavaScript.
Double negation coerces any value in JS to a Boolean of true or false.
It is important to know that there are seven values that evaluate as false in an evaluation context, these "falsy" values are as follows:
1. false
2. 0
3. -0
4. NaN
5. null
6. undefined
7. "" // empty string
Every other value is truthy.
Knowing this can clean up and cut down a lot of code. Personally it irks me to no end when I see something like...
if (v === null || v === undefined ...) return null;
Which can be more easily evaluated as `(!v)` first... sometimes you'll want to allow 0 `(!v && v !== 0)`
This is a pretty good demonstration of the pattern. I will say that in practice, I would prefer to simply use bare object syntax over the use of new with constructor functions. When I do use constructors, I'd now prefer the class syntax. class Employee { constructor(type, name) { this.type = type; this.name = name; } } class Developer extends Employee { constructor(name) { base("Developer", name); } } class Tester extends Employee { constructor(name) { base("Developer", name); } } class EmployeeFactory { static types = [ Developer, Tester, } create(type, name, ...options) { const TypedEmployee = EmployeeFactory.types[type]; return TypedEmployee && new TypedEmployee(name, ...options); } } I did put type before name above, as imho it should be first as this will work better with a spread operator.missing `label > input[type=checkbox] + span` and related for styling checkbox and radio input... by practice, I will wrap them in a label, and separate the text for the label next to the input element. <label> <input type="checkbox ...> <span>text</span> </label> This way you can use the checked, etc and hide the input control and insert a custom graphic or character before the span to stylize the control itself and the text, where the label wrapping will capture mouse clicks or spacebar activation and toggle the input itself.Double negation coerces any value in JS to a Boolean of true or false. It is important to know that there are seven values that evaluate as false in an evaluation context, these "falsy" values are as follows: 1. false 2. 0 3. -0 4. NaN 5. null 6. undefined 7. "" // empty string Every other value is truthy. Knowing this can clean up and cut down a lot of code. Personally it irks me to no end when I see something like... if (v === null || v === undefined ...) return null; Which can be more easily evaluated as `(!v)` first... sometimes you'll want to allow 0 `(!v && v !== 0)`