What should knows as a Full stack developer

Javascript Concepts

1. Promise
2. Closures
3. Anonymous Function
4. Function statement vs function expression
5. High order function
6. First class function
7. Call back function
8. Message queue & event loop & call stack & execution context
9. Javascript Engine
10. IIFE: immediate invoke function expression
11. This & call, apply, bind
12. Module & namespace
13. Module pattern
14. Asyn & Await
15. Hoisting
16. Call stack
17. Scope: block scope, lexical scope and var, let, const difference
18. setTimeout vs set Interval vs setImmediate
19. Synchronous vs Asynchronous
20. Prototype
21. Recursion
22. currying
23. ES6 Class
24. Map, filter & reduce
25. oops javascript
26. Javascript Error types
27. ES6 features
28. Spread operator
29. Polyfill for bind method
30. memoize

Promise:

Promise is an object which represents the eventual completion of Asynchronous operation and its resulting value. Either fulfilled or rejected

States:

1. Pending
2. Fulfilled
3. Rejected.

const API_ENTRIES = "https://api.publicapis.org/entries"

const promise = fetch(API_ENTRIES);

console.log(promise)

promise.then((response) => response.json()).then((data) => console.log(data.count))

axios.get(API_ENTRIES).then((data) => console.log('---',data.data.count))Closures

Closures:

A closure is the combination of function bundled together with its references to its lexical environment.

A closure give you access outer function scope from an inner function.

Closure are created when the function created time.

function init () {
	var name = 'siva'
  function displayname() {
  console.log('Hi '+ name);
  }
  displayname()
}
init();

simple explanation:

Function along with its lexical scope bundled together forms a closure 

function x () {

var a = 7

function y() {

console.log(a);

}

return y

}

const z = x();

console.log(z)

z();

console:

ƒ y() {

console.log(a);

}

---------

7

Flow:

Understand 'a' is reference to the variable.

function x () {

var a = 7

function y() {

console.log(a);

}

a = 100; //reinitialise a value before return

return y

}

const z = x();

console.log(z)

z();

console:

ƒ y() {

console.log(a);

}

------------

100

Just deep one more function:

function z() {

let b = 100

function x() {

let a = 200

function y() {

// 'a' referenced to parent lexical scope

// 'b' referenced to parent to parent lexical scope

console.log(a, b)

}

a = 300 //reinitialise a value

y() // call y

}

x() // call x

}

z() // call z

// output forms a two closure

// 300 100

Anonymous Function:

A function without name is a anonymous function. Anonymous function does not have an own identity. Normally anonymous function we are assigned as a variable. It act as a value it known as function expression. 

let anyfn = function () {

const ab =

'A function without name is a anonymous function'

console.log(ab)

}

anyfn()

Function Expression:

A function assigned as a variable is known as function expression

let fnexp = function () {

const ab =

'A function assigned as a variable is known as function expression'

console.log(ab)

}

fnexp()

Named Function Expression:

The named function statement assigned as a variable called named function expression

let nfnexp = function xyz() {

const ab =

'A named function statement assigned as a variable is known as function expression'

console.log(ab)

}

nfnexp()

Function statement:

create a function using function keyword with function name is called a function statement.

function xyz() {

const ab =

'function keyword with function name is known as function statement'

console.log(ab)

}

xyz()

Function Declaration:

Function statement also known as function declaration

Difference b/w function statement and function expression

function statement we can call any place in the javascript file. But function expression we can call after initialised the variable

//difference b/w fn statement vs fn expression

xyz() // xyz create a memory and the function assigned to xyz

b() // Uncaught ReferenceError: Cannot access 'b' before initialised

function xyz() {

const ab = 'function statement can execute, when the function is called'

console.log(ab)

}

let b = function () {

const expression =

'javascript engine initialise b is undefined in the memory, until the execution reaches variable b'

}

b() // b already initialised - no error

Difference b/w Arguments and Parameters

The values are passing inside the function as known as arguments
The function get the values as known as parameters

let b = function (param1, param2) {

const expression = 'Function get the values as known as parameter'

console.log(expression, param1 + param2)

}

b(1, 2) // Pass the value inside the function as know as Arguments

First Class function:

the functions can be assigned to any other variable or passed as an argument or can be returned by another function.

Higher order function:

A function that receives another function as an argument or that returns a new function or both is called Higher-order function. Higher-order functions are only possible because of the First-class function.

Call back function:

The function that we pass as an argument to another function is called the callback function.

Execution Context:

Everything javascript happen inside the execution Context 

There is two component in the execution context

1. `Memory component` is known as variable environment
2.  `Code Component` is known as Thread of execution

Memory component: 

key: value pairs of variable and function

Code component:

Code component as known as Tread of execution is like thread in which is whole code executed one line at a time. That means Javascript is synchronous single threaded language.

Synchronous single threaded - that means that javascript can only execute one command at a time and in a specific order. It can only go to the next line once the current line has been finished executing 

Vue JS:

1. Life cycle hooks

2. Difference between computed and methods

3. Watchers and deep watchers

4. Composition API

5. Event handling

6. Vuex

7. Vuetify

8. Bootstrap vue

9. How do you pass data from parent to child and all ways (provide and inject, event bus)

10. Routing

11. Authentication

12. Internationalisation - https://www.freecodecamp.org/news/how-to-add-internationalization-to-a-vue-application-d9cfdcabb03b/

13. Unit test case

14. Slots

15. event bus