ForEach<\/h2>
A for loop accepts a callback and provides current value and current index of the loop as param to this callback. For each iterates through each element of array and calls the callback for each array element. You don’t need to explicitly set a increment decrement counter unlike for loop. This forms the basis of map, filter and reduce.<\/p><\/div><\/div><\/div>\n\n\n\n
[1,2,3,4,5].forEach((value, index) => {\nconsole.log(value);\n});\n\nOUTPUT: \n1\n2\n3\n4\n5<\/code><\/pre>\n\n\n\nMap<\/h2>
Map is an advanced forEach function used to return an alter set of data. For example in the below example we run a map on an array and pass a callback that is increases value by 1. Map will return a new array and save that to newArr which will contain new data with each value increased by 1. <\/p><\/div><\/div><\/div>\n\n\n\n
let newArr = [1,2,3,4,5].map((value, index) => value+1);\nconsole.log(newArr)\nOUTPUT: \n[2,3,4,5,6]<\/code><\/pre>\n\n\n\nFilter<\/h2>
Filter is used to select a portion of data based on a condition from an array. In the below example we are passing a callback that compares value with 2 if its greater than 2 it returns true else false. Now if the filter function gets true from callback it includes the value in newArr else skips it. Therefore we get a newArr with all elements that are greater than 2. <\/p><\/div><\/div><\/div>\n\n\n\n
let newArr = [1,2,3,4,5].filter((value, index) => value>2);\nconsole.log(newArr)\nOUTPUT: \n[3,4,5]<\/code><\/pre>\n\n\n\nReduce<\/h2>
Reduce is the function that most people find confusing. But it is not that complicated. reduce function has something called accumulator this is basically the value returned by callback at the end of execution and is used in next iteration. In below example we are calculating sum of arr which results in 15. What is happening here is initially the accumulator is 0. and we return value + acc = 1 in first iteration similarly in second iteration we get 3 then 6, 10 and finally 15. The initial value of accumulator is passed as second argument after callback. And if no initial value is passed accumulator takes first value of array as initial <\/p><\/div><\/div><\/div>\n\n\n\n
let sum = [1,2,3,4,5].reduce((acc, value) => (acc + value), 0);\nconsole.log(sum)\nOUTPUT: \n15<\/code><\/pre>\n\n\n\nHope this is helpful. Feel free to comment if you have doubts. We do provide personalised mentorship you can send an email to learn more about that. <\/p>\n\n\n\n\n","protected":false},"excerpt":{"rendered":"
Looping is an important concept in programming. Every language has its own set of predefined looping functions that allows you to iterate over a given set of data. Javascript is no different. Filter, Map, Reduce and Foreach are widely used by javascript programmers. And often end up becoming part of…<\/p>\n
Read the postJavascript Loopers: Map, Filter, Reduce, FoReach<\/span><\/a><\/div>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[1],"tags":[481,482,505,521,676,741,930],"class_list":["post-3238","post","type-post","status-publish","format-standard","hentry","category-infinity-fitness","tag-es6","tag-es7","tag-filter","tag-foreach","tag-javascript","tag-map","tag-reduce","excerpt","zoom","full-without-featured","even","excerpt-0"],"yoast_head":"\nJavascript Loopers: Map, Filter, Reduce, FoReach | ManOrInfinity<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/manorinfinity.com\/blog\/2022\/06\/25\/javascript-loopers-map-filter-reduce-foreach\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Javascript Loopers: Map, Filter, Reduce, FoReach\" \/>\n<meta property=\"og:description\" content=\"Looping is an important concept in programming. Every language has its own set of predefined looping functions that allows you to iterate over a given set of data. Javascript is no different. Filter, Map, Reduce and Foreach are widely used by javascript programmers. And often end up becoming part of…\" \/>\n<meta property=\"og:url\" content=\"https:\/\/manorinfinity.com\/blog\/2022\/06\/25\/javascript-loopers-map-filter-reduce-foreach\/\" \/>\n<meta property=\"og:site_name\" content=\"ManOrInfinity\" \/>\n<meta property=\"article:published_time\" content=\"2022-06-25T06:55:04+00:00\" \/>\n<meta name=\"author\" content=\"manorinfinity\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@manorinfinity\" \/>\n<meta name=\"twitter:site\" content=\"@manorinfinity\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"manorinfinity\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/manorinfinity.com\/blog\/2022\/06\/25\/javascript-loopers-map-filter-reduce-foreach\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/manorinfinity.com\/blog\/2022\/06\/25\/javascript-loopers-map-filter-reduce-foreach\/\"},\"author\":{\"name\":\"manorinfinity\",\"@id\":\"https:\/\/manorinfinity.com\/blog\/#\/schema\/person\/1172b1895b5eb7e49cc8640e49255901\"},\"headline\":\"Javascript Loopers: Map, Filter, Reduce, FoReach\",\"datePublished\":\"2022-06-25T06:55:04+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/manorinfinity.com\/blog\/2022\/06\/25\/javascript-loopers-map-filter-reduce-foreach\/\"},\"wordCount\":387,\"commentCount\":1,\"publisher\":{\"@id\":\"https:\/\/manorinfinity.com\/blog\/#\/schema\/person\/1172b1895b5eb7e49cc8640e49255901\"},\"keywords\":[\"es6\",\"es7\",\"filter\",\"foreach\",\"JavaScript\",\"map\",\"reduce\"],\"articleSection\":[\"Infinity Fitness\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/manorinfinity.com\/blog\/2022\/06\/25\/javascript-loopers-map-filter-reduce-foreach\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/manorinfinity.com\/blog\/2022\/06\/25\/javascript-loopers-map-filter-reduce-foreach\/\",\"url\":\"https:\/\/manorinfinity.com\/blog\/2022\/06\/25\/javascript-loopers-map-filter-reduce-foreach\/\",\"name\":\"Javascript Loopers: Map, Filter, Reduce, FoReach | ManOrInfinity\",\"isPartOf\":{\"@id\":\"https:\/\/manorinfinity.com\/blog\/#website\"},\"datePublished\":\"2022-06-25T06:55:04+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/manorinfinity.com\/blog\/2022\/06\/25\/javascript-loopers-map-filter-reduce-foreach\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/manorinfinity.com\/blog\/2022\/06\/25\/javascript-loopers-map-filter-reduce-foreach\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/manorinfinity.com\/blog\/2022\/06\/25\/javascript-loopers-map-filter-reduce-foreach\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/manorinfinity.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Javascript Loopers: Map, Filter, Reduce, FoReach\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/manorinfinity.com\/blog\/#website\",\"url\":\"https:\/\/manorinfinity.com\/blog\/\",\"name\":\"ManOrInfinity\",\"description\":\"Thrive towards greatness\",\"publisher\":{\"@id\":\"https:\/\/manorinfinity.com\/blog\/#\/schema\/person\/1172b1895b5eb7e49cc8640e49255901\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/manorinfinity.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\/\/manorinfinity.com\/blog\/#\/schema\/person\/1172b1895b5eb7e49cc8640e49255901\",\"name\":\"manorinfinity\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/manorinfinity.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"http:\/\/manorinfinity.com\/wp-content\/uploads\/2023\/06\/moi-logo.png\",\"contentUrl\":\"http:\/\/manorinfinity.com\/wp-content\/uploads\/2023\/06\/moi-logo.png\",\"width\":282,\"height\":260,\"caption\":\"manorinfinity\"},\"logo\":{\"@id\":\"https:\/\/manorinfinity.com\/blog\/#\/schema\/person\/image\/\"},\"description\":\"Complex Problem Solver, Outloud Thinker, An Outstanding Writer, and a very curious human being\",\"sameAs\":[\"http:\/\/manorinfinity.com\"],\"url\":\"https:\/\/manorinfinity.com\/blog\/author\/manorinfinity\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Javascript Loopers: Map, Filter, Reduce, FoReach | ManOrInfinity","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/manorinfinity.com\/blog\/2022\/06\/25\/javascript-loopers-map-filter-reduce-foreach\/","og_locale":"en_US","og_type":"article","og_title":"Javascript Loopers: Map, Filter, Reduce, FoReach","og_description":"Looping is an important concept in programming. Every language has its own set of predefined looping functions that allows you to iterate over a given set of data. Javascript is no different. Filter, Map, Reduce and Foreach are widely used by javascript programmers. And often end up becoming part of…","og_url":"https:\/\/manorinfinity.com\/blog\/2022\/06\/25\/javascript-loopers-map-filter-reduce-foreach\/","og_site_name":"ManOrInfinity","article_published_time":"2022-06-25T06:55:04+00:00","author":"manorinfinity","twitter_card":"summary_large_image","twitter_creator":"@manorinfinity","twitter_site":"@manorinfinity","twitter_misc":{"Written by":"manorinfinity","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/manorinfinity.com\/blog\/2022\/06\/25\/javascript-loopers-map-filter-reduce-foreach\/#article","isPartOf":{"@id":"https:\/\/manorinfinity.com\/blog\/2022\/06\/25\/javascript-loopers-map-filter-reduce-foreach\/"},"author":{"name":"manorinfinity","@id":"https:\/\/manorinfinity.com\/blog\/#\/schema\/person\/1172b1895b5eb7e49cc8640e49255901"},"headline":"Javascript Loopers: Map, Filter, Reduce, FoReach","datePublished":"2022-06-25T06:55:04+00:00","mainEntityOfPage":{"@id":"https:\/\/manorinfinity.com\/blog\/2022\/06\/25\/javascript-loopers-map-filter-reduce-foreach\/"},"wordCount":387,"commentCount":1,"publisher":{"@id":"https:\/\/manorinfinity.com\/blog\/#\/schema\/person\/1172b1895b5eb7e49cc8640e49255901"},"keywords":["es6","es7","filter","foreach","JavaScript","map","reduce"],"articleSection":["Infinity Fitness"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/manorinfinity.com\/blog\/2022\/06\/25\/javascript-loopers-map-filter-reduce-foreach\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/manorinfinity.com\/blog\/2022\/06\/25\/javascript-loopers-map-filter-reduce-foreach\/","url":"https:\/\/manorinfinity.com\/blog\/2022\/06\/25\/javascript-loopers-map-filter-reduce-foreach\/","name":"Javascript Loopers: Map, Filter, Reduce, FoReach | ManOrInfinity","isPartOf":{"@id":"https:\/\/manorinfinity.com\/blog\/#website"},"datePublished":"2022-06-25T06:55:04+00:00","breadcrumb":{"@id":"https:\/\/manorinfinity.com\/blog\/2022\/06\/25\/javascript-loopers-map-filter-reduce-foreach\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/manorinfinity.com\/blog\/2022\/06\/25\/javascript-loopers-map-filter-reduce-foreach\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/manorinfinity.com\/blog\/2022\/06\/25\/javascript-loopers-map-filter-reduce-foreach\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/manorinfinity.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Javascript Loopers: Map, Filter, Reduce, FoReach"}]},{"@type":"WebSite","@id":"https:\/\/manorinfinity.com\/blog\/#website","url":"https:\/\/manorinfinity.com\/blog\/","name":"ManOrInfinity","description":"Thrive towards greatness","publisher":{"@id":"https:\/\/manorinfinity.com\/blog\/#\/schema\/person\/1172b1895b5eb7e49cc8640e49255901"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/manorinfinity.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":["Person","Organization"],"@id":"https:\/\/manorinfinity.com\/blog\/#\/schema\/person\/1172b1895b5eb7e49cc8640e49255901","name":"manorinfinity","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/manorinfinity.com\/blog\/#\/schema\/person\/image\/","url":"http:\/\/manorinfinity.com\/wp-content\/uploads\/2023\/06\/moi-logo.png","contentUrl":"http:\/\/manorinfinity.com\/wp-content\/uploads\/2023\/06\/moi-logo.png","width":282,"height":260,"caption":"manorinfinity"},"logo":{"@id":"https:\/\/manorinfinity.com\/blog\/#\/schema\/person\/image\/"},"description":"Complex Problem Solver, Outloud Thinker, An Outstanding Writer, and a very curious human being","sameAs":["http:\/\/manorinfinity.com"],"url":"https:\/\/manorinfinity.com\/blog\/author\/manorinfinity\/"}]}},"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"jetpack_likes_enabled":true,"_links":{"self":[{"href":"https:\/\/manorinfinity.com\/blog\/wp-json\/wp\/v2\/posts\/3238","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/manorinfinity.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/manorinfinity.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/manorinfinity.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/manorinfinity.com\/blog\/wp-json\/wp\/v2\/comments?post=3238"}],"version-history":[{"count":0,"href":"https:\/\/manorinfinity.com\/blog\/wp-json\/wp\/v2\/posts\/3238\/revisions"}],"wp:attachment":[{"href":"https:\/\/manorinfinity.com\/blog\/wp-json\/wp\/v2\/media?parent=3238"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/manorinfinity.com\/blog\/wp-json\/wp\/v2\/categories?post=3238"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/manorinfinity.com\/blog\/wp-json\/wp\/v2\/tags?post=3238"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}