>  기사  >  웹 프론트엔드  >  자바스크립트 함수의 정의와 기본적인 사용법에 대해 이야기해보겠습니다.

자바스크립트 함수의 정의와 기본적인 사용법에 대해 이야기해보겠습니다.

WBOY
WBOY앞으로
2022-07-01 11:59:041920검색

이 글에서는 함수문을 이용한 정의, 함수 호출, 정의되지 않은 실제 매개변수 등을 포함하여 함수의 정의와 기본 사용에 관련된 문제를 주로 정리한 javascript에 대한 관련 지식을 소개합니다. 함께 살펴보겠습니다, 모든 사람에게 도움이 되기를 바랍니다.

자바스크립트 함수의 정의와 기본적인 사용법에 대해 이야기해보겠습니다.

[관련 권장 사항: javascript 비디오 튜토리얼, web front-end]

1. 함수 문을 사용하여 정의

먼저 이 함수의 기능은 다음의 합계를 반환하는 것입니다. 배열 요소;

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

function 키워드 뒤에 공백이 있습니다. sumArray는 함수 이름 지정 규칙과 동일합니다. function后面空一格,sumArray是函数的名字,其命名规范与变量名的命名规范相同:只能有字母、数字、下划线和美元符号,不能以数字开头,不能是关键字。

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

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

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

2.用表达式定义

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

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

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

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

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

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

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

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

调用函数的时候,需要传入和形参相同个数的的具体值,上面的函数有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

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

4.未定义的实参

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

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

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

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

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

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

上面这两种做法不够严谨,最佳实践是给可能被传入undefined 문자, 숫자, 밑줄, 달러만 포함할 수 있습니다. 기호는 숫자로 시작할 수 없으며 키워드가 될 수 없습니다.

괄호 안의 매개변수는 🎜형식 매개변수🎜라고도 합니다. 매개변수 이름만 있으면 됩니다. 매개변수는 0, 1 이상이 될 수 있으며 ,, {}로 구분됩니다. 중간에 🎜가 포함됩니다. 함수 본체🎜. 하나 이상의 명령문을 포함합니다. 함수 본문은 함수의 기능을 구현하는 데 사용됩니다. 🎜🎜키워드 return 뒤에는 함수의 🎜반환 값🎜이 옵니다. 함수에는 반환 값이 없을 수도 있습니다. 함수 실행이 끝나면 여기의 return 문장이 실행을 종료하고 return 아래의 🎜문은 더 이상 실행되지 않습니다🎜. 반환 값은 함수의 출력입니다. 🎜🎜이런 방식으로 정의된 함수는 함수와 함수를 호출하는 명령문이 동일한 소스 파일에 있는 한 함수 정의 전이나 후에 🎜 호출할 수 있습니다. 🎜🎜2. 표현식을 사용하여 정의🎜🎜 표현식을 사용하여 함수를 정의한다는 것은 할당 표현식을 사용하여🎜함수를 변수에 할당하는 것을 의미합니다🎜. 이때 함수에는 이름이 있을 수도 있고 이름이 없을 수도 있습니다. 이름이 없는 함수를 🎜익명 함수🎜라고 합니다. 🎜
  • 이름 포함;
function getSum(a,b,c) {  
    if(c === undefined)   
        c = 0;  
    console.log(a+b+c);  }  myFunction(1,2);
🎜 및 🎜는 함수 명령문🎜으로 정의됩니다. 차이점은 함수는 🎜함수 정의 명령문🎜 이후에만 호출할 수 있다는 것입니다. only 변수 이름 🎜funct는 사용할 수 있지만 다음과 같은 함수 이름 getMax는 사용할 수 없습니다. 🎜
//求参数的和  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
  • 익명 함수 🎜 so; -호출된 익명 함수는 키워드입니다. function 바로 뒤는 매개변수 목록입니다.
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
🎜이 함수는 funct</ 변수에 할당됩니다. code>이므로 익명 함수라고 합니다. 마찬가지로 🎜는 이 문 뒤에서만 이 함수를 호출할 수 있습니다. 🎜🎜<pre class="brush:php;toolbar:false">//求最大值 function getMax(a,b) { return a&gt;b?a:b;  }  //求最小值  function getMin(a,b) {       return a&lt;b?a:b; } //下面这个函数以函数作为参数,并最终返回一个值 function getM(func,num1,num2) { return func(num1,num2); } getM(getMax,1,2);//返回2 getM(getMin,1,2);//返回1</pre>🎜🎜요약: 표현식으로 함수를 정의하면 사용할 수 있습니다. 일단 정의되면 함수는 이 명령문 이후에만 호출할 수 있습니다🎜🎜🎜3 함수 호출🎜🎜4번째 훈련에서는 객체가 자신만의 메소드를 가질 수 있으며 물론 이것들도 함수라는 점을 소개했습니다. 이 함수의 호출은 이전 두 수준에서 정의된 함수와 약간 다릅니다. 🎜rrreee🎜함수 호출 시에는 형식 매개변수와 동일한 수의 특정 값을 전달해야 합니다. 위 함수에는 <code>3 매개변수가 있으므로 아래 호출 시에는 를 전달하세요. 3</ code> 특정 값, <code>1은 매개변수 a에 전달되고, 2는 매개변수 b에 전달됩니다. , 3이 매개변수 c에 전달됩니다. 함수의 반환 값은 할당 기호 =를 통해 변수 result에 전달됩니다. 함수 본문에 return 키워드가 없으면 undefine이 반환됩니다. 🎜🎜객체에 정의된 함수 호출: 🎜rrreee🎜위와 다른 점은 여기서 함수를 찾으려면 객체 이름.함수 이름 또는 객체 이름["을 사용해야 합니다. 함수 이름" ], 나머지는 동일합니다. 🎜🎜4. 정의되지 않은 실제 매개변수🎜🎜대부분의 프로그래밍 언어에서는 함수 호출 시 전달되는 실제 매개변수의 개수와 유형을 확인하지만 JavaScript는 🎜확인하지 않습니다🎜 실제 매개변수의 유형은 다음과 같습니다. 확인되지 않았으며 실제 매개변수 개수도 확인되지 않았습니다. 🎜JavaScript의 실제 매개변수는 🎜왼쪽에서 오른쪽으로🎜 순서대로 형식 매개변수와 일치합니다. 예: 🎜rrreee🎜실제 매개변수 1는 형식 매개변수에 전달됩니다. a, 실제 매개변수 2는 형식 매개변수 b에 전달되고, 실제 매개변수 3는 형식 매개변수 c >. 실제 매개변수의 개수가 형식 매개변수보다 적으면 정의되지 않음 값이 올바른 형식 매개변수에 전달됩니다. 예: 🎜rrreee🎜실제 매개변수 1는 형식 매개변수 a에 전달되고, 실제 매개변수 2는 형식 매개변수에 전달됩니다. b , undefine은 형식 매개변수 c를 전달합니다. 오른쪽 매개변수에만 데이터를 전달하려면 처음 몇 개의 실제 매개변수에 undefine을 전달하면 됩니다. 예: 🎜rrreee🎜위의 두 가지 방법은 충분히 엄격하지 않습니다. 가장 좋은 방법은 정의되지 않은 값으로 전달될 수 있는 형식 매개변수에 대해 🎜기본값🎜을 설정하는 것입니다. 예: 🎜
function getSum(a,b,c) {  
    if(c === undefined)   
        c = 0;  
    console.log(a+b+c);  }  myFunction(1,2);

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

这里的形参直接省略,使用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

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

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

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

위 내용은 자바스크립트 함수의 정의와 기본적인 사용법에 대해 이야기해보겠습니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
이 기사는 csdn.net에서 복제됩니다. 침해가 있는 경우 admin@php.cn으로 문의하시기 바랍니다. 삭제