Heim > Web-Frontend > js-Tutorial > Hauptteil

Lassen Sie uns über die Definition und grundlegende Verwendung von JavaScript-Funktionen sprechen

WBOY
Freigeben: 2022-07-01 11:59:04
nach vorne
1978 Leute haben es durchsucht

Dieser Artikel vermittelt Ihnen relevantes Wissen über Javascript. Er organisiert hauptsächlich Fragen im Zusammenhang mit der Definition und grundlegenden Verwendung von Funktionen, einschließlich Definitionen mithilfe von Funktionsanweisungen, Funktionsaufrufen, undefinierten tatsächlichen Parametern usw. Schauen wir uns das gemeinsam an. Ich hoffe, es wird für alle hilfreich sein.

Lassen Sie uns über die Definition und grundlegende Verwendung von JavaScript-Funktionen sprechen

[Verwandte Empfehlungen: Javascript-Video-Tutorial, Web-Frontend]

1. Verwenden Sie Funktionsanweisungen zum Definieren

Geben Sie zunächst ein Beispiel. Die Funktion dieser Funktion besteht darin, die Summe von zurückzugeben Array-Elemente;

function sumArray(arr) {  
    var sum = 0;  
    for(var i = 0,aLength = arr.length;i < aLength;i++) {  
        sum += arr[i];  
    }  
    return sum;  }
Nach dem Login kopieren

Nach dem Schlüsselwort function steht der Name der Funktion. Die Namenskonvention ist dieselbe wie bei Variablennamen: function后面空一格,sumArray是函数的名字,其命名规范与变量名的命名规范相同:只能有字母、数字、下划线和美元符号,不能以数字开头,不能是关键字。

括号中是参数,又叫形式参数,只需要参数名就可以。参数可以是0个、1个或者多个,相互之间用,隔开,{}中间包含的是函数体。含有一条或者多条语句。函数体用来实现函数的功能。

关键字return后面是函数的返回值,函数也可以没有返回值。函数运行完return这句话这里就会退出运行,return下面的语句不再运行。返回值即函数的输出。

用这种方式定义的函数,在函数定义的前面和后面都可以调用该函数,只要函数和调用函数的语句在一个源文件里面就可以了。

2.用表达式定义

用表达式的方式定义函数,就是用赋值表达式把函数赋值给一个变量,这其实就是把函数看成一个变量。这个时候函数可以有名字,也可以没有名字,没有名字的函数叫做匿名函数

  • 带名字的;
var funct = function getMax(a,b) {  
    return a>b?a:b;  };//注意这后面的分号不能少,因为我们定义的是一个变量!
Nach dem Login kopieren

用函数语句定义不同的是,只能在函数定义语句之后调用该函数,且调用的时候只能用变量名funct,不能用函数名getMax,如:

var funct = function getMax(a,b) {  
    return a>b?a:b;  
};  
console.log(funct(1,2));//输出2
Nach dem Login kopieren
  • 匿名函数;
    所谓匿名函数就是关键字function之后直接是参数列表:
var funct = function(a,b) {  
    return a>b?a:b;  };
Nach dem Login kopieren

这个函数没有名字,它被赋值给了变量funct,所以叫匿名函数。同样,也只能在这一语句之后调用该函数。

var funct = function(a,b) {  
    return a>b?a:b;  };  console.log(funct(1,2));//输出2
Nach dem Login kopieren

总结:用表达式定义函数是即拿即用的,定义了就只能在这一语句之后调用该函数

3.函数的调用

在实训四中,我们曾经介绍过对象可以有自己的方法,当然这也是函数。这种函数的调用和前面两关定义的函数有细小的区别。

//函数的定义:求三个数的最大值  
function max(a,b,c) {  
    if(a > b) {  
        if(a > c)  
            return a;  
        else   
            return c;  
    }  
    else {  
        if(b > c)  
            return b;  
        else   
            return c;  
    }  
}  
//调用该函数  
var result = max(1,2,3);//result为3  
console.log(result);//输出3
Nach dem Login kopieren

调用函数的时候,需要传入和形参相同个数的的具体值,上面的函数有3个参数,所以下面调用的时候传入3个具体的值,1传给参数a2传给参数b3传给参数c。函数的返回值通过赋值符号=传给了变量result。如果函数体内没有return关键字,将返回undefined

对象里定义的函数的调用:

var ob = {  
    id:1,  
    getMax:function(a,b) {  
        return a>b?a:b;  
    }  };  var result = ob.getMax(2,1);//result值为2  var result1 = ob["getMax"](2,1);//result1的值也是2
Nach dem Login kopieren

与上面的区别是,这里要定位到函数,需要使用对象名.函数名或者对象名["函数名"],其它相同。

4.未定义的实参

在大部分的编程语言里面,都会对调用函数时传入的实参个数和类型进行检查,而JavaScript不检查实参的类型,也不检查实参的个数。
JavaScript中的实参会按照顺序从左到右依次匹配上形参,例如:

function myFunction(a,b,c) {  
    console.log(a);  
    console.log(b);  
    console.log(c);  }  myFunction(1,2,3);
Nach dem Login kopieren

实参1传入形参a,实参2传入形参b,实参3传入形参c。 当实参个数少于形参时,靠右的形参会被传入值undefined。如:

function myFunction(a,b,c) {  
    console.log(a);  
    console.log(b);  
    console.log(c);  }  myFunction(1,2);
Nach dem Login kopieren

实参1传入形参a,实参2传入形参bundefined传入形参c。 如果只想给右侧的参数传入数据,可以给前几个实参传入undefined。如:

function myFunction(a,b,c){  console.log(a);  console.log(b);  console.log(c);  }  myFunction(undefined,1,2);
Nach dem Login kopieren

上面这两种做法不够严谨,最佳实践是给可能被传入undefined dürfen nur Buchstaben, Zahlen, Unterstriche und Dollars enthalten. Symbole dürfen nicht mit Zahlen beginnen und dürfen keine Schlüsselwörter sein.

Die Parameter in Klammern werden auch 🎜formale Parameter🎜 genannt. Sie benötigen nur den Parameternamen. Parameter können 0, 1 oder mehr sein, getrennt durch ,, {}. In der Mitte ist das 🎜 enthalten Funktionskörper🎜. Enthält eine oder mehrere Anweisungen. Der Funktionskörper wird verwendet, um die Funktion der Funktion zu implementieren. 🎜🎜Dem Schlüsselwort return folgt der 🎜Rückgabewert🎜 der Funktion. Die Funktion kann auch keinen Rückgabewert haben. Nachdem die Ausführung der Funktion abgeschlossen ist, wird der Satz return hier die Ausführung beenden und die Anweisung 🎜unter return wird nicht mehr ausgeführt🎜. Der Rückgabewert ist die Ausgabe der Funktion. 🎜🎜Eine auf diese Weise definierte Funktion kann 🎜 entweder vor oder nach der Funktionsdefinition aufgerufen werden, solange sich die Funktion und die Anweisung, die die Funktion aufruft, in derselben Quelldatei befinden. 🎜🎜2. Mithilfe von Ausdrücken definieren🎜🎜 Eine Funktion mithilfe von Ausdrücken definieren bedeutet, die Funktion mithilfe von Zuweisungsausdrücken einer Variablen zuzuweisen. Dies bedeutet, dass die Funktion tatsächlich als Variable behandelt wird. Zu diesem Zeitpunkt kann die Funktion einen Namen oder keinen Namen haben. Die Funktion ohne Namen wird als „anonyme Funktion“ bezeichnet. 🎜
  • Named;
function getSum(a,b,c) {  
    if(c === undefined)   
        c = 0;  
    console.log(a+b+c);  }  myFunction(1,2);
Nach dem Login kopieren
🎜 und 🎜 werden mit Funktionsanweisungen🎜 definiert. Der Unterschied besteht darin, dass die Funktion nur nach der 🎜Funktionsdefinitionsanweisung🎜 und nur beim Aufruf von You aufgerufen werden kann kann den Variablennamen 🎜funct verwenden, aber Sie können nicht den Funktionsnamen getMax verwenden, wie zum Beispiel: 🎜
//求参数的和  function getSum() {  
    var aLength = arguments.length;  
    var sum = 0;  
    for(var i = 0;i < aLength;i++) {  
        sum += arguments[i];  
    }  
    return sum;  }  console.log(getSum(1,2,3,4,5))//输出15
Nach dem Login kopieren
  • Anonyme Funktion 🎜 Die sogenannte anonyme Funktion ist das Schlüsselwort function ist die Parameterliste:
function myFunction(obj) {  
    console.log(obj.name);  
    obj.number++;  
    return obj.number;  }  myObj = {name:"myObj",number:34};  myFunction(myObj);//输出myObj  console.log(myObj.number);//输出35
Nach dem Login kopieren
Nach dem Login kopieren
🎜Diese Funktion hat keinen Namen. Sie ist der Variablen funct zugewiesen Daher wird sie als anonyme Funktion bezeichnet. Ebenso kann 🎜 diese Funktion erst nach dieser Anweisung aufrufen. 🎜🎜
//求最大值  function getMax(a,b) {  
    return a>b?a:b;  }  //求最小值  function getMin(a,b) {  
    return a<b?a:b;  }  //下面这个函数以函数作为参数,并最终返回一个值  function getM(func,num1,num2) {  
    return func(num1,num2);  }  getM(getMax,1,2);//返回2  getM(getMin,1,2);//返回1
Nach dem Login kopieren
🎜🎜Zusammenfassung: Das Definieren einer Funktion mit einem Ausdruck ist einsatzbereit. Sobald die Funktion definiert ist, kann sie erst nach dieser Anweisung aufgerufen werden. 🎜🎜🎜3. Im vierten Training haben wir es getan eingeführt, dass Objekte ihre eigenen Methoden haben können, und das sind natürlich auch Funktionen. Der Aufruf dieser Funktion unterscheidet sich geringfügig von den in den beiden vorherigen Ebenen definierten Funktionen. 🎜rrreee🎜Wenn Sie eine Funktion aufrufen, müssen Sie die gleiche Anzahl spezifischer Werte wie die formalen Parameter übergeben. Die obige Funktion hat 3-Parameter. Wenn Sie also unten aufrufen, übergeben Sie 3</ code> ein bestimmter Wert, <code>1 wird an Parameter a übergeben, 2 wird an Parameter b übergeben , 3 wird an Parameter c übergeben. Der Rückgabewert der Funktion wird über das Zuweisungssymbol = an die Variable result übergeben. Wenn im Funktionskörper kein Schlüsselwort return vorhanden ist, wird undefined zurückgegeben. 🎜🎜Aufruf der im Objekt definierten Funktionen: 🎜rrreee🎜Der Unterschied zu oben besteht darin, dass Sie zum Auffinden der Funktion hier object name.function name oder object name[" verwenden müssen. Funktionsname" ], die anderen sind gleich. 🎜🎜4. Undefinierte Aktualparameter🎜🎜In den meisten Programmiersprachen werden die Anzahl und der Typ der Aktualparameter überprüft, die beim Aufruf einer Funktion übergeben werden, aber JavaScript 🎜überprüft nicht den Typ der Aktualparameter wird nicht überprüft, ebenso wenig wie die Anzahl der tatsächlichen Parameter. 🎜Die tatsächlichen Parameter in JavaScript stimmen mit den formalen Parametern in der Reihenfolge 🎜von links nach rechts🎜 überein, zum Beispiel: 🎜rrreee🎜Die tatsächlichen Parameter 1 werden in den formalen Parametern übergeben a, der Aktualparameter 2 wird im Formalparameter b übergeben, der Aktualparameter 3 wird im formalen Parameter übergeben formaler Parameter c >. Wenn die Anzahl der tatsächlichen Parameter geringer ist als die der formalen Parameter, wird der Wert undefiniert an den rechten formalen Parameter übergeben. Zum Beispiel: 🎜rrreee🎜Der Aktualparameter 1 wird im Formalparameter a übergeben, und der Aktualparameter 2 wird im Formalparameter übergeben b , undefined übergibt den formalen Parameter c. Wenn Sie nur Daten an die Parameter auf der rechten Seite übergeben möchten, können Sie undefiniert an die ersten paar tatsächlichen Parameter übergeben. Zum Beispiel: 🎜rrreee🎜Die beiden oben genannten Methoden sind nicht streng genug. Die beste Vorgehensweise besteht darin, einen 🎜Standardwert🎜 für formale Parameter festzulegen, die in undefinierten-Werten übergeben werden können. Wie zum Beispiel: 🎜
function getSum(a,b,c) {  
    if(c === undefined)   
        c = 0;  
    console.log(a+b+c);  }  myFunction(1,2);
Nach dem Login kopieren

5.实参对象

JavaScript一切都是对象,实参也是一个对象,有一个专门的名字arguments,这个对象可以看成一个数组(类数组,不是真的数组),实参从左到右分别是arguments[0]、arguments[1]...arguments.length表示实参的个数。

//求参数的和  function getSum() {  
    var aLength = arguments.length;  
    var sum = 0;  
    for(var i = 0;i < aLength;i++) {  
        sum += arguments[i];  
    }  
    return sum;  }  console.log(getSum(1,2,3,4,5))//输出15
Nach dem Login kopieren

这里的形参直接省略,使用arguments[i]表示。

6.对象作为参数

复杂的函数通常多达十几个参数,尽管JavaScript不做参数个数和类型的检查,但是调用时实参的顺序不能乱。开发人员需要检查每一个实参和形参的对应关系,这样效率很低。一种很好的解决方案是使用对象作为参数,函数会根据对象的属性名操作参数。

function myFunction(obj) {  
    console.log(obj.name);  
    obj.number++;  
    return obj.number;  }  myObj = {name:"myObj",number:34};  myFunction(myObj);//输出myObj  console.log(myObj.number);//输出35
Nach dem Login kopieren
Nach dem Login kopieren

7.函数对象作为另一个函数的参数

一个函数(为方便行文,称为a函数)可以作为另外一个函数(称为b函数)的参数b函数最终可以返回一个具体的值。

从原理上来说,b函数在自己的函数体内调用了a函数,所以需要把a函数的名字作为实际参数传递给b函数。如下:

//求最大值  function getMax(a,b) {  
    return a>b?a:b;  }  //求最小值  function getMin(a,b) {  
    return a<b?a:b;  }  //下面这个函数以函数作为参数,并最终返回一个值  function getM(func,num1,num2) {  
    return func(num1,num2);  }  getM(getMax,1,2);//返回2  getM(getMin,1,2);//返回1
Nach dem Login kopieren

我们把a函数的名字(getMax或者getMin)传给b函数(getM()),然后在b函数内部调用传入的a函数,得到相关的结果。

【相关推荐:javascript视频教程web前端

Das obige ist der detaillierte Inhalt vonLassen Sie uns über die Definition und grundlegende Verwendung von JavaScript-Funktionen sprechen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:csdn.net
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