What is diffing algorithm?

 React needs to use algorithms to find out how to efficiently update the UI to match the most recent tree. The diffing algorithms is generating the minimum number of operations to transform one tree into another. However, the algorithms have a complexity in the order of O(n3) where n is the number of elements in the tree.

In this case, for displaying 1000 elements would require in the order of one billion comparisons. This is far too expensive. Instead, React implements a heuristic O(n) algorithm based on two assumptions:

1. Two elements of different types will produce different trees.
2. The developer can hint at which child elements may be stable across different renders with a key prop.

JavaScript Top 10 Interview Questions

1- What is difference between var and let ?

Ans: i) var is in Javascript since begining and let is introduced in ES2015/ ES6

        ii) let has block scope and var has function scope

                e.g:  

              function myfun() {

                    if (true) {

                         var a = 2;

                          let b = 1;

                    }

                    console.log(a); //2

                    console.log(b);  // b is not defined

              }

        iii) var get hoisted to it's top of it's function

        e.g:   

                function myfun() {

                    if (true) {

                        console.log(a); // undefined 

                        console.log(b);  // b is not defined

                         var a = 2;

                          let b = 1;

                  }

              }

2- what is difference between let and const

ans:  const will not let you to reassign a value but you can modify it

        let will let you do the reassign value as well as modification to value 

3- what is difference between undefied and null

ans : Both represent empty value but when we define variable and not assign value to it then javascript put it is a undefined and 

        null we do it by assigning it manually we can also assign undefined but which is not a good idea

        typeof(undefined)  = => undefined

        typeof(null) ==> object

4- What is prototype inheritance in Javascript ?

ans : Every object of javscript has prototype property by default

This is why you can use a method like sort() on an array instance.

prototypical inheritance refers to the ability to access object properties from another object. We use a JavaScript prototype to add new properties and methods to an existing object constructor. We can then essentially tell our JS code to inherit properties from a prototype

5- What Closure in javascript ?

ans: A closure is a function having access to the parent scope, even after the parent function has closed

(we can use it for counter type of method)

let Obj = function () {

    let i = 0;

   return {

    setI(k) {

       i = k;

     }

    getI() {

       return i;

     }

    }

}

let x = Obj();

x.setI(2);

console.log(x.getI); // 2

Mongo Basic Commands

1-Listing Database

show databases

2-Finding the current database you’re in

db

3-Go to a particular database

use <your_db_name>

In MongoDB server, if your database is present already, using that command will navigate into your database.

But if the database is not present already, then MongoDB server is going to create the database for you. Then, it will navigate into it.

4- Get collection list 

db.getCollectionNames()

5- insert data in collection name users

db.users.insert({email:'mayur@gmail.com',password:'1234',role:'Client’})

6- get all data from collection

db.users.find()

7- get all data from collection by id

db.users.findOne({"_id":ObjectId("602ce59f80d64f6e81fe7a6a")})

* Creating a Collection

Navigate into your newly created database with the use command.

Actually, there are two ways to create a collection. Let’s see both.

One way is to insert data into the collection:

db.myCollection.insert({"name": "john", "age" : 22, "location": "colombo"})

This is going to create your collection myCollection even if the collection does not exist. Then it will insert a document with name and age. These are non-capped collections.

The second way is shown below:

2.1 Creating a Non-Capped Collection

db.createCollection("myCollection")

2.2 Creating a Capped Collection

db.createCollection("mySecondCollection", {capped : true, size : 2, max : 2})

In this way, you’re going to create a collection without inserting data.

A “capped collection” has a maximum document count that prevents overflowing documents.

In this example, I have enabled capping, by setting its value to true.

The size : 2 means a limit of two megabytes, and max: 2 sets the maximum number of documents to two.

Now if you try to insert more than two documents to mySecondCollection and use the find command (which we will talk about soon), you’ll only see the most recently inserted documents. Keep in mind this doesn’t mean that the very first document has been deleted — it is just not showing.

There are three methods of inserting data.

1. insertOne() is used to insert a single document only.
2. insertMany() is used to insert more than one document.
3. insert() is used to insert documents as many as you want.

Below are some examples:

• insertOne()

db.myCollection.insertOne(
  {
    "name": "navindu", 
    "age": 22
  }
)

• insertMany()

db.myCollection.insertMany([
  {
    "name": "navindu", 
    "age": 22
  },
  {
    "name": "kavindu", 
    "age": 20
  },

  {
    "name": "john doe", 
    "age": 25,
    "location": "colombo"
  }
])

The insert() method is similar to the insertMany() method.

Also, notice we have inserted a new property called location on the document for John Doe. So if you use find, then you’ll see only for john doe the location property is attached.

This can be an advantage when it comes to NoSQL databases such as MongoDB. It allows for scalability.

Successfully inserted data

* Querying Data

Here’s how you can query all data from a collection:

db.myCollection.find()

result

If you want to see this data in a cleaner, way just add .pretty() to the end of it. This will display document in pretty-printed JSON format.

db.myCollection.find().pretty()

result

Wait...In these examples did you just notice something like _id? How did that get there?

Well, whenever you insert a document, MongoDB automatically adds an _id field which uniquely identifies each document. If you do not want it to display, just simply run the following command

db.myCollection.find({}, _id: 0).pretty()

Next, we’ll look at filtering data.

If you want to display some specific document, you could specify a single detail of the document which you want to be displayed.

db.myCollection.find(
  {
    name: "john"
  }
)

result

Let’s say you want only to display people whose age is less than 25. You can use $lt to filter for this.

db.myCollection.find(
  {
    age : {$lt : 25}
  }
)

Similarly, $gt stands for greater than, $lte is “less than or equal to”, $gte is “greater than or equal to” and $ne is “not equal”.

* Updating documents

Let’s say you want to update someone’s address or age, how you could do it? Well, see the next example:

db.myCollection.update({age : 20}, {$set: {age: 23}})

The first argument is the field of which document you want to update. Here, I specify age for the simplicity. In production environment, you could use something like the _id field.

It is always better to use something like _id to update a unique row. This is because multiple fields can have same age and name. Therefore, if you update a single row, it will affect all rows which have same name and age.

result

If you update a document this way with a new property, let’s say location for example, the document will be updated with the new attribute. And if you do a find, then the result will be:

result

If you need to remove a property from a single document, you could do something like this (let’s say you want age to be gone):

db.myCollection.update({name: "navindu"}, {$unset: age});

* Removing a document

As I have mentioned earlier, when you update or delete a document, you just need specify the _id not just name, age, location.

db.myCollection.remove({name: "navindu"});

* Removing a collection

db.myCollection.remove({});

Note, this is not equal to the drop() method. The difference is drop() is used to remove all the documents inside a collection, but the remove() method is used to delete all the documents along with the collection itself.

Mongodb initial Setup and basic commands

On Post installation  go to below path 

C: -> Program Files -> MongoDB -> Server -> 4.0(version) -> bin

In the bin directory, you’ll find an interesting couple of executable files.

• mongod
• mongo

mongod stands for “Mongo Daemon”. mongod is a background process used by MongoDB. The main purpose of mongod is to manage all the MongoDB server tasks. For instance, accepting requests, responding to client, and memory management.

mongo is a command line shell that can interact with the client (for example, system administrators and developers).

Now let’s see how we can get this server up and running. To do that on Windows, first you need to create a couple of directories in your C drive. Open up your command prompt inside your C drive and do the following:

C:\> mkdir data/dbC:\> cd dataC:\> mkdir db

The purpose of these directories is MongoDB requires a folder to store all data. MongoDB’s default data directory path is /data/db on the drive. Therefore, it is necessary that we provide those directories like so.

After creating those two files, head over again to the bin folder you have in your mongodb directory and open up your shell inside it. Run the following command:

mongod

Voilà! Now our MongoDB server is up and running! ?

In order to work with this server, we need a mediator. So open another command window inside the bind folder and run the following command:

mongoAfter running this command, navigate to the shell which we ran mongod command (which is our server). You’ll see a ‘connection accepted’ message at the end. That means our installation and configuration is successful!

Just simply run in the mongo shell:

db

Setting up Environment Variables:

To save time, you can set up your environment variables. In Windows, this is done by following the menus below:

Advanced System Settings -> Environment Variables -> Path(Under System Variables) -> Edit

Simply copy the path of our bin folder and hit OK! In my case it’s C:\Program Files\MongoDB\Server\4.0\bin

Which javascript engine react native use ?

1-Javascript VM: The JS Virtual Machine that runs all our JavaScript code. On iOS/Android simulators and devices React Native uses JavaScriptCore, which is the JavaScript engine that powers Safari. JavaScriptCore is an open source JavaScript engine originally built for WebKit.

2 - chrome uses V8 javascript engine.

What is Redux ?

1- Redux is one of the framework get used to maintain application state. It is a predictable state container for JavaScript applications and is used for the entire applications state management.

2- Applications developed with Redux are easy to test and can run in different environments showing consistent behaviour.

3- Redux is not only React specific library, Angular team also integrated Redux in Angualr6 using ng/Rx library.

Lifecycle methods of React component.

1- componentWillMount() – get called only once component initiated i.e. after constructure and right place to call setState in initial stage.

2- componentDidMount() – get called only once after component render first time.

3- componentWillReceiveProps() – Invoked as soon as the props are received from the parent class and before another render is called.

4- shouldComponentUpdate() – Returns true or false value based on certain conditions. If you want your component to update, return true else return false. By default, it returns false.

5- componentWillUpdate() – Called just before rendering takes place in the DOM.

6- componentDidUpdate() – Called immediately after rendering takes place.

7- componentWillUnmount() – get Called just before to component unmount from the DOM. It is used to unsubcribe the listner/event to avoid memory leak, etc.