Hello and welcome to This Week in JavaScript, our lovingly curated collection of links relating to what’s new and exciting in the world of JS. The complete list is tagged jsweekly. (Don’t forget to check out our weekly .NET and front end roundups too!)
And now for this week’s JavaScript finds …
Getting started
- What’s the difference between Java and JavaScript? - Some of the key differences that exist in the languages and where each is applicable an attempt to arm you with the information necessary to help you take the next step in your career.
- Let’s learn JavaScript closures - The nuts and bolts of how and why closures work the way they do.
- JavaScript addition operator in details - How to handle types conversion for different operators: addition (+), equality (== and ===), inequality (!= and !==), etc.
- A beginner’s guide to data binding in D3.js - How data is tied to actual elements in the DOM. This is known as “data binding” or “data joins” and it’s a huge deal, because it’s the first step of the entire process.
- The legend of JavaScript equality operator - It may be hard to see how the equality operator works when the operands have different types. Time to time this creates bugs in conditionals, which are difficult to identify.
Learning more
- Timepoint-selection - Key controlled time duration and validation including rollover for form input.
- Refactoring a javascript video store - Refactoring to top level functions, to a nested function with a dispatcher, using classes, and transformation using an intermediate data structure.
- Tic-Tac-Toe.js: Redux pattern in plain JavaScript - Build the Tic-Tac-Toe game using Redux principles with vanilla javascript. No React, no jQuery, no micro-library, nothing else.
- Untangling spaghetti code: How to write maintainable JavaScript - With proper planning, analysis, and a good workflow, it is possible to turn a spaghetti codebase into a clean, organised, and scalable one.
- Hacking the JavaScript lottery - Exploiting a lottery simulator where you start with 100 dollars, by predicting Java’s Math.random().
Libraries
- Inspect form - Form validation in Javascript Vanilla, without dependencies and multiple languages.
- Wait! Animate - Easily insert a delay between each animation iteration.
- 10 jQuery text highlighter plugins - To make the search process faster, offer a great user experience, and generally help users find the content they’re searching for.
ES2015
- Lebab - Lebab helps you modernize your old-fashioned code. It scans your code and finds the parts that can be converted to a newer version of ECMAScript.
Arrow functions in JavaScript - Because of their extreme terseness, arrow functions allows us to use use functions in a new way, making lots of functions that are small, inline and single-purpose. - Six nifty ES6 tricks - Six tricks enabled by new ES6 features.
- Iterators and generators in ES6 - How we can use iterators and generators can be used to create deferred execution in Javascript.
- Arrow functions in JavaScript - what, why and how (video) - Because of their extreme terseness, arrow functions allows us to use use functions in a new way, making lots of functions that are small, inline and single-purpose.
- More readable Javascript without variables - Variables introduce state, which in turn increase complexity exponentially. Every single bit of variable information makes reasoning and understanding the code harder.
Frameworks
- A Timeline for learning React - Don’t approach React by trying to learn ES6 + Webpack + Babel + React + Redux + Routing + AJAX all at once. Take these one step at a time. Do not skip ahead. One foot in front of the other.
- Model-View-Controller (MVC) explained through ordering drinks at the bar - The MVC pattern in modern web development can be easily explained by ordering a drink from a bartender. And yes, that means if you have been to a bar, then you can understand the major structural pattern shared by all web apps.
- Higher-order components: theory and practice - Everything you see on a screen is essentially a component. Components are composed of other components, making complex interfaces possible.
- Don’t blame the framework - My experience with AngularJS and ReactJS.
- Exploring Rx operators: map - Exploring reactive extensions for JavaScript (RxJS) and their practical applications, starting here with map.
- Angular 2 providers using map literals - Providers using map literals is a new way of defining providers that landed just recently in the code base.
Testing & Debugging
- What the heck is “Script error”? - What browsers send to the onerror callback when an error originates from a JavaScript file served from a different origin
- How to stub ES2015 modules in tests - How to stub out dependencies on ES2015 modules to make testing easier. Note this only works with dependencies on named exports.
- TDD Should be fun - When it is working at its best, practicing TDD feels like playing a computer game. One that takes some thought and planning to win.
For more links like this and to keep up-to-date with the latest goings on in JS land, you can follow SitePoint’s JavaScript channel on Twitter.
Please PM us if you have anything of interest for the next issue or if there is anything you would like to see featured. Paul and chrisofarabia.
