当前位置：首页 > news >正文

JavaScript基础——函数

news 来源：原创 2024/9/20 1:30:42

函数简介

定义函数

调用函数

函数的参数和返回值

函数参数

1.有形参情况下不传递实参

2.传递数量少于形参个数的实参

3.传递数量等于形参个数的实参

函数返回值

报错Uncaught SyntaxError: Illegal return statement

返回数字和字符串

返回数组、对象和函数

没有返回值

多个return语句

函数作用域

全局作用域

局部作用域

编辑

函数传参补充

不能直接使用函数内部的参数

不传递实参直接使用函数

传递实参数量多于形参

函数简介

在JavaScript中，函数是指可以实现特定功能、重复使用的代码块。

定义函数

在JavaScript中，用关键字function封装函数。定义函数有三种写法，分别如下：

    <script>// 1) 用function声明sayHello函数function sayHello() {console.log('hello');}// 2) 定义变量接收函数var sayHello2 = function () {console.log('hello2');}// 3)构造函数var sayHello3 = new Function('console.log("hello3")');</script>

定义一个函数，输出日常生活的句子，代码如下：

        // 1）定义函数function foo() {console.log("-----日常生活---------")console.log("起床")console.log("吃早餐")console.log("上课/上班")console.log("午休")console.log("上课/上班")console.log("下班")console.log("加班")console.log("回家睡觉")console.log("----------------------")}

再定义一个计算N-M之间随机整数的函数，代码如下：

        function getRandomNum(N, M) {return Math.floor(Math.random() * (M - N + 1) + N);}

其他获取随机数的代码可以参考博客：JavaScript基础——数学对象-CSDN博客

调用函数

使用函数的步骤分为定义函数、调用函数，函数必须要调用，代码块才能执行。调用函数的语法如下：

函数名称(参数[可为空]);

调用我们上面定义的foo函数，代码如下：

        // 2）调用函数foo();

函数的参数和返回值

在JavaScript中，函数可以函数可以接收参数，执行相应的操作，并返回结果，参数和返回是自定义的。

函数参数

定义函数时，可以在函数名称后面用()定义参数，记作：

    function 函数名(参数1,参数2,...参数n){代码块;
}

函数名后括号内的参数称为形式参数，简称形参，调用函数时传递的参数，称为实际参数，简称实参。

    //定义函数function 函数名(形参1,形参2,...形参n){代码块;
}// 调用函数函数名(实参1,实参2,...实参3);

函数传递参数的过程可以理解为将变量赋值，相当于赋值操作，如图：

函数可以定义零个或多个参数，语法如下：

        // 含参（带有参数）的函数function getRandomNum(N, M) {return Math.floor(Math.random() * (M - N + 1) + N);}// 不含参（不带有参数）的函数function sayHello() {console.log('hello');}

调用函数时，可以传递与参数数量相等或更少的参数（如果函数定义了默认参数值，则返回默认值，如果没有定义默认值，则返回undefined）。

定义add函数，设置两个参数a和b，a没有默认值，b有默认值2。

        function add(a, b = 2) {console.log("a:" + a, "b:" + b);}

分为以下情况传递参数：

1.有形参情况下不传递实参

在不传递参数的情况下，如果函数有默认值，则传递默认值，如果没有默认值，则传递undefined，代码输出a:undefined b:2

2.传递数量少于形参个数的实参

函数会将参数给按顺序传递，只传递一个参数，就会值传递给第一个形参，也就是a，第二个参数b有默认值，所以b被赋值默认值2，代码输出a:1 b:2

3.传递数量等于形参个数的实参

函数会将参数给按顺序传递，传递的实参数量和形参相等，a被赋值1，b被赋值3，代码输出a:1 b:3

        function add(a, b = 2) {console.log("a:" + a, "b:" + b);}add(1, 3);

整体代码

        function add(a, b = 2) {console.log("a:" + a, "b:" + b);}add();add(1);add(1, 3);;

函数返回值

函数可以使用return关键字来返回一个值，这个值可以是数字、字符串、布尔值等基本数据类型，也可以是对象、数组等引用数据类型，还可以返回一个表达式、函数等。

return后面的值就是返回值，就是函数调用后返回的结果。调用函数，函数执行操作后，才能得到返回值。

return有返回值作用，也有终止代码的作用，写多个return语句，只会返回第一个返回值。

报错Uncaught SyntaxError: Illegal return statement

return语句只能在函数作用域中使用，不能在全局环境下使用，否则会报错Uncaught SyntaxError: Illegal return statement，意思是非法返回语句，因为在全局环境下不能定义返回语句。

返回数字和字符串

定义两个函数，分别返回数字和字符串，调用函数在控制台输出返回值，查看返回值的类型，可以发现是number和string类型。

        // 返回值为数字的函数function returnNum() {return 1;}console.log(returnNum());// 返回值为字符串的函数function returnStr() {return 'hello';}console.log(returnStr());console.log(typeof returnNum());console.log(typeof returnStr());

返回数组、对象和函数

返回数组、对象和函数，可以得到返回的数据，检测类型，分别为对应的类型，访问数组的第一个数据，对象的指定属性，调用函数。

        // 返回数组function returnArr() {return [1, 2, 3];}console.log(returnArr());console.log(typeof returnArr());// 获得数组第一个元素console.log(returnArr()[0]);// 返回对象function returnObj() {return {name: '张三',age: 18}}console.log(returnObj());console.log(typeof returnObj());// 获得对象的name属性console.log(returnObj().name);// 返回函数function returnFun() {return function () {console.log('hello');}}returnFun()();

没有返回值

如果没有使用return，函数默认返回undefined。

        // 没有返回值function sayHello() {var a = 1;}console.log(sayHello())

多个return语句

return有返回值作用，也有终止代码的作用，写多个return语句，只会返回第一个返回值。

函数作用域

函数作用域是指变量和函数声明在代码中可见的区域，就是代码可执行的环境。函数作用域包括全局作用域和局部作用域。

全局作用域

在全局环境下（函数外部）声明的变量是全局变量，是可以被共享的。

在全局环境下定义一个变量num，值为100，可以输出变量num的值，定义函数f()输出num，函数f()也可以输出num的值。

局部作用域

在函数内部声明的变量是局部变量，是私有的，只能在函数内部被访问（使用）。

在不同的函数内部定义一个局部变量count，对变量进行不同的操作（给第一个函数进行+100的操作，第二个函数进行-100的操作），可以发现变量的操作是相互独立的，也就是说变量之间的操作不会冲突，因为局部变量是私有的。

在全局环境下输出变量，会报错ReferenceError: count is not defined，意思是count变量未定义，这是因为定义在局部的变量在全局环境下不存在，局部变量不能在全局环境下使用。

整体代码

        // 定义变量var num = 100; // 全局变量/全局作用域(共享)console.log(num);function f() {console.log(num);}f();// 函数作用域：代码块可执行的环境 { }function foo() {// 局部变量(私有)var count = 200;count -= 100;console.log(count);}// 调用函数foo();// 局部变量不会冲突function boo() {// 局部变量(私有)var count = 200;count += 100;console.log(count);}// 调用函数boo();// 因为全局环境下根本没有 count 这个变量console.log(count);  // undefined

函数传参补充

前面我们提到，函数名后的参数称为形参（形式参数），调用函数时传入的参数称为实参（实际参数），实参和形参是一一对应的，接着结合作用域进行补充。

传递参数可以让代码块的使用更灵活

不能直接使用函数内部的参数

定义函数num(a)，此时a和b是形参，是局部变量，只能在函数作用域中使用，也就是说，在全局环境下我们不能在未定义的情况下，直接使用a，会报错ReferenceError: a is not defined，意思就是a没有定义，全局环境下没有a这个变量。有形参，没有传递实参，形参缺少值，是undefined。