Git Product home page Git Product logo

javascript-coding-questions's Introduction

JavaScript

This repository contains a collection of daily JavaScript coding questions or concepts along with their solutions.
And my daily learnings .

In the problem folder, you will find different questions of JavaScript Solved with Questions attached .

JavaScript Concepts....

    Implicit Type Coercion

    Implicit type coercion in javascript is the automatic conversion of value from one data type to another. It takes place when the operands of an expression are of different data types.

    • String coercion
    • String coercion takes place while using the ‘ + ‘ operator. When a number is added to a string, the number type is always converted to the string type

       var x = 3;
       var y = "3";
      x + y // Returns "33" 

      When JavaScript sees that the operands of the expression x + y are of different types ( one being a number type and the other being a string type ), it converts the number type to the string type and then performs the operation. Since after conversion, both the variables are of string type, the ‘ + ‘ operator outputs the concatenated string “33” in the first example and “24Hello” in the second example.

      ‘ + ‘ operator when used to add two numbers, outputs a number. The same ‘ + ‘ operator when used to add two strings, outputs the concatenated string:

      var name = "Riya";
      var surname = " Kumari";
      name + surname     // Returns "Riya Kumari" 

      Type coercion also takes place when using the ‘ - ‘ operator, but the difference while using ‘ - ‘ operator is that, a string is converted to a number and then subtraction takes place.

      var x = 3;
      Var y = "3";
      x - y    //Returns 0 since the variable y (string type) is converted to a number type

    IIFE

    An IIFE (Immediately Invoked Function Expression) is a JavaScript function that runs as soon as it is defined

    	// Regular Function.
    	function Greet() {
    		console.log("Welcome to the Readme.md");
    	};
    	// Execution of Regular Function.
    	Greet();
    
    	// IIFE creation and execution.
    	(function() {
    		console.log("Welcome to Readme.md!");
    	})();
    
    • IIFEs have their own scope i.e. the variables you declare in the Function Expression will not be available outside the function.
    • Similarly to other functions 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.

      Use Cases Of IIFE
    • Avoid polluting the global namespace
    • To create closures
    • Avoid conflict of variable names between libraries and programs.

    Callback Function

    A callback function is a function passed into another function as an argument, which is then invoked inside the outer function to complete some kind of routine or action.

        function modifyArray(arr, callback) {
        arr.push(100);
        callback();
      }
      
      var arr = [1, 2, 3, 4, 5];
      
      modifyArray(arr, function() {
        console.log("array has been modified", arr);
      });

    Slice

    The Javascript arr.slice() method returns a new array containing a portion of the array on which it is implemented. The original remains unchanged.

    const a = [1,2,3];
    let b = a.slice(0,3);
    b[1] = 4;
    console.log(b[1]);
    console.log(a[1]);

    To know more about working of Slice method refer these:


    Higher Order Functions

    Functions that operate on other functions, either by taking them as arguments or by returning them, are called higher-order functions.

    function higherOrder(fn) {
      fn();
    }
       
    higherOrder(function() { console.log("Hello world") });  
    function higherOrder2() {
      return function() {
        return "Do something";
      }
    }      
    var x = higherOrder2();
    x()   // Returns "Do something"

    To know more about working of HOF refer these:


    Currying

    It is a technique in functional programming, that transforms the function of multiple arguments into several functions of a single argument in sequence. It is a method that takes one argument at a time and returns a new function that expects the next argument.

    function add (a) {
      return function(b){
        return a + b;
      }
    }
    
    add(3)(4)
      Why is currying useful in JavaScript?
    • It helps us to create a higher-order function
    • It reduces the chances of error in our function by dividing it into multiple smaller functions that can handle one responsibility.
    • It helps us to avoid passing the same variable multiple times
    • It is very useful in building modular and reusable code

    Call Apply Bind

    • Call
    • It’s a predefined method in javascript.This method invokes a method (function) by specifying the owner object.call() method allows an object to use the method (function) of another object.

      This Concept is called Function Borrowing

      var person = {
      age: 23,
      getAge: function(){
        return this.age;
      }
      }        
      var person2 = {age:  54};
      person.getAge.call(person2);      
      // Returns 54

      call() accepts arguments:

      function saySomething(message){
        return this.name + " is " + message;
      }     
      var person4 = {name:  "Riya"};     
      saySomething.call(person4, "awesome");
      // Returns "Riya is awesome"   
      After looking at the above codes we can say that in layperson's terms, it helps you replace the value of this inside a function with whatever value you want.

      Syntax

      call(objectInstance)
      call(objectInstance, arg1, /* …, */ argN)
    • Apply
    • Apply is very similar to the call function. The only difference is that call() method takes arguments separately whereas, apply() method takes arguments as an array.

        function saySomething(message){
        return this.name + " is " + message;
      }        
      var person4 = {name:  "Riya"};
      saySomething.apply(person4, ["awesome"]);

      The best part about apply is we don’t need to take care of the number of arguments that are passed to the invoking function. Because of its dynamic and versatile nature, we can use it in complicated situations.

    • Bind
    • This method returns a new function, where the value of “this” keyword will be bound to the owner object, which is provided as a parameter.

      function saySomething(message){
        return this.name + " is " + message;
      }     
      var person4 = {name:  "Riya"};     
      let Greet = saySomething.bind(person4, "awesome");
      console.log(Greet());

      The only difference between the call and bind is that it gives you copy of the function which can be invoked later rather than directly invoking it .

    Optional chaining

    The ?. operator is like the . chaining operator, except that instead of causing an error if a reference is nullish (null or undefined), the expression short-circuits with a return value of undefined. When used with function calls, it returns undefined if the given function does not exist. The optional chaining (?.) operator accesses an object's property or calls a function. If the object accessed or function called using this operator is undefined or null, the expression short circuits and evaluates to undefined instead of throwing an error.

    Inheritance

    class surname {
      constructor() {
        console.log("kumari 💫");
      }
    }
    
    class Name extends surname {
      constructor() {
        console.log("Riya");
        super();
      }
    }
    
    const user = new Name();

    Explanation :

    const user = new Name();

    This line creates an instance of the Name class, which triggers the constructor of the Name class. Inside the constructor, "Riya" is logged to the console, and then the super() method is called, which triggers the constructor of the surname class. In the surname constructor, "kumari 💫" is logged to the console.

javascript-coding-questions's People

Contributors

ashwinkumar0 avatar riyakumari57 avatar rohitpaul0007 avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar

Forkers

rohitpaul0007

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.