Basics.JavaScript.md

JS

The cornerstone of React Native programming is the Javascript language. Take the time to deep dive into it.

Section Goals

1. Know what is special about JS (compared to other languages)
2. Understand value types and references
3. Understand the scopes, concept of closures
4. Understand async code (timers passing callbacks, promises + async/await)
5. Understand modern (ES6+) JS syntax

Advanced (optional)

This isn't mandatory during onboarding, but we suggest reading the most interesting for you and returning to the next parts lately

Interpreters

Find a convenient JS interpreter so you can run stuff and see what you’re getting.

Here are a couple of recommendations:

• CodePen(supports ES7)
• jsfiddle
• JSPlaygrounds
• Or you can just use the browser Dev tools (Chrome or Firefox, for instance)

The Express Route

Feel like you just need to refresh your knowledge? Or are you a kind of person who likes to dive straight into code and learn on the go?

1. Read the following short guides:
   • A Simple, Comprehensive Overview of Javascript
   • ES6 Guide
2. ES2015+ cheatsheet - Go over it and use it.
3. CodeWars - Achieve code mastery through challenge. Reach 4kyu Rank

The Pro Route

Feel like you want to take it slow? Go through each of the following sections, learn from articles and videos, and practice after every section.

Basics

Learn

• Overview
• Grammar and types
• Control flow and error handling
• Loops and iteration

Now check yourself with Review basics only and if you are familiar with all of it you can switch to the next step

Practice

• Complete at least 10 katas from the following list

Functions

Learn

• MDN - Functions
• What is scope
• Function and Block scopes
• Hoisting
• Closures
• Callback function

Practice

• Complete at least 5 katas from the following list

Object construction

Learn

• Working with objects
• (optional) Videos
• What is this?

Practice

• Complete at least 5 katas from the following list

Async code

Learn

• setTimeout
• Using promises
• Promise.all()
• Video- async / await in JavaScript - What, Why and How - Fun Fun Function

Practice

• Complete the following katas from the following list

ES6 syntax

Learn

• Learn ES6 - EggHead
• (optional) var, let and const - What, why and how - ES6 JavaScript Features
• (optional) Arrow functions in JavaScript - What, Why and How - FunFunFunction
• (optional) Destructuring: What, Why and How - Part 1 of ES6 JavaScript Features

Practice

• ES6 katas (Promise, Array, Class, Destructuring, Template strings, Arrow functions, Block scope, Rest operator, Spread operator, Default parameters)
• (optional) ES5 Quiz
• (optional) ES6 Quiz

Advanced

• Timers
• Promises detailed
• Promises API (any, race, finally, allSettled)
• An Ode to Async-Await
• Memory managment
• Event loop
• Object.create
• WeakMap
• Functional programming in JavaScript (High-order functions, Map, Reduce, Closures)

Links you should probably bookmark

• MDN JS docs
• You Don’t Know JS book
• Fun Fun Function channel on YouTube (@mpj)