学习笔记7_函数

本文详细介绍了JavaScript中的函数概念,包括命名函数与匿名函数的声明与调用,以及函数的参数和返回值。强调了函数封装的重要性,讨论了作用域的原理,包括全局作用域和局部作用域,并解释了预解析的过程。此外,还提到了arguments对象在处理不确定数量参数时的作用以及作用域链的概念。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

函数的概念

函数就是封装了一段可以被重复执行调用的代码块

函数的目的就是让代码可以重复使用

有趣的预解析案例

声明及调用
声明函数
  1. 自定义函数方式(命名函数)

    function 函数名(){
         //函数体
    }
    
    • 因为有名字,所以也被称为命名函数

    • 调用函数的代码既可以放到声明函数的前面,也可以放在声明函数的后面

  2. 函数表达式(匿名函数)

    // 这是函数表达式写法,匿名函数后面跟分号结束
    var fn = function(){
         //函数体
    };
    // 调用的方式,函数调用必须写到函数体下面
    fn();
    
    • 因为函数没有名字,所以也称为匿名函数
    • 这个fn 里面存储的是一个函数,不是变量
    • 匿名函数也可以传参
    • 函数调用的代码必须写到函数体后面
调用函数
  • 方法一:函数名();

    //声明函数
    function fn(){
        console.log(1);
    }
    //调用函数
    fn();
    
  • 方法二:在事件中调用,直接写函数名,不使用括号

    //声明函数
    function fn(){
        console.log(1);
    }
    //在点击事件中调用函数
    document.onclick = fn;
    
函数封装

函数的封装是把一个或者多个功能通过函数的方式封装起来,对外只提供一个简单的函数接口

函数传参
参数说明
形参形式上的参数,函数定义的时候传递的参数,接收实参
实参实际上的参数,函数调用的时候传递的参数
  • 函数的参数可以没有,也可以有很多个
  • 函数的实参与形参的个数可以不一样,但尽量保持一致
    • 如果实参数多于形参,则以形参数作为标准,形参有几个就取几个实参
    • 如果实参数少于形参,则多余的形参就会是undefined
function fn(形参1,形参2...){
    //函数执行代码
}
fn(实参1,实参2...);//调用时传参
函数的返回值
return
  • 所有函数都会有函数返回值即函数执行后一定会返回一个结果,如果没有定义默认返回undefined
  • 在函数中,reture会终止函数,return之后的代码就不会再执行了
  • return只能用于函数中,用在其他地方会报错
  • return只能返回一个值,如果用逗号隔开多个值,只会返回最后一个值
break、continue、return 的区别
  • break : 结束当前循环
  • continue :跳出本次循环,继续执行下次循环
  • return :不仅可以退出循环,还能够返回 return 语句中的值,同时还可以结束当前的函数体内的代码
arguments

当我们不确定有多少个参数传递的时候,可以用 arguments 来获取。在 JavaScript 中,arguments 实际上它是当前函数的一个内置对象。所有函数都内置了一个 arguments 对象,arguments 对象中存储了传递的所有实参。

  • arguments存放的是传递过来的实参
  • arguments展示形式是一个伪数组,因此可以进行遍历。伪数组具有以下特点:
    1. 具有 length 属性
    2. 按索引方式储存数据
    3. 不具有真正的数组的方法,如push() , pop() 等方法
// 函数声明
function fn() {
    console.log(arguments);  		//里面存储了所有传递过来的实参
    console.log(arrguments.length); // 3
    console.log(arrguments[2]); 		// 3
}
// 函数调用
fn(1,2,3);
作用域

通常来说,一段程序代码中所用到的名字并不总是有效和可用的,而限定这个名字的可用性的代码范围就是这个名字的作用域

作用域的使用提高了程序逻辑的局部性,增强了程序的可靠性,减少了名字冲突。

全局作用域

整个 script 标签或者一个独立的 js 文件

全局变量
  • 在全局作用域下的变量就是全局变量,全局都可以使用
  • 在函数内部没有声明直接赋值的变量也是全局变量
  • 全局变量在浏览器关闭时销毁
局部(函数)作用域

作用于函数内的代码环境,就是局部作用域。 因为跟函数有关系,所以也称为函数作用域

局部变量
  • 在局部作用域下的变量是局部变量,只能在定义它的函数内使用
  • 函数的形参也看做局部变量
  • 局部变量在函数执行完就会销毁
var num = 10;           //全局变量
console.log(num);       //10
function fn() {
	var num = 20;       //局部变量
	console.log(num);   //20
}
fn();
console.log(num);       //10
JS 没有块级作用域(在ES6之前)

在其他编程语言中(如 java、c#等),在 if 语句、循环语句中创建的变量,仅仅只能在本 if 语句、本循环语句中使用。

Java会报错:

if(true){
    int num = 123;
    System.out.println(num);	// 123
}
System.out.println(num);		// 报错

JS 中没有块级作用域(在ES6之前):

if(true){
    int num = 123;
    System.out.println(num);	// 123
}
System.out.println(num);		// 123

作用域链
  1. 只要是代码,就至少有一个作用域
  2. 写在函数内部的叫局部作用域
  3. 如果函数中还有函数,那么在这个作用域中就又可以诞生一个作用域
  4. 根据在内部函数可以访问外部函数变量的这种机制,用链式查找决定哪些数据能被内部函数访问,就称作作用域链
  5. 作用域链采取就近原则的方式来查找变量最终的值
预解析

JavaScript 代码是由浏览器中的 JavaScript 解析器来执行的。JavaScript 解析器在运行 JavaScript 代码的时候分为两步:预解析和代码执行。

  1. 预解析:js引擎会把js里面所有的var还有function提升到当前作用域的最前面

    • 注意,下面的fun是变量名,不是函数名,fun()才是函数名

      var fun = function() {
      	//函数体
      }
      
  2. 代码执行:从上到下执行JS语句

预解析
  • 变量预解析(变量提升):只提升变量声明,不会提升赋值
  • 函数预解析(函数提升):函数的声明会被提升到当前作用域的最上面,但是不会调用函数
预解析重要案例(有点意思( •̀ ω •́ )✧)
  • 源代码
f1();
console.log(c);
console.log(b);
console.log(a);
function f1() {
    var a = b = c = 9;
    console.log(a);
    console.log(b);
    console.log(c);
}
  • 经过预解析之后
function f1() {	//函数提升
    var a = 9;	//声明且赋值,局部变量
    b = 9;		//未声明直接赋值,全局变量
    c = 9;		//未声明直接赋值,全局变量
    //a = b = c = 9;
    //正常的集体声明应该是var a = 9, b = 9, c = 9
    //            而不是var a = b = c = 9; 
    console.log(a);	//9
    console.log(b);	//9
    console.log(c);	//9
}
f1();
console.log(c);	//9
console.log(b);	//9
console.log(a);	//报错 a是局部变量
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值