Understand JS to Understand React

- Vilva Athiban P B


About Me

- Work @ Omio

- OSS is

- Creator of styled-wind, hql-tag, etc

- Building query-library, OSSPuppy

- All Social Platforms: Vilva Athiban

Lets Begin

React "JS"

Why learning React without JavaScript is a bad thing?

Closures & Currying


A closure gives you access to an outer function’s scope from an inner function, even after the outer function goes out of scope

const outerScopeFn = () => {
  const greeting = "Hello"

  return (name) => {
    console.log(`${greeting} ${name}, Inner Scope`);

const innerScopeFn = outerScopeFn()

console.log(innerScopeFn("Vilva")) // Hello Vilva, Inner Scope


Currying is a technique of evaluating function with multiple arguments, into sequence of function with single argument


Stale Closure

function createIncrement(step) {
  let value = 0;

  function increment() {
    value += step;

  const message = `Current value is ${value}`;
  function print() {
  return [increment, print];

const [increment, print] = createIncrement(1);
increment(); // logs 1
increment(); // logs 2
increment(); // logs 3
// Does not work!
log(); // Current value is 0

Lets See some Code

Thank You


Understand JS to Understand React

By Vilva Athiban

Understand JS to Understand React

  • 173