Biblioteki poprzez domknięcia w JavaScript

Często w JavaScript tworzone są biblioteki, które reprezentują zestawy funkcji do użytku przez innych programistów.

Takie biblioteki są zwykle opakowywane w moduły poprzez domknięcia. Robi się to po to, aby po podłączeniu biblioteki na zewnątrz pojawiało się jak najmniej funkcji.

Z reguły każda biblioteka stara się tworzyć na zewnątrz tylko jedną zmienną - obiekt z funkcjami biblioteki. Jednocześnie wewnątrz w kodzie biblioteki część funkcji jest podstawowa, a część - pomocnicza. Oczywiście, na zewnątrz chcemy eksportować tylko potrzebne funkcje, nie zaśmiecając eksportowanego obiektu funkcjami pomocniczymi.

Spójrzmy na przykład. Załóżmy, że mamy następujący zestaw funkcji, które chcielibyśmy przekształcić w bibliotekę:

function square(num) {
	return num ** 2;
}
function cube(num) {
	return num ** 3;
}
function avg(arr) {
	return sum(arr, 1) / arr.length;
}
function digitsSum(num) {
	return sum(String(num).split(''));
}

// funkcja pomocnicza
function sum(arr) {
	let res = 0;
	
	for (let elem of arr) {
		res += +elem;
	}
	
	return res;
}

Opakujmy nasze funkcje w formie modułu:

;(function() {
	function square(num) {
		return num ** 2;
	}
	function cube(num) {
		return num ** 3;
	}
	function avg(arr) {
		return sum(arr, 1) / arr.length;
	}
	function digitsSum(num) {
		return sum(String(num).split(''));
	}
	
	// funkcja pomocnicza
	function sum(arr) {
		let res = 0;
		
		for (let elem of arr) {
			res += +elem;
		}
		
		return res;
	}
})();

A teraz wyeksportujmy wszystkie funkcje, z wyjątkiem pomocniczej:

;(function() {
	function square(num) {
		return num ** 2;
	}
	function cube(num) {
		return num ** 3;
	}
	function avg(arr) {
		return sum(arr, 1) / arr.length;
	}
	function digitsSum(num) {
		return sum(String(num).split(''));
	}
	
	// funkcja pomocnicza
	function sum(arr) {
		let res = 0;
		
		for (let elem of arr) {
			res += +elem;
		}
		
		return res;
	}
	
	window.math = {square, cube, avg, digitsSum};
})();

Załóżmy, że mamy stronę HTML index.html:

<html>
	<head>
		<script>
			
		</script>
	</head>
</html>

Podłączmy do niej naszą bibliotekę:

<html>
	<head>
		<script src="math.js"></script>
		<script>
			
		</script>
	</head>
</html>

Skorzystajmy z funkcji z naszej biblioteki:

<html>
	<head>
		<script src="math.js"></script>
		<script>
			alert(math.avg([1, 2, 3]) + math.square());
		</script>
	</head>
</html>

Dany jest następujący kod:

function avg1(arr) {
	return sum(arr, 1) / arr.length;
}

function avg2(arr) {
	return sum(arr, 2) / arr.length;
}

function avg3(arr) {
	return sum(arr, 3) / arr.length;
}

// funkcja pomocnicza
function sum(arr, pow) {
	let res = 0;
	
	for (let elem of arr) {
		res += elem ** pow;
	}
	
	return res;
}

Opakuj ten kod w formę modułu. Wyeksportuj na zewnątrz wszystkie funkcje, z wyjątkiem pomocniczej.

Zapoznaj się z biblioteką underscore. Stwórz swoją podobną bibliotekę, powtarzając w niej 5-10 funkcji oryginalnej biblioteki.