Heim > Web-Frontend > js-Tutorial > Funktionsfunktion in JavaScript

Funktionsfunktion in JavaScript

PHPz
Freigeben: 2018-09-29 09:49:37
Original
5188 Leute haben es durchsucht

Eine Funktion ist ein wiederverwendbarer Codeblock, der ereignisgesteuert ist oder ausgeführt wird, wenn er aufgerufen wird. Folgen Sie dem Editor, um die Funktion in JavaScript zu lernen. Machen Sie mit lernen

Zunächst stelle ich Ihnen verschiedene Möglichkeiten vor, Funktionen in JavaScript zu definieren:

1. Die grundlegendste Funktion wird als separate Funktionsdeklaration verwendet.

Der Code lautet wie folgt:

function func(){
Nach dem Login kopieren

oder

var func=function(){}
Nach dem Login kopieren

2. Verwendung als Klassenkonstruktor:

function class(){}
class.prototype={};
var item=new class();
Nach dem Login kopieren

3. Verwendung als Abschluss:

(function(){
//独立作用域
})();
Nach dem Login kopieren

4 :

var addEvent=new function(){
   if(!-[1,]) 
      return  function(elem,type,func){
         attachEvent(elem,'on'+type,func);
      };
   else 
      return function(elem,type,func){
          addEventListener(elem,type,func,false);
      }
};//避免了重复判断
Nach dem Login kopieren

5. Gemischte Anwendung der oben genannten vier Situationen:

var class=new function(){
var privateArg;//静态私有变量
function privateMethod=function(){};//静态私有方法
return function(){/*真正的构造器*
Nach dem Login kopieren

Typen von JavaScript-Funktionen: Einführung in gewöhnliche Funktionen, anonyme Funktionen und Abschlussfunktionen

1. Einführung in gewöhnliche Funktionen

1.1 Beispiel

function ShowName(name) {
 alert(name);
}
Nach dem Login kopieren

1.2 Abdeckung von Funktionen mit demselben Namen in Js

In Js werden Funktionen mit demselben und unterschiedlichen Funktionsnamen nicht überladen Parametersignaturen und die folgenden Funktionen überschreiben die vorherige Funktion. Beim Aufruf werden nur die folgenden Funktionen aufgerufen.

var n1 = 1;
function add(value1) {
 return n1 + 1;
}
alert(add(n1));//调用的是下面的函数,输出:3
function add(value1, value2) {
 return value1 + 2;
}
alert(add(n1));//输出:3
Nach dem Login kopieren

1.3 Argumente Objekt

Argumente ähneln C#s Parametern, Betriebsvariablenparametern: Die Anzahl der an die Funktion übergebenen Parameter ist größer als die Parameter, als die Menge definiert wurde.

function showNames(name) {
 alert(name);//张三
 for (var i = 0; i < arguments.length; i++) {
  alert(arguments[i]);//张三、李四、王五
 }
}
showNames(&#39;张三&#39;,&#39;李四&#39;,&#39;王五&#39;);
Nach dem Login kopieren

1.4 Standardbereichswert der Funktion

Wenn die Funktion keinen Rückgabewert angibt, ist der Standardrückgabewert „undefiniert“

function showMsg() {
}
alert(showMsg());//输出:undefined
Nach dem Login kopieren

2. Anonyme Funktion

2.1 Variable anonyme Funktion

2.1.1 Beschreibung

Funktionen können Variablen und Ereignissen zugewiesen werden.

2.1.2 Beispiel

//变量匿名函数,左侧可以为变量、事件等
var anonymousNormal = function (p1, p2) {
 alert(p1+p2);
}
anonymousNormal(3,6);//输出9
Nach dem Login kopieren

2.1.3 Anwendbare Szenarien

①Vermeiden Sie die Verschmutzung von Funktionsnamen. Wenn Sie zunächst eine Funktion mit einem Namen deklarieren und diese dann einer Variablen oder einem Ereignis zuweisen, missbrauchen Sie den Funktionsnamen.

2.2 Unbenannte anonyme Funktion

2.2.1 Beschreibung
gibt an, wann die Funktion deklariert wird, gefolgt von den Parametern. Wenn die JS-Syntax diese Funktion analysiert, wird der darin enthaltene Code sofort ausgeführt.

2.2.2 Beispiel

(function (p1) {
 alert(p1);
})(1);
Nach dem Login kopieren

2.2.3 Anwendbares Szenario

①Es muss nur einmal ausgeführt werden. Wenn der Browser geladen ist, muss die Funktion nur einmal ausgeführt werden und wird später nicht ausgeführt.

3. Abschlussfunktion

3.1 Beschreibung

Angenommen, Funktion A deklariert eine Funktion B innerhalb und Funktion B referenziert außerhalb von Funktion B. Variable, und der Rückgabewert von Funktion A ist eine Referenz auf Funktion B. Dann ist Funktion B eine Abschlussfunktion.

3.2 Beispiel

3.2.1 Beispiel 1: Globale Referenz und lokale Referenz

function funA() {
 var i = 0;
 function funB() { //闭包函数funB
  i++;
  alert(i)
 }
 return funB;
}
var allShowA = funA(); //全局变量引用:累加输出1,2,3,4等
function partShowA() {
 var showa = funA();//局部变量引用:只输出1
 showa();
}
Nach dem Login kopieren

allShowA ist eine globale Variable und referenziert die Funktion funA . Durch wiederholtes Ausführen von allShowA() werden die akkumulierten Werte von 1, 2, 3, 4 usw. ausgegeben.

Führen Sie die Funktion partShowA() aus, da intern nur die lokale Variable showa als Referenz auf funA deklariert ist. Nach der Ausführung werden die von showa belegten Ressourcen aufgrund des Gültigkeitsbereichs freigegeben.

Der Schlüssel zum Abschluss ist der Umfang: Die von globalen Variablen belegten Ressourcen werden erst freigegeben, wenn die Seite wechselt oder der Browser geschlossen wird. Wenn var allShowA = funA() ist, entspricht dies dem Verweis von allShowA auf funB(), sodass die Ressourcen in funB() nicht von GC recycelt werden, sodass auch die Ressourcen in funA() nicht recycelt werden.

3.2.2 Beispiel 2: Parametrische Abschlussfunktion

function funA(arg1,arg2) {
 var i = 0;
 function funB(step) {
  i = i + step;
  alert(i)
 }
 return funB;
}
var allShowA = funA(2, 3); //调用的是funA arg1=2,arg2=3
allShowA(1);//调用的是funB step=1,输出 1
allShowA(3);//调用的是funB setp=3,输出 4
Nach dem Login kopieren

3.2.3 Beispiel 3: Variablenfreigabe innerhalb der übergeordneten Funktion funA

function funA() {
 var i = 0;
 function funB() {
  i++;
  alert(i)
 }
 allShowC = function () {// allShowC引用匿名函数,与funB共享变量i
  i++;
  alert(i)
 }
 return funB;
}
var allShowA = funA();
var allShowB = funA();//allShowB引用了funA,allShowC在内部重新进行了绑定,与allShowB共享变量i
Nach dem Login kopieren

3.3 Anwendbare Szenarien

Gewährleisten Sie die Sicherheit von Variablen innerhalb der Funktion funA, da auf die Variablen von funA nicht direkt von außen zugegriffen werden kann.

Der obige Inhalt ist die Einführung dieses Artikels in die Funktion function in js. Weitere verwandte Tutorials finden Sie unter JavaScript-Video-Tutorial!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage