| Promise | Observables |
|---|---|
| A promise can only handle one event | Observables are for streams of events over time |
| Emits a single value | Emits multiple values over a period of time |
| Not Lazy | Lazy. An Observable is not called until we subscribe to it |
| Can not be cancelled | Can be cancelled by using the unsubscribe() method |
| It does not provide any operators | provides the map, forEach, filter, reduce, retry, retryWhen operators |
https://medium.com/@mpodlasin/promises-vs-observables-4c123c51fe13
| Method | Use |
|---|---|
| .forEach() | it has advantages over the for with regards to scoping & clean code |
| .map() | to transform elements in an array |
| .filter() | to select a subset of multiple elements from an array |
| .find() | to select a single elememt from an array |
| .reduce() | to derive a single value from multiple elements in an array. |
let numbers = [1, 2, 3];
let map = numbers.map((x)=>x*2);
console.log(map); // [2, 4, 6]
let target = numbers.filter((x)=>x>1);
console.log(target); // [ 2, 3 ]
let find = numbers.find((x)=>x===1); // always retuns a single element
console.log(find); // 1
let sum = numbers.reduce((accumulator,current) => accumulator + current);
console.log(sum); // 6
- Should be invoked immediately
- IIFEs have there own scope i.e. the variables you declare in the Function Expression will not be available outside the function.
- Similarly to other function IIFEs can also be named or anonymous, but even if an IIFE does have a name it is impossible to refer/invoke it.
- IIFEs can also have parameters.
// Declaring the parameter required.
(function(dt) {
console.log(dt.toLocaleTimeString());
// Passing the Parameter.
})(new Date());
-
"object constructor" syntax
let person = new Object(); -
"object literal" syntax
let person = {};
You can access the values of varriables inside an object using
- Dot notation
objectname.propertyname; - bracket notation
objectname['propertyname'];
<script>
// an object
let person = {
name: "Mukul", // by key "name" store value "Mukul"
age: 22 // by key "age" store value 22
};
document.write(person.name+'</br>');
document.write(person['age']);
</script>
- Hoisting is the JavaScript interpreter's action of moving all variable and function declarations to the top of the current scope.
- However, only the actual declarations are hoisted. Any assignments are left where they are.
Below code will get transform :
console.log(counter); // undefined
var counter = 1;
to
var counter;
console.log(counter); // undefined
counter = 1;
- Short-hand notation for writing functions in ES6.
- Consists of a parameter list ( ... ), followed by the =>marker and a function body
- For single-argument functions, the parentheses may be omitted.
- Return can be omitted, if the implemantion is without
{}
- Arrow functions behavior with
thiskeyword varies from that of normal functions. - Each function in JavaScript defines its own this context but arrow functions capture the this value of the nearest enclosing context.
- They cannot be used as constructors. E.g., you can’t use new with an arrow function. Hence arrow functions do not have a protoype property on them.
https://dev.to/wangonya/this-and-arrow-functions-a67
- Spread operator takes an iterable (e.g. an array) and expands it into individual elements.
- Used to make shallow copies of JS Objects.
- The spread operator can be used to clone an iterable object or merge iterable objects into one.
let arr = [1,2,3]
let arr2 = [4,5]
arr = [...arr,...arr2]
console.log(arr) // [1,2,3,4,5]
let arr = [ 'a', 'b', 'c' ];
let arr2 = [...arr];
console.log(arr) // [ 'a', 'b', 'c' ]
arr2.push('d'); //inserting an element at the end of arr2
console.log(arr2); // [ 'a', 'b', 'c', 'd' ]
console.log(arr); // [ 'a', 'b', 'c' ]
let arr = ['a', 'b'];
let arr2 = [...arr, 'c','d']
console.log(arr2); // [ 'a', 'b', 'c', 'd' ]
// with spread
let arr = [1,2,3,-1];
console.log(Math.min(...arr)); //-1
const user1 = {
name: 'Jen',
age: 22
};
const clonedUser = { ...user1 };
console.log(clonedUser);
const user1 = {
name: 'Jen',
age: 22,
};
const user2 = {
name: "Andrew",
location: "Philadelphia"
};
const mergedUsers = {...user1, ...user2};
console.log(mergedUsers)
- Strict mode eliminates errors that would be ignored in non-strict mode, thus making javascript "more secured"
- It is the best practice to use strict in JS files.
- Keyword indicates that code should be interpreted in strict mode specifies to user agents like browsers, and throw an error if the code doesn't make sense
- Can prevent memory leaks
var city = "Chicago"
console.log(city) // Prints the city name, i.e. Chicago
city = "Chicago"
console.log(city) // Prints the city name, i.e. Chicago
Without strict mode turned on, user agents often go through a series of modifications to problematic code in an attempt to get it to make sense.
'use strict';
city = "Chicago"
console.log(city) // Reference Error: asignment is undeclared variable city.
env: {
es6: true
},
rules : {
strict: ['error', 'global'],
},
};
- The == operator will compare for equality after doing any necessary type conversions.
- The === operator will not do the conversion, so if two values are not the same type === will simply return
false
'1' === 1 // will return "false" because `string` is not a `number`
'1' == 1 // will return "true"
