Reduce Arrays in JavaScript

AmitDiwan
Updated on 17-Jul-2020 07:40:50

147 Views

Following is the code to reduce arrays in JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result,    .sample {       font-size: 18px;       font-weight: 500;       color: red;    }    .result {       color: blueviolet;    }    button {       padding: 8px;    } Reduce arrays javascript [1,3,5,6,9,22,15] Sum Click on the above button to sum the elements of the array    let resEle = document.querySelector(".result");    let BtnEle = document.querySelector(".Btn");    let sampleEle = document.querySelector(".sample");    let arr = [1, 3, 5, 6, 9, 22, 15];    sampleEle.innerHTML = arr;    BtnEle.addEventListener("click", () => {       resEle.innerHTML =       "Sum = " +       arr.reduce((sum, prev) => {          return sum + prev;       });    }); OutputOn clicking the ‘Sum’ button −

Breaking a Loop in Functional Programming with JavaScript

AmitDiwan
Updated on 17-Jul-2020 07:35:27

156 Views

Following is the code for breaking a loop in functional programming −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result {       font-size: 18px;       font-weight: 500;       color: rebeccapurple;    } Breaking a loop in functional programming JavaScript Click here Click on the above button to iterate fruitArr array and exit if peach is found    let resEle = document.querySelector(".result");    let fruitArr = ["apple", "mango", "peach", "papaya", "watermelon"];    document.querySelector(".Btn").addEventListener("click", () => {       fruitArr.some(function (fruit) {          if (fruit === "peach") {             return true;          }          resEle.innerHTML += fruit + "";       });    }); OutputOn clicking the ‘Click here’ button −

Continue a Loop in Functional Programming with JavaScript

AmitDiwan
Updated on 17-Jul-2020 07:34:13

127 Views

Following is the code for continuing a loop in functional programming JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result {       font-size: 18px;       font-weight: 500;       color: rebeccapurple;    } Continuing a loop in functional programming JavaScript Click here Click on the above button to iterate fruitArr and skip mango and peach or not    let resEle = document.querySelector(".result");    let fruitArr = ["apple", "mango", "peach", "papaya", "watermelon"];    document.querySelector(".Btn").addEventListener("click", () => {       fruitArr.some(function (fruit) {          if (fruit === "mango" || fruit === "peach") {             return false;          }          resEle.innerHTML += fruit + "";       });    }); OutputOn clicking the ‘Click here’ button −

Import as and Export as Constructs in JavaScript

AmitDiwan
Updated on 17-Jul-2020 07:32:33

207 Views

Import as allows us to import a named module under different name.Export as allows us to export a named module under different name.Following is the code for import as and export as construct in Javascript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result {       font-size: 18px;       font-weight: 500;       color: rebeccapurple;    } Import as and Export as in JavaScript CLICK HERE Click on the above button to execute the imported ... Read More

Get All Unique Values in a JavaScript Array

AmitDiwan
Updated on 17-Jul-2020 07:31:41

433 Views

Following is the code for getting all unique values in a JavaScript array −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result,    .sample {       font-size: 18px;       font-weight: 500;       color: rebeccapurple;    }    .result {       color: red;    } Get all unique values in a array Click here Click on the above button to remove the duplicate values from the above array    let resultEle = document.querySelector(".result");    let sampleEle = document.querySelector(".sample");    let arr = [2, 3, 4, 2, 3, 4, "A", "A", "B", "B"];    sampleEle.innerHTML = "arr = " + arr;    document.querySelector(".Btn").addEventListener("click", () => {       let set1 = new Set(arr);       resultEle.innerHTML = "arr = " + [...set1] + "";    }); OutputOn clicking the ‘Click here’ button −

Passing Empty Parameter to a Method in JavaScript

AmitDiwan
Updated on 17-Jul-2020 07:28:12

1K+ Views

Following is the code passing empty parameter to a method in JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result {       font-size: 18px;       font-weight: 500;       color: blueviolet;    } Passing empty parameter to a method Click here Click on the above button to call multiply function and pass empty parameters to it    let resEle = document.querySelector(".result");    let BtnEle = document.querySelector(".Btn");    function multiply(a = 2, b = 4) {       return a * b;    }    BtnEle.addEventListener("click", () => {       resEle.innerHTML = "The multiplication of numbers = " + multiply();    }); OutputOn clicking the ‘Click here’ button −

What are Partial Functions in JavaScript

AmitDiwan
Updated on 17-Jul-2020 07:27:35

3K+ Views

Partial functions allow takes a function as an argument and along with it takes arguments of other types too. It then uses some of the arguments passed and returns a function that will take the remaining arguments. The function returned when invoked will call the parent function with the original and its own set of arguments.Following is the code for partial functions in JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result {       font-size: 18px;       font-weight: 500; ... Read More

Object Equality Comparison in JavaScript

AmitDiwan
Updated on 17-Jul-2020 07:25:56

115 Views

The object.is() method introduced in ES6 as a way to compare two values. These two values can either be primitives or objects. It does a little better comparison than == and ===.Following is the code for object.is() in equality comparison −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result {       font-size: 18px;       font-weight: 500;       color: blueviolet;    } Object.is() equality comparsion Click here Click on the above button to compare objects ... Read More

Borrow Methods in JavaScript

AmitDiwan
Updated on 17-Jul-2020 07:24:59

146 Views

The call(), apply() and bind() are used to borrow methods in JavaScript.Following is the code for borrowing methods in JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result, .sample {       font-size: 18px;       font-weight: 500;       color: rebeccapurple;    }    .result {       color: red;    } Borrowing a method in JavaScript CLICK HERE Click on the above button to borrow the welcome method of object obj ... Read More

Event Bubbling vs Event Capturing in JavaScript

AmitDiwan
Updated on 17-Jul-2020 07:23:13

974 Views

Event Bubbling − Whenever an event happens on an element, the event handlers will first run on it and then on its parent and finally all the way up to its other ancestors.Event Capturing − It is the reverse of the event bubbling and here the event starts from the parent element and then to its child element.Following is the code for event bubbling vs event capturing in JavaScript −Example Live Demo Document    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    }    .result {       font-size: 18px; ... Read More

Advertisements