An open API service indexing awesome lists of open source software.

https://github.com/vivekimsit/til

Lets learn something everyday.
https://github.com/vivekimsit/til

knowledgebase motivation today-i-learned

Last synced: about 1 month ago
JSON representation

Lets learn something everyday.

Awesome Lists containing this project

README

          

# TIL

> Lets learn something everyday.

#### Map

```
var m = {};
var a = {id: 1},
b = {id: 2};
m[x] = 'foo';
m[x] = 'bar';

m[x]?
m[y]?
```

#### WeakMap

1. WeakMap take only object as keys.
2. They don't have `size` or `clear` method.
3. They don't have iterartor over `keys`, `values` or `entries`.

#### Array

Initialize an array of given length with default values:

```
Array(3).fill(null); // [null, null, null]
```

#### Destructuring

```
// Fail-soft destructuring with defaults
var [a = 1] = [];
a === 1;
```

#### Classes

Unlike function declarations, class declarations are not hoisted.

```js

// A class only exists after execution reached its definition and it was evaluated.
// Accessing it beforehand leads to a ReferenceError

new Foo();

class Foo {}

```

#### Null

```js
var a = null;

(!a && typeof a === "object"); // true
```

null is the only primitive value that is "falsy" but that also returns "object"
from the typeof check.

#### Reference error

Unlike referencing undeclared variables, there is no ReferenceError thrown if
you try to access an object property (even on the global window object) that
doesn't exist.

#### A class body can only contain methods, but not data properties.

Prototypes having data properties is generally considered an anti-pattern, so this just enforces a best practice.

`constructor, static methods, prototype methods`

#### Rest vs Spread

spread elements 'expands' an array into its elements, and rest elements collects
multiple elements and 'condenses' into a single element.

[source (mdn)](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Operators/Spread_operator)

#### Instance methods and properties

```js

class Bork {
//Property initializer syntax
instanceProperty = "bork";
boundFunction = () => {
return this.instanceProperty;
}

//Static class properties
static staticProperty = "babelIsCool";
static staticFunction = function() {
return Bork.staticProperty;
}
}
```
[Babel plugin](https://babeljs.io/docs/plugins/transform-class-properties/)

### Function default values

```js
function foo(opts) {
opts = Object.assign({
pow: ''
}, opts);
}
```

## Web performance

[Faster Font Loading with Font Events](https://jonsuh.com/blog/font-loading-with-font-events/)

### Reducers

Using combineReducers does "call all reducers", or at least all of the slice reducers it is wrapping.

[Link](https://github.com/markerikson/redux/blob/structuring-reducers-page/docs/recipes/reducers/04-UsingCombineReducers.md)

### VIM

#### Convert tabs to spaces in a file

Select visually the area to apply the changes then,

`:retab`

### Service workers

A service worker is run in a worker context: it therefore has *no DOM access*,
and *runs on a different thread* to the main JavaScript that powers your app,
so it is not blocking. It is designed to be *fully async*; as a consequence,
APIs such as synchronous XHR and localStorage can't be used inside a service worker.

#### Javascript

Statements:

1. Declaration Statement `var a = 5`
2. Assignment Statement `b = a`
3. Expression statement `a`

All statements have **completion values** event if its `undefined`.