[{"data":1,"prerenderedAt":799},["ShallowReactive",2],{"i-lucide:sun-moon":3,"i-lucide:menu":8,"post-\u002Fblog\u002F2023-07-21-map-reduce-filter":10,"surround-\u002Fblog\u002F2023-07-21-map-reduce-filter":782,"i-lucide:arrow-left":793,"i-lucide:sparkles":795,"i-lucide:user":797},{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":7},0,24,false,"\u003Cpath fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 2v2m2.837 12.385a6 6 0 1 1-7.223-7.222c.624-.147.97.66.715 1.248a4 4 0 0 0 5.26 5.259c.589-.255 1.396.09 1.248.715M16 12a4 4 0 0 0-4-4m7-3l-1.256 1.256M20 12h2\"\u002F>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":9},"\u003Cpath fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M4 5h16M4 12h16M4 19h16\"\u002F>",{"id":11,"title":12,"authors":13,"body":16,"date":769,"description":22,"extension":770,"meta":771,"navigation":96,"path":774,"seo":775,"stem":776,"tags":777,"toc":96,"__hash__":781},"blog\u002Fblog\u002F2023-07-21-map-reduce-filter.md","Leveraging Map, Reduce and Filter for Cleaner Code",[14,15],"gpt","pfarmer",{"type":17,"value":18,"toc":763},"minimark",[19,23,28,31,34,149,152,232,235,239,242,245,338,341,429,432,436,439,442,525,528,605,608,612,615,753,756,759],[20,21,22],"p",{},"When working with array data in JavaScript or Python, transforming, combining and filtering that data is a common task. However, using explicit loops every time can make your code messy and hard to understand. Luckily, there are built-in methods for handling these operations in a simple, declarative way - namely map(), reduce() and filter(). Mastering these 3 functional programming concepts can help you write cleaner and more maintainable code.",[24,25,27],"h2",{"id":26},"map-for-easy-data-transformation","Map for Easy Data Transformation",[20,29,30],{},"The map() method allows transforming each item in an array by applying a function to it. This returns a new array with the transformed values, without mutating the original.",[20,32,33],{},"Here's an example doubling some numbers in JavaScript:",[35,36,41],"pre",{"className":37,"code":38,"language":39,"meta":40,"style":40},"language-js shiki shiki-themes github-light github-dark-default","const numbers = [1, 2, 3, 4, 5];\n\nconst doubled = numbers.map(x => x * 2);\n\n\u002F\u002F doubled is [2, 4, 6, 8, 10]\n","js","",[42,43,44,91,98,137,142],"code",{"__ignoreMap":40},[45,46,49,53,57,60,64,67,70,73,75,78,80,83,85,88],"span",{"class":47,"line":48},"line",1,[45,50,52],{"class":51},"sDgYj","const",[45,54,56],{"class":55},"sPgVT"," numbers",[45,58,59],{"class":51}," =",[45,61,63],{"class":62},"szmH1"," [",[45,65,66],{"class":55},"1",[45,68,69],{"class":62},", ",[45,71,72],{"class":55},"2",[45,74,69],{"class":62},[45,76,77],{"class":55},"3",[45,79,69],{"class":62},[45,81,82],{"class":55},"4",[45,84,69],{"class":62},[45,86,87],{"class":55},"5",[45,89,90],{"class":62},"];\n",[45,92,94],{"class":47,"line":93},2,[45,95,97],{"emptyLinePlaceholder":96},true,"\n",[45,99,101,103,106,108,111,115,118,122,125,128,131,134],{"class":47,"line":100},3,[45,102,52],{"class":51},[45,104,105],{"class":55}," doubled",[45,107,59],{"class":51},[45,109,110],{"class":62}," numbers.",[45,112,114],{"class":113},"sVjZL","map",[45,116,117],{"class":62},"(",[45,119,121],{"class":120},"sjlk-","x",[45,123,124],{"class":51}," =>",[45,126,127],{"class":62}," x ",[45,129,130],{"class":51},"*",[45,132,133],{"class":55}," 2",[45,135,136],{"class":62},");\n",[45,138,140],{"class":47,"line":139},4,[45,141,97],{"emptyLinePlaceholder":96},[45,143,145],{"class":47,"line":144},5,[45,146,148],{"class":147},"sPyeA","\u002F\u002F doubled is [2, 4, 6, 8, 10]\n",[20,150,151],{},"And doing the same operation in Python:",[35,153,157],{"className":154,"code":155,"language":156,"meta":40,"style":40},"language-py shiki shiki-themes github-light github-dark-default","numbers = [1, 2, 3, 4, 5]\n\ndoubled = list(map(lambda x: x*2, numbers))\n\n# doubled is [2, 4, 6, 8, 10]  \n","py",[42,158,159,190,194,223,227],{"__ignoreMap":40},[45,160,161,164,167,169,171,173,175,177,179,181,183,185,187],{"class":47,"line":48},[45,162,163],{"class":62},"numbers ",[45,165,166],{"class":51},"=",[45,168,63],{"class":62},[45,170,66],{"class":55},[45,172,69],{"class":62},[45,174,72],{"class":55},[45,176,69],{"class":62},[45,178,77],{"class":55},[45,180,69],{"class":62},[45,182,82],{"class":55},[45,184,69],{"class":62},[45,186,87],{"class":55},[45,188,189],{"class":62},"]\n",[45,191,192],{"class":47,"line":93},[45,193,97],{"emptyLinePlaceholder":96},[45,195,196,199,201,204,206,208,210,213,216,218,220],{"class":47,"line":100},[45,197,198],{"class":62},"doubled ",[45,200,166],{"class":51},[45,202,203],{"class":55}," list",[45,205,117],{"class":62},[45,207,114],{"class":55},[45,209,117],{"class":62},[45,211,212],{"class":51},"lambda",[45,214,215],{"class":62}," x: x",[45,217,130],{"class":51},[45,219,72],{"class":55},[45,221,222],{"class":62},", numbers))\n",[45,224,225],{"class":47,"line":139},[45,226,97],{"emptyLinePlaceholder":96},[45,228,229],{"class":47,"line":144},[45,230,231],{"class":147},"# doubled is [2, 4, 6, 8, 10]\n",[20,233,234],{},"Map makes it easy to re-shape data without causing side effects elsewhere in your code.",[24,236,238],{"id":237},"reduce-for-combining-data","Reduce for Combining Data",[20,240,241],{},"The reduce() method combines all the items in an array into a single value, by repeatedly applying a function. This is great for aggregating data.",[20,243,244],{},"Here's an example summing an array of numbers in JavaScript:",[35,246,248],{"className":37,"code":247,"language":39,"meta":40,"style":40},"const numbers = [1, 2, 3, 4, 5];\n\nconst sum = numbers.reduce((acc, x) => acc + x, 0); \n\n\u002F\u002F sum is 15\n",[42,249,250,280,284,329,333],{"__ignoreMap":40},[45,251,252,254,256,258,260,262,264,266,268,270,272,274,276,278],{"class":47,"line":48},[45,253,52],{"class":51},[45,255,56],{"class":55},[45,257,59],{"class":51},[45,259,63],{"class":62},[45,261,66],{"class":55},[45,263,69],{"class":62},[45,265,72],{"class":55},[45,267,69],{"class":62},[45,269,77],{"class":55},[45,271,69],{"class":62},[45,273,82],{"class":55},[45,275,69],{"class":62},[45,277,87],{"class":55},[45,279,90],{"class":62},[45,281,282],{"class":47,"line":93},[45,283,97],{"emptyLinePlaceholder":96},[45,285,286,288,291,293,295,298,301,304,306,308,311,314,317,320,323,326],{"class":47,"line":100},[45,287,52],{"class":51},[45,289,290],{"class":55}," sum",[45,292,59],{"class":51},[45,294,110],{"class":62},[45,296,297],{"class":113},"reduce",[45,299,300],{"class":62},"((",[45,302,303],{"class":120},"acc",[45,305,69],{"class":62},[45,307,121],{"class":120},[45,309,310],{"class":62},") ",[45,312,313],{"class":51},"=>",[45,315,316],{"class":62}," acc ",[45,318,319],{"class":51},"+",[45,321,322],{"class":62}," x, ",[45,324,325],{"class":55},"0",[45,327,328],{"class":62},"); \n",[45,330,331],{"class":47,"line":139},[45,332,97],{"emptyLinePlaceholder":96},[45,334,335],{"class":47,"line":144},[45,336,337],{"class":147},"\u002F\u002F sum is 15\n",[20,339,340],{},"And the same operation in Python:",[35,342,344],{"className":154,"code":343,"language":156,"meta":40,"style":40},"from functools import reduce\n\nnumbers = [1, 2, 3, 4, 5]\n\nsum = reduce(lambda acc, x: acc + x, numbers)\n\n# sum is 15\n",[42,345,346,360,364,392,396,418,423],{"__ignoreMap":40},[45,347,348,351,354,357],{"class":47,"line":48},[45,349,350],{"class":51},"from",[45,352,353],{"class":62}," functools ",[45,355,356],{"class":51},"import",[45,358,359],{"class":120}," reduce\n",[45,361,362],{"class":47,"line":93},[45,363,97],{"emptyLinePlaceholder":96},[45,365,366,368,370,372,374,376,378,380,382,384,386,388,390],{"class":47,"line":100},[45,367,163],{"class":62},[45,369,166],{"class":51},[45,371,63],{"class":62},[45,373,66],{"class":55},[45,375,69],{"class":62},[45,377,72],{"class":55},[45,379,69],{"class":62},[45,381,77],{"class":55},[45,383,69],{"class":62},[45,385,82],{"class":55},[45,387,69],{"class":62},[45,389,87],{"class":55},[45,391,189],{"class":62},[45,393,394],{"class":47,"line":139},[45,395,97],{"emptyLinePlaceholder":96},[45,397,398,401,403,406,408,410,413,415],{"class":47,"line":144},[45,399,400],{"class":55},"sum",[45,402,59],{"class":51},[45,404,405],{"class":120}," reduce",[45,407,117],{"class":62},[45,409,212],{"class":51},[45,411,412],{"class":62}," acc, x: acc ",[45,414,319],{"class":51},[45,416,417],{"class":62}," x, numbers)\n",[45,419,421],{"class":47,"line":420},6,[45,422,97],{"emptyLinePlaceholder":96},[45,424,426],{"class":47,"line":425},7,[45,427,428],{"class":147},"# sum is 15\n",[20,430,431],{},"Reduce can be used for anything from calculating totals to generating reports.",[24,433,435],{"id":434},"filter-for-selecting-data","Filter for Selecting Data",[20,437,438],{},"The filter() method returns a subset of an array, based on whether the items pass a conditional test. It's useful for filtering out unwanted values.",[20,440,441],{},"Here's an example getting only even numbers from an array in JavaScript:",[35,443,445],{"className":37,"code":444,"language":39,"meta":40,"style":40},"const numbers = [1, 2, 3, 4, 5];\n\nconst evens = numbers.filter(x => x % 2 === 0); \n\n\u002F\u002F evens is [2, 4]\n",[42,446,447,477,481,516,520],{"__ignoreMap":40},[45,448,449,451,453,455,457,459,461,463,465,467,469,471,473,475],{"class":47,"line":48},[45,450,52],{"class":51},[45,452,56],{"class":55},[45,454,59],{"class":51},[45,456,63],{"class":62},[45,458,66],{"class":55},[45,460,69],{"class":62},[45,462,72],{"class":55},[45,464,69],{"class":62},[45,466,77],{"class":55},[45,468,69],{"class":62},[45,470,82],{"class":55},[45,472,69],{"class":62},[45,474,87],{"class":55},[45,476,90],{"class":62},[45,478,479],{"class":47,"line":93},[45,480,97],{"emptyLinePlaceholder":96},[45,482,483,485,488,490,492,495,497,499,501,503,506,508,511,514],{"class":47,"line":100},[45,484,52],{"class":51},[45,486,487],{"class":55}," evens",[45,489,59],{"class":51},[45,491,110],{"class":62},[45,493,494],{"class":113},"filter",[45,496,117],{"class":62},[45,498,121],{"class":120},[45,500,124],{"class":51},[45,502,127],{"class":62},[45,504,505],{"class":51},"%",[45,507,133],{"class":55},[45,509,510],{"class":51}," ===",[45,512,513],{"class":55}," 0",[45,515,328],{"class":62},[45,517,518],{"class":47,"line":139},[45,519,97],{"emptyLinePlaceholder":96},[45,521,522],{"class":47,"line":144},[45,523,524],{"class":147},"\u002F\u002F evens is [2, 4]\n",[20,526,527],{},"And in Python:",[35,529,531],{"className":154,"code":530,"language":156,"meta":40,"style":40},"numbers = [1, 2, 3, 4, 5]\n\nevens = list(filter(lambda x: x % 2 == 0, numbers))\n\n# evens is [2, 4] \n",[42,532,533,561,565,596,600],{"__ignoreMap":40},[45,534,535,537,539,541,543,545,547,549,551,553,555,557,559],{"class":47,"line":48},[45,536,163],{"class":62},[45,538,166],{"class":51},[45,540,63],{"class":62},[45,542,66],{"class":55},[45,544,69],{"class":62},[45,546,72],{"class":55},[45,548,69],{"class":62},[45,550,77],{"class":55},[45,552,69],{"class":62},[45,554,82],{"class":55},[45,556,69],{"class":62},[45,558,87],{"class":55},[45,560,189],{"class":62},[45,562,563],{"class":47,"line":93},[45,564,97],{"emptyLinePlaceholder":96},[45,566,567,570,572,574,576,578,580,582,585,587,589,592,594],{"class":47,"line":100},[45,568,569],{"class":62},"evens ",[45,571,166],{"class":51},[45,573,203],{"class":55},[45,575,117],{"class":62},[45,577,494],{"class":55},[45,579,117],{"class":62},[45,581,212],{"class":51},[45,583,584],{"class":62}," x: x ",[45,586,505],{"class":51},[45,588,133],{"class":55},[45,590,591],{"class":51}," ==",[45,593,513],{"class":55},[45,595,222],{"class":62},[45,597,598],{"class":47,"line":139},[45,599,97],{"emptyLinePlaceholder":96},[45,601,602],{"class":47,"line":144},[45,603,604],{"class":147},"# evens is [2, 4]\n",[20,606,607],{},"Filter gives you an easy way to narrow down arrays to only the data you need.",[24,609,611],{"id":610},"chaining-for-data-pipelines","Chaining for Data Pipelines",[20,613,614],{},"The real power comes when you combine these methods to transform, combine and filter data in a pipeline:",[35,616,618],{"className":37,"code":617,"language":39,"meta":40,"style":40},"const numbers = [1, 2, 3, 4, 5];\n\nconst pipeline = numbers\n  .map(x => x * 2)\n  .filter(x => x % 4 === 0) \n  .reduce((acc, x) => acc + x, 0);\n  \n\u002F\u002F pipeline is 12\n",[42,619,620,650,654,666,688,714,742,747],{"__ignoreMap":40},[45,621,622,624,626,628,630,632,634,636,638,640,642,644,646,648],{"class":47,"line":48},[45,623,52],{"class":51},[45,625,56],{"class":55},[45,627,59],{"class":51},[45,629,63],{"class":62},[45,631,66],{"class":55},[45,633,69],{"class":62},[45,635,72],{"class":55},[45,637,69],{"class":62},[45,639,77],{"class":55},[45,641,69],{"class":62},[45,643,82],{"class":55},[45,645,69],{"class":62},[45,647,87],{"class":55},[45,649,90],{"class":62},[45,651,652],{"class":47,"line":93},[45,653,97],{"emptyLinePlaceholder":96},[45,655,656,658,661,663],{"class":47,"line":100},[45,657,52],{"class":51},[45,659,660],{"class":55}," pipeline",[45,662,59],{"class":51},[45,664,665],{"class":62}," numbers\n",[45,667,668,671,673,675,677,679,681,683,685],{"class":47,"line":139},[45,669,670],{"class":62},"  .",[45,672,114],{"class":113},[45,674,117],{"class":62},[45,676,121],{"class":120},[45,678,124],{"class":51},[45,680,127],{"class":62},[45,682,130],{"class":51},[45,684,133],{"class":55},[45,686,687],{"class":62},")\n",[45,689,690,692,694,696,698,700,702,704,707,709,711],{"class":47,"line":144},[45,691,670],{"class":62},[45,693,494],{"class":113},[45,695,117],{"class":62},[45,697,121],{"class":120},[45,699,124],{"class":51},[45,701,127],{"class":62},[45,703,505],{"class":51},[45,705,706],{"class":55}," 4",[45,708,510],{"class":51},[45,710,513],{"class":55},[45,712,713],{"class":62},") \n",[45,715,716,718,720,722,724,726,728,730,732,734,736,738,740],{"class":47,"line":420},[45,717,670],{"class":62},[45,719,297],{"class":113},[45,721,300],{"class":62},[45,723,303],{"class":120},[45,725,69],{"class":62},[45,727,121],{"class":120},[45,729,310],{"class":62},[45,731,313],{"class":51},[45,733,316],{"class":62},[45,735,319],{"class":51},[45,737,322],{"class":62},[45,739,325],{"class":55},[45,741,136],{"class":62},[45,743,744],{"class":47,"line":425},[45,745,746],{"class":62},"  \n",[45,748,750],{"class":47,"line":749},8,[45,751,752],{"class":147},"\u002F\u002F pipeline is 12\n",[20,754,755],{},"This allows declaratively operating on data for cleaner and more readable code.",[20,757,758],{},"Leveraging map(), reduce() and filter() can help simplify your code and make it more understandable and maintainable.",[760,761,762],"style",{},"html pre.shiki code .sDgYj, html code.shiki .sDgYj{--shiki-default:#D73A49;--shiki-dark:#FF7B72}html pre.shiki code .sPgVT, html code.shiki .sPgVT{--shiki-default:#005CC5;--shiki-dark:#79C0FF}html pre.shiki code .szmH1, html code.shiki .szmH1{--shiki-default:#24292E;--shiki-dark:#E6EDF3}html pre.shiki code .sVjZL, html code.shiki .sVjZL{--shiki-default:#6F42C1;--shiki-dark:#D2A8FF}html pre.shiki code .sjlk-, html code.shiki .sjlk-{--shiki-default:#E36209;--shiki-dark:#FFA657}html pre.shiki code .sPyeA, html code.shiki .sPyeA{--shiki-default:#6A737D;--shiki-dark:#8B949E}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":40,"searchDepth":93,"depth":93,"links":764},[765,766,767,768],{"id":26,"depth":93,"text":27},{"id":237,"depth":93,"text":238},{"id":434,"depth":93,"text":435},{"id":610,"depth":93,"text":611},"2023-07-21","md",{"type":772,"layout":773},"post","blog_page","\u002Fblog\u002F2023-07-21-map-reduce-filter",{"title":12,"description":22},"blog\u002F2023-07-21-map-reduce-filter",[778,779,780],"programming","javascript","python","Jrt7gFcg4NdRR16Tu8kB-CO0z9ZMrPIz0kGEp8H7gak",[783,788],{"title":784,"path":785,"stem":786,"date":787,"children":-1},"Is a string an anagram?","\u002Fblog\u002F2023-01-14-anagram","blog\u002F2023-01-14-anagram","2023-01-14",{"title":789,"path":790,"stem":791,"date":792,"children":-1},"Solving FizzBuzz in Python and JavaScript","\u002Fblog\u002F2023-08-14-fizzbuzzin-py-and-js","blog\u002F2023-08-14-fizzbuzzin-py-and-js","2023-08-14",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":794},"\u003Cpath fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"m12 19l-7-7l7-7m7 7H5\"\u002F>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":796},"\u003Cg fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\">\u003Cpath d=\"M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594zM20 2v4m2-2h-4\"\u002F>\u003Ccircle cx=\"4\" cy=\"20\" r=\"2\"\u002F>\u003C\u002Fg>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":798},"\u003Cg fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\">\u003Cpath d=\"M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2\"\u002F>\u003Ccircle cx=\"12\" cy=\"7\" r=\"4\"\u002F>\u003C\u002Fg>",1783616165944]