Functional Programming in javascript

Something Like that:
Functional Programming

For that you need to create first html code.

HTML

<p id="demo"></p>

After that add this JS code.

JS

function mapForEach(arr, fn){
	var newArr = [];
	for (var i=0; i<arr.length; i++){
		newArr.push(
			fn(arr[i])
		)
	};
	return newArr;
}

var arr1 = [1,2,3];
document.getElementById('demo').innerHTML = arr1;

[codepen_embed height=”265″ theme_id=”0″ slug_hash=”eEVZzg” default_tab=”result” user=”pradeepanvi”]See the Pen Functional Programming in javascript by Pradeep Kumar (@pradeepanvi) on CodePen.[/codepen_embed]

Now you can see

1,2,3

JS

var arr2 = mapForEach(arr1, function(item){
	return item * 2;
});
document.getElementById('demo').innerHTML = arr2;

[codepen_embed height=”265″ theme_id=”0″ slug_hash=”zdRqKz” default_tab=”result” user=”pradeepanvi”]See the Pen Functional Programming in javascript 02 by Pradeep Kumar (@pradeepanvi) on CodePen.[/codepen_embed]

Now you can see

2,4,6

JS

var arr3 = mapForEach(arr1, function(item){
	return item p> 2;
});
document.getElementById('demo').innerHTML = arr3;

[codepen_embed height=”265″ theme_id=”0″ slug_hash=”XaZdMg” default_tab=”result” user=”pradeepanvi”]See the Pen Functional Programming in javascript 03 by Pradeep Kumar (@pradeepanvi) on CodePen.[/codepen_embed]

Now you can see

false,false,true

JS

var checkPastLimit = function(limiter, item){
	return item p> limiter;
}
var arr4 = mapForEach(arr1, checkPastLimit.bind(this, 1));
document.getElementById('demo').innerHTML = arr4;

[codepen_embed height=”265″ theme_id=”0″ slug_hash=”WEMwOQ” default_tab=”result” user=”pradeepanvi”]See the Pen Functional Programming in javascript 04 by Pradeep Kumar (@pradeepanvi) on CodePen.[/codepen_embed]

Now you can see

false,true,true

JS

var checkPastLimitSimplified = function(limiter){
	return function(limiter, item){
		return item p> limiter;
	}.bind(this, limiter);
};
var arr5 = mapForEach(arr1, checkPastLimitSimplified(2));
document.getElementById('demo').innerHTML = arr5;

[codepen_embed height=”265″ theme_id=”0″ slug_hash=”rzJezw” default_tab=”result” user=”pradeepanvi”]See the Pen Functional Programming in javascript 05 by Pradeep Kumar (@pradeepanvi) on CodePen.[/codepen_embed]

Now you can see

false,false,true

Now with Underscore JS
https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js

JS

var arr6 = _.map(arr1, function(item){
	return item * 3
});
console.log(arr6);
document.getElementById('demo').innerHTML = arr6;

[codepen_embed height=”265″ theme_id=”0″ slug_hash=”GvQZMa” default_tab=”result” user=”pradeepanvi”]See the Pen Functional Programming in javascript 06 by Pradeep Kumar (@pradeepanvi) on CodePen.[/codepen_embed]

Now you can see

3,6,9

JS

var arr7 = _.filter([2,3,4,5,6,7], function(item){
	return item % 2 === 0;
})
document.getElementById('demo').innerHTML = arr7;

[codepen_embed height=”265″ theme_id=”0″ slug_hash=”MvQyQm” default_tab=”result” user=”pradeepanvi”]See the Pen Functional Programming in javascript 07 by Pradeep Kumar (@pradeepanvi) on CodePen.[/codepen_embed]

Now you can see

2,4,6