Skip to content

Instantly share code, notes, and snippets.

  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save nishantmendiratta/5643da708855cf288ad6e3bcdde5a640 to your computer and use it in GitHub Desktop.
JavaScript: Understanding the Weird Parts in 35ish minutes - #BIGWORDS

Single Threaded

  • One command at a time (under the hood of browser maybe not)

Synchronous

  • One at a time and in order.

Invocation

  • Calling a function in js by using parentheses ()

Variable environment

  • Where the variables live and how they relate to each other in memory.

Scope

  • It’s where a variable is available in your code. It could be a new variable or a new copy

Asynchronous Callbacks

Asynchronous - More than one at a time

  • Rendering engine <-> The javascript engine <-> HTTP request
  • It happens asynchronously inside the browser but synchronously inside the javascript engine.
  • How does this happen inside the javascript v8 engine?
  • There is an execution stack and event queue like click event and the HTTP request is placed in the queue. The event queue is looked at by javascript when the execution stack is empty
  • Once the execution stack is empty then js periodically looks at the event queue and waits for something to be there and check if this function to execute once the event was triggered
  • So it sees click event it processes clickHandler() and creates the execution context for that function once that function is processed next item in the queue moves up. It will not get processed until the execution stack is empty.
  • It’s not asynchronous actually, the browser is putting things in queue asynchronously but the code is running line by line and when execution context is empty it processes the event in the queue.

Dynamic Typing

  • You don’t tell the engine what type of data a variable holds, it figures it out while your code is running. Variables can hold different types of values because it’s all figured out during execution.

Operators

  • A special function that is syntactically (written) differently, Generally operators take 2 params and return the result.

Operator precedence

  • Which function gets called first. Functions are called in order of precedence (Higher precedence wins)

Associativity

  • What order operator functions get called in: Left to right or right to left (When functions have the same precedence)

Coercion

  • Converting a value from one type to another. This happens quite often in javascript because it’s dynamically typed.

First Class Function (FCF)

  • Everything you can do with other types you can do with functions. Assign them to variables, pass them around, create them on the fly. Functions reside in memory
  • It’s a special type of object because it has all the features of the normal object as well as some special properties
  • We can attach primitive, objects, functions to a function. Two special properties of functions are
  • Name - optional, can be anonymous
  • Code - The actual lines of code you have written is set in this property. The code you write is one of the properties you are adding to it. This property is invocable.

Expression

  • A unit of code that results in a value, It doesn’t have to save to a variable

Mutate

  • To change something “immutable can’t be changed”

Arguments

  • The parameters you pass to a function, JavaScript gives you a keyword contains a list of all the values of all the parameters that you pass to a function.

Closures

  • A closure is an inner function that has access to the outer (enclosing) function’s variables—scope chain. The closure has three scope chains: it has access to its own scope (variables defined between its curly brackets), it has access to the outer function’s variables, and it has access to the global variables. The inner function has access not only to the outer function’s variables but also to the outer function’s parameters. Note that the inner function cannot call the outer function’s 'arguments' object, however, even though it can call the outer function’s parameters directly.
function greet(whattosay){
	return function(name){
	console.log(whattosay + ‘ ’ + name);
   }
}
//We are invoking a function that returns a function so that we can invoke the returned function
greet(‘Hi’)(‘Tony’); // OUTPUT : Hi Tony

Whitespace

  • Invisible characters that create literal ‘space’ in your written code, Carriage returns, tabs, spaces

Callback function

  • A function you give to another function, to be run when the other function is finished. So the function you call (ie invoke) ‘call back’ by calling the function you gave it when it finishes.

Currying

  • Creating a copy of the function with some preset parameters - Very useful in mathematical situations
var multipyByTwo = multipy.bind(this,2)
multipyByTwo(3); // OUTPUT - 6

Inheritance

  • One object gets access to the properties and methods of another object
  • Classical Inheritance
    • Verbose (Very large)
    • Keywords like a friend, protected, private, interface, etc
  • Prototypal Inheritance
    • Simple
    • Flexible
    • Extensible
    • Easy to understand

Reflection

  • An object can look at itself, listing and changing its properties and methods. It can be used to create a very useful pattern extend.

Polyfill

  • Code that adds a feature that an engine may lack.

Syntactic Sugar

  • A different way to Type something that doesn’t change how it works under the hood.

Credits
Prerequisite
  • Javascript Basics
  • Willingness to learn
  • 35 min
Subscribe

If you want a gist of the actual document, subscribe to the newsletter.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment