xxxxxxxxxx
const fn = () => {
console.log('Arrow function')
}
// Same as the arrow function from above
function fn() {
console.log('Normal function')
}
xxxxxxxxxx
// javascript arrow function vs normal function
// 0. How to code them
// 1. "this" keyword behaves differently
// 2. Arrow functions use the "argument" keyword differently
// 3. Arrow functions cannot be used as constructors (the "new" keyword)
// 4. Implicit return (arrow functions can skip the "return" keyword)
// ---- 0. How to code them
// Normal Function
let add = function (num1, num2) {
return num1 + num2;
}
// Arrow Function
let add = (num1, num2) => num1 + num2;
// alternative if inside an object
let object {
add: (num1, num2) => {
num1 + num2
},
};
// ---- 1. "this" keyword behaves differently
var variable = “Global Level Variable”;
let myObject = {
variable: “Object Level Variable”,
arrowFunction: () => {
console.log(this.variable);
},
regularFunction() {
console.log(this.variable);
}
};
myObject.arrowFunction();
myObject.regularFunction();
// Result:
// Global Level Variable
// Object Level Variable
// ---- 2. Arrow functions cannot use the "argument" keyword
function exampleFunction() {
console.log(arguments[0]);
console.log(arguments[1]);
console.log(arguments[2]);
}
exampleFunction(1,2,3)
// Result:
// 1
// 2
// 3
let exampleFunction = {
printArguments : () => {
console.log(arguments);
}
}
exampleFunction.printArguments(1,2,3)
// Result:
// [x] Uncaught ReferenceError: ...
// ---- 3. Arrow functions cannot be used as constructors (the "new" keyword)
function Article(topic) {
this.topic= topic;
}
const article= new Article('JavaScript');
// Result:
// No errors
function Article = (topic) => {
this.topic= topic;
}
const article= new Article('JavaScript');
// Result:
// [x] Uncaught TypeError: ...
// ---- 4. Implicit return (arrow functions can skip the "return" keyword)
function exampleFunction() {
return 10;
}
exampleFunction();
// Result:
// 10
function exampleFunction() {
var number = 10;
}
exampleFunction();
// Result:
// undefined
const addOne = (number) => number + 1;
addOne(10);
// Result:
// 11
xxxxxxxxxx
function double(x) { return x * 2; } // Traditional way
console.log(double(2)) // 4
const double = x => x * 2; // Same function written as an arrow function with implicit return
console.log(double(2)) // 4
xxxxxxxxxx
function Welcome(){
console.log("Damn!,Why you're using old type of function,try to use new fuction by seeing below code");
}
// Arrow Function
const Welcome = () => {
alert("Congratulation!,You have created Arrow Function in JavaScipt!"):
}
//coded by Anshul Soni
//dont forget to see who am I https://anshulsoni.tech
xxxxxxxxxx
getEventById: state => id => {
return state.todos.find(x => x.id === id)
}
xxxxxxxxxx
export const loadUser = () => (dispatch, getState) => {
if (!getState().auth.token) {
dispatch({ type: LOGIN_FAIL });
return;
}
// User Loading
dispatch({ type: USER_LOADING });
axios
.get('/api/auth/user', tokenConfig(getState))
.then(res => {
dispatch({
type: USER_LOADED,
payload: res.data,
});
})
.catch(err => {
console.warn(`Error returned: ${err}.`);
dispatch({
type: AUTH_ERROR,
});
});
};