CORS is a mechanism that use additional HTTP headers to tell browser to give web application running at one origin access to selected resources from a different origin.

Same-origin policy prevents JavaScript from making requests across domain boundaries. Two URLs have the same origin if the protocol, port and host are the same for both

A web application executes a cross-origin HTTP request when it requests a resource that has a different origin (protocol, post or host) from its own.

Preflight request

For HTTP request methods than can cause side effects on server data, CORS specification mandates that browser make “preflight” request. Preflight request is made with HTTP OPTIONS request method and upon approval from server send the actual request.

Simple requests

Simple requests are GET or POST with no custom headers and whose body is text/plain, the request is sent with an extra header ORIGIN. The ORIGIN header contains origin (protocol, post or host) of the requesting page. If the server decides to allow the request it sends a Access-Control-Alow-Origin header sending back same origin or * if its a public resource.

Request with credentials

By default cross domain requests will not send credentials (cookies etc.). With property withCredentials set to true on XMLHTTPRequest , the credentials can be sent in the request. But the browser will reject the response if response doesn’t have Access-Control-Allow-Credentials: true.

References

• Enable CORS
• Cross-domain Ajax with Cross-Origin Resource Sharing
• Cross-Origin Resource Sharing (CORS)
• Same-origin policy
• Fetch: Cross-Origin Requests

ECMAScript2015(ES6) introduced four new collections Map, Set, WeakMap and WeakSet.

Map

A Map object is a simple key/value map and can iterate its elements in insertion order.

let barMap = new Map();
barMap.set('one', 1);
barMap.set('two', 2);
barMap.set('three', 3);

for (let [key, value] of barMap) {
    console.log(key + ' = ' + value); // one = 1, two = 2, three = 3
}

barMap.forEach(function(value, key) {
    console.log(key + ' = ' + value); // one = 1, two = 2, three = 3
});

Set

A Set object is a collection of values. A value in a set may only occur once. You can iterate its elements in insertion order.

let bazSet = new Set();
bazSet.add('a');
bazSet.add('b');
bazSet.add('c');

for (let value of bazSet) {
    console.log(value); // a, b, c
}

WeakMap

A WeakMap is a collection of key/value pairs in which the keys are weakly referenced. The keys must be objects. They allow for objects which are no longer needed to be cleared from memory. There is no method to obtain a list of the keys.

const foowm = new WeakMap();
const key1 = {};
foowm.set(key1, "value1");
foowm.get(key1); // "value1"

WeakSet

A WeakSet is a collection of objects. References to objects are held weakly. If no other references to an object stored in the WeakSet exist , those objects can be garbage collected.

const barws = new WeakSet();
const value1 = {};
barws.add(value1);

References

• ES6 Collections: Using Map, Set, WeakMap, WeakSet
• Map
• Keyed Collections
• Set
• WeakMap
• WeakSet

JavaScript Iterators were added in ECMAScript 2015(ES6). It allows JavaScript objects to specify how custom objects can be used in for...of loops. For a object to be iterable it must implement iteratorMethod. When object needs to be iterated is iteratorMethod is called with no arguments. The iteratorMethod returns a iterator. The object must have a property which is available via a constant Symbol.Iterator. The value of the property must be the iterator method. An object is a iterator if it has a next function which is a zero argument function that returns a object with atleast two properties done(boolean) - Has value true when the iterator has completed its sequence. Has value false if the iterator was able to produce next value in the sequence. value - Any JavaScript value returned by the iterator.

let fooIterator = {
    next: function() {
        if (this.counter < 10) {
            this.counter ++;
            return { value: this.counter, done: false };
        }
        return { value: undefined, done: true };
    },
    counter: 0,
    [Symbol.iterator]: function() {
        return this;
    }
}

for (let value of fooIterator) {
    console.log(value); // 1 2 3 4 5 6 7 8 9 10
}

References

• A Simple Guide to ES6 Iterators in JavaScript with Examples
• Iteration protocols

Generator functions , allow you to define a function whose execution is not continuous. Generator functions are written using the function* syntax.

Generator function do not initially execute their code. Instead they return a special type of iterator called a Generator. When a value is consumed by calling the generators next method, then function executes until it encounters yield keyword.

function* fooGenerator() {
    yield 1;
    yield 2;
    yield 3;
}

for (const val of fooGenerator()) {
    console.log(val); // 1 2 3
}

References:

• Iterators and generators
• Understanding Generators in ES6 JavaScript with Examples

React Default Props values ensure that the prop will have a value if it was not specified by the parent component.

class BazComponent extends React.Component {
    render {
        <div> Hello {this.props.value}!<div>
    }
}

BazComponent.defaultProps = {
    value: 'World'
};

<BazComponent/> // Renders "Hello World!"