What is the use of Higher-order functions in JavaScript?

JavascriptFront End TechnologyObject Oriented Programming

Javascript has provided many built-in functions to complete a particular task. But if we try to solve any program normally with those built-in functions, the code may not be concise. Javascript has also provided some inbuilt higher-order functions. These higher-order functions decrease the length of the code, increase the readability and simplify the accessibility. Some of the higher-order functions are maps, filters and reduce. Let's discuss filter higher-order function.

Example 

when there is no higher-order functions program code may take more number of steps in total. In the following example, a new array is taken, even though the provided array is enough to complete the task. A for-loop, which is unnecessary in case of higher-order functions, is taken to loop through the array. 

Live Demo

<html>
<body>
<script>
   const name = [];
   var persons = [
      { name: 'Frodobaggins'},
      { name: 'aragorn'},
      { name: 'gandalf'},
      { name: 'pippin'},
      { name: 'nazgul'},
   ];
   for(let i = 0; i < persons.length; i++) {
      if(persons[i].name.length > 6) {
         name.push(persons[i]);
      }
   }
   document.write(JSON.stringify(name));
</script>
</body>
</html>

Output

[{"name":"Frodobaggins"},{"name":"aragorn"},{"name":"gandalf"}]

Example

In the following example, a higher-order function filter is used. Comparing to the above example, the following example has occupied less number of lines of code. Here no new array is taken and also no for-loop is used.

Live Demo

<html>
<body>
<script>
   const persons = [
      { name: 'Frodobaggins'},
      { name: 'aragorn'},
      { name: 'gandalf'},
      { name: 'pippin'},
      { name: 'nazgul'},
   ];
   const name = persons.filter(person => person.name.length > 7);
   document.write(JSON.stringify(name));
</script>
</body>
</html>

Output

[{"name":"Frodobaggins"}]
raja
Published on 25-Jul-2019 14:29:36
Advertisements