Skip to content

Instantly share code, notes, and snippets.

@getify
getify / 1.md
Last active January 17, 2020 16:35
A question about JS parameter scopes, and closures over them vs function scopes

I received a question about this snippet of code:

function def(first="oldValue" , second=function(){
         return first;
}){
        var first="updatedValue";
        console.log('inside',first);
        console.log('function',second());
}

Thanks everyone for participating in the quiz!
Many of you have posted correct answers.

What we know:

A top-level App component returns <Button /> from its render() method.

Question:

>What is the relationship between `` and this in that `Button`’s `render()`?

In JavaScript, all binding declarations are instantiated when control flow enters the scope in which they appear. Legacy var and function declarations allow access to those bindings before the actual declaration, with a "value" of undefined. That legacy behavior is known as "hoisting". let and const binding declarations are also instantiated when control flow enters the scope in which they appear, with access prevented until the actual declaration is reached; this is called the Temporal Dead Zone. The TDZ exists to prevent the sort of bugs that legacy hoisting can create.

@JWally
JWally / ExampleFileMD5.js
Last active July 17, 2023 20:23
Simple Method to Calculate the Hash of a file in Javascript using HTML5 API
//Event Listener tied to the file input field
document.getElementById('attachment').addEventListener('change', eventHandler, false)
/**
*Description: Simple method to handle an event
*and fire off a function
**/
function eventHandler(evt){
var file = evt.target.files[0];
fileHash( file, md5, function(x){
@markerikson
markerikson / cheng-lou-spectrum-of-abstraction.md
Last active October 23, 2023 23:18
Cheng Lou - "On the Spectrum of Abstraction" summarized transcript (React Europe 2016)

Cheng Lou - On the Spectrum of Abstraction

Cheng Lou, a former member of the React team, gave an incredible talk at React Europe 2016 entitled "On the Spectrum of Abstraction". That talk is available for viewing here: https://www.youtube.com/watch?v=mVVNJKv9esE

It's only a half-hour, but it is mind-blowing. It's worth re-watching two or three times, to let the ideas sink in.

I just rewatched the talk for some research, and wrote down a summary that's semi-transcript-ish. I didn't see any other transcripts for this talk, other than the auto-generated closed captions, so I wanted to share for reference.

Summary

@Jason5Lee
Jason5Lee / async-await-no-stackoverflow.md
Last active October 29, 2023 11:11
Using async/await to avoid stack overflow error.

Inspired by elizarov/DeepRecursiveFunction.kt.

Normally, when recursively evaluating the depth of a deep tree, it will result in stack overflow error. But, by using async/await, it keeps its stack on the heap, and evaluates correct result without error.

C#

public static class Program
{
""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
" Font
:set guifont=Source\ Code\ Pro:h14
""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
" Hide pointless junk at the bottom, doesn't work in .vimrc for some reason?
:set laststatus=0
:set noshowmode "don't show --INSERT--
:set noruler "don't show line numbers/column/% junk
export const chaosTestStrings = (): void => {
const textNodes = getAllTextNodes(document.body);
for (const node of textNodes) {
const textNodeLength = node.textContent ? node.textContent.length : 0;
if (node.textContent === null) {
return;
}
if (node.parentElement instanceof Element) {
if (node.parentElement.dataset.originalText === undefined) {
@tannerlinsley
tannerlinsley / useBroadcastLeader.ts
Created June 4, 2021 14:37
A React Hook to determine if a tab of your application is the "leader" using BroadcastChannel and leader election
import { BroadcastChannel, createLeaderElection } from 'broadcast-channel'
import React from 'react'
const channels = {}
export function useBroadcastLeader(id = 'default') {
const [isBroadcastLeader, setIsBroadcastLeader] = React.useState(false)
React.useEffect(() => {
if (!channels[id]) {
@gaearon
gaearon / connect.js
Last active April 11, 2024 06:46
connect.js explained
// connect() is a function that injects Redux-related props into your component.
// You can inject data and callbacks that change that data by dispatching actions.
function connect(mapStateToProps, mapDispatchToProps) {
// It lets us inject component as the last step so people can use it as a decorator.
// Generally you don't need to worry about it.
return function (WrappedComponent) {
// It returns a component
return class extends React.Component {
render() {
return (