Einführung in die Verwendung von Javascript-Funktionen höherer Ordnung

Einführung in die Verwendung von Javascript-Funktionen höherer Ordnung_Javascript-Kenntnisse

WBOY

Freigeben： 2016-05-16 15:55:00

Original

1327 Leute haben es durchsucht

Funktion höherer Ordnung – Wenn eine Funktion Parameter empfängt oder eine Funktion zurückgibt, können wir diese Funktion eine Funktion höherer Ordnung nennen. Wie wir alle wissen, ist JavaScript eine schwach typisierte Sprache: JavaScript-Funktionen definieren oder prüfen die Eingabeparameter oder Ausgabewerte der Funktion nicht streng. Dann kann die Funktion zu einem Parameter oder Ausgabewert werden, der den JavaScript-Nativ verkörpert Unterstützung für Funktionen höherer Ordnung.

1. Funktionen höherer Ordnung, deren Parameter Funktionen sind:

function funcTest(f){  
//简易判断一下实参是否为函数
if((typeof f)==”function”){
f();
}}
funcTest(function(){ });

Nach dem Login kopieren

Dies ist eine einfache Funktion höherer Ordnung, die Parameter als Funktionen akzeptiert. Geben Sie beim Aufruf von funcTest eine Funktion als Parameter ein und führen Sie die eingegebene anonyme Funktion in funcTest aus. Natürlich hat ein solcher Codeausschnitt keine praktische Bedeutung.

1. Funktionen höherer Ordnung, deren Rückgabewerte Funktionen sind:

function funcTest(){
return function(){};
}
var f=funcTest();

Nach dem Login kopieren

Der Aufruf von funcTest gibt eine Funktion zurück.

2. Ein komplizierteres Beispiel:

//Number类型相加  
function addInt(a,b){
return parseInt(a)+parseInt(b);
 }
//String类型相加
function addString(a,b){
return a.toString()+ b.toString(); 
}  
function add(type){
if(type==="string"){
return addString;
}else{
return addInt; 
}
}
var data1=add("string")("1","2");
//12
var data2=add("int")("1","2");
//3

Nach dem Login kopieren

Das obige Beispiel implementiert die Trennung von String-Typ-Addition und Number-Typ-Addition. Wenn die Add-Funktion aufgerufen wird und der Eingabeparameter „string“ ist, wird eine String-Splicing-Funktion ausgegeben. Wenn der Eingabeparameter „int“ ist, wird eine digitale Additionsfunktion ausgegeben.

3. Die tatsächliche Rolle von Funktionen höherer Ordnung:

Das obige Codebeispiel erklärt im Grunde, was Funktionen höherer Ordnung sind. Schauen wir uns an, wie Funktionen höherer Ordnung mit unserer tatsächlichen Programmierung zusammenhängen:

1, Rückruffunktion

function callback(value){
alert(value);
}
function funcTest(value,f)
//f实参检测，检查f是否为函数 
if(typeof callback==='function'){
f(value);}}funcTest(‘1',callback);
//1

Nach dem Login kopieren

Das Beispiel ist, dass beim Aufruf von funcTest die Rückruffunktion intern in funcTest aufgerufen wird, das heißt, der Rückruf wird implementiert.

2, Datenüberprüfungs- und Sortieralgorithmus

var arr=[0,2,11,9,7,5];
//排序算法
function funcComp(a,b){
if(a<b){
return -1;
}else if(a>b){
return 1;
}else{
return 0;
}
}
//过滤算法
function funcFilter(item,index,array){
return item>=5;
}
//数组顺序排列
arr.sort(funcComp);
alert(arr.join(','));
//0,2,5,7,9,11
//筛选数组
var arrFilter=arr.filter(funcFilter);
alert(arr.join(‘,'))
//5,7,9,11

Nach dem Login kopieren

3, DOM-Element-Ereignisdefinition

<html><title></title>
<body><input type=”button” value=”ClickMe” id=”myBtn” >
<script type=”text/javascript>
var btnClick=document.getElementById(“myBtn”);
//测试环境为FireFox
btnClick. addEventListener(“click”,function(e){
alert(“I'm a button!”);
//I'm a button},false);
</script>
</body>
</html>

Nach dem Login kopieren

Im obigen Beispiel ist eine Schaltfläche mit der ID myBtn im Dokument definiert und das js-Skript fügt ihr ein Klickereignis hinzu, wobei der zweite Parameter von addEventListener eine Funktion ist.

Fazit: Funktionen höherer Ordnung sind kein Patent von JavaScript, aber sie sind definitiv ein leistungsstarkes Werkzeug für die JavaScript-Programmierung. Funktionen höherer Ordnung sind eigentlich eine Neuabstraktion grundlegender Algorithmen. Wir können dies verwenden, um die Abstraktion des Codes zu verbessern, eine maximale Wiederverwendung des Codes zu erreichen und Code zu schreiben, der einfacher und für die Umgestaltung geeigneter ist.