Die Oordrag van Parameters na 'n Module deur Sluitings in JavaScript
Dit word as 'n goeie praktyk beskou om nie sekere waardes in 'n module vas te lê nie, maar om dit as 'n parameter van die module self oor te dra (dit wil sê, as 'n parameter van die onmiddellik-opgeroep funksie):
;(function(arg1, arg2) { // parameters beland in veranderlikes
})(1, 2); // gee sekere parameters oor
Kom ons kyk na 'n voorbeeld. Gestel ons het 'n div met 'n nommer en 'n knoppie:
<div id="div">3</div>
<button id="btn">click me</button>
Gestel ons het ook 'n sekere module:
;(function() {
let div = document.querySelector('#div');
let btn = document.querySelector('#btn');
function func(num) {
return num * num;
}
btn.addEventListener('click', function() {
div.textContent = func(div.textContent);
});
})();
Soos jy kan sien, is die selekteerders van ons elemente styf vasgelê in die module se kode. 'n Beter oplossing sal wees om dit as parameters van die module oor te dra - so kan ons dit maklik in die toekoms verander. Laat ons ons module regstel:
;(function(selector1, selector2) {
let div = document.querySelector(selector1);
let btn = document.querySelector(selector2);
function func(num) {
return num * num;
}
btn.addEventListener('click', function() {
div.textContent = func(div.textContent);
});
})('#div', '#btn');
Gegee 'n knoppie en drie invoervelde, waarin getalle ingevoer word. Met 'n klik op die knoppie, druk die som van die ingevoerde getalle in die konsole uit. Implementeer die taak met behulp van 'n module.
