Skip to content

Instantly share code, notes, and snippets.

View amysimmons's full-sized avatar

Amy Simmons amysimmons

View GitHub Profile

Redux

Notes from the Egghead video series [Getting Started With Redux][0]

The whole state of your application is represented as a single JS object called the state or the state tree.The state tree is read only.

To change the state you need to dispatch an action. An action is a plain JS object describing the change in a minimal way. At least, the action should contain a property called type with a string value. For example, when a user clicks a plus button, to update the state tree you might dispatch an action with a type INCREMENT.

// notes from https://egghead.io/lessons/react-redux-implementing-store-from-scratch

const createStore = (reducer) => {
  let state;
  let listeners = []; // keeps track of all the change listeners 
  
  const getState = () => state;
try {
	new Function( "( () => {} )" );
	ARROW_FUNCS_ENABLED = true;
}
catch (err) {
	ARROW_FUNCS_ENABLED = false;
}
const obj = { a: 1 };
const handlers = {
  // declare a get method on the handler object
  get(target, key, context) {
    console.log( "accessing: ", key );
    // forward the operation onto the target (obj) via Reflect.get
    // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect/get
    // target is the object, key is the key being accessed, context is the proxy 
 return Reflect.get(
// REGULAR ARRAY (can have duplicates)

x = []
x.push(1)
x.push(1)
x.length // 2

// SET (cannot have duplicates)
// REGULAR OBJECTS (cannot have non-string keys)

// create empty object x 
x = {}

// create object y 
y = {id: 1}

// attempt to put y into x as the key with a value of 'amy'
// A) Importing named exports  
import { foo, bar, baz } from 'utils';
// B) Importing and renaming a named export
import { foo as fooDelish } from 'utils';
// C) Importing the default export
// 1) NAMED EXPORTS

function helloWorld() {
  //...
}
const name = "Taylor Swift";
const age = 22;

export { helloWorld, name, age }
const X = Symbol.for('test')

const Y = Symbol.for('test')

X === Y
// true
const LOGIN = Symbol("event.login")
// succeeded, as expected 

const W = Symbol("event.login"); 
// I expected this to say something like 'a symbol with this key already exists'

LOGIN === W 
// false