JavaScript 第五天

128 阅读7分钟

一、函数

1.函数是什么

1.函数:是一种复杂数据类型,用于存储 特定任务的代码块

2.函数作用:解决代码复用问题

2.函数的使用

掌握函数语法,把代码封装起来

2.1 函数的声明语法

(一定要记住:函数声明,只是把代码存起来。并不会执行) function 函数名(){函数体}

image.png

2.2函数的调用语法

(注意:声明(定义)的函数必须调用才会真正被执行,使用 () 调用函数 函数名() image.png

2.3 函数使用

2.4 注意

通过代码 封装 成函数,体会函数的好处 函数的复用代码和循环重复代码有什么不同?

➢ 循环代码写完即执行,不能很方便控制执行位置(在一个地方执 行多次)

➢ 随时调用,随时执行,可重复调用(在多个地方执行一次)

3.函数传参

3.1 形参和实参

➢ 形参:声明函数时写在函数名右边小括号里的叫形参(形式上的参数)

➢ 实参:调用函数时写在函数名右边小括号里的叫实参(实际上的参数)

➢ 形参可以理解为是在这个函数内声明的变量(比如 num1 = 10)实参可以理解为是给这个变量赋值

➢ 开发中尽量保持形参和实参个数一致

➢ 我们曾经使用过的 alert('打印'), parseInt('11'), Number('11') 本质上都是函数调用的传参 image.png

3.2 总结

3.2.1 函数传递参数的好处是?

➢ 可以极大的提高了函数的灵活性

3.2.2 函数参数可以分为那两类?怎么判断他们是那种参数?

➢ 函数可以分为形参和实参 ➢ 函数声明时,小括号里面的是形参,形式上的参数 ➢ 函数调用时,小括号里面的是实参,实际的参数 ➢ 尽量保持形参和实参的个数一致

3.2.3 参数中间用什么符号隔开?

➢ 逗号

4.函数返回值

4.1 用return返回数据

当函数需要返回数据出去时,用return关键字

image.png

4.2 细节:

➢ 在函数体中使用 return 关键字能将内部的执行结果交给函数外部使用

➢ 函数内部只能出现 1 次 return,并且 return 后面代码不会再被执行,所以 return 后面的数据不要换行写

➢ return会立即结束当前函数

➢ 函数可以没有 return,这种情况函数默认返回值为 undefined

4.3 总结

1. 为什么要让函数有返回值

➢ 函数执行后得到结果,结果是调用者想要拿到的(一句话,函数内部不需要 输出结果,而是返回结果)

➢ 对执行结果的扩展性更高,可以让其他的程序使用这个结果

2. 函数有返回值用那个关键字? 有什么注意事项呢?

➢ 语法:return 数据

➢ return后面不接数据或者函数内不写return,函数的返回值是undefined

➢ return能立即结束当前函数, 所以 return 后面的数据不要换行写

4.4 函数四种形态

1.无参无返回函数

➢ 例如:京东首页的轮播图每隔3S会滚动一下,这个函数不需要参数 也没有返回值。就是隔一段时间让代码执行一次
2.无参有返回函数

➢ 例如:有一个函数,返回一个随机的颜色。 不需要参数,但是有返 回值

3.有参无返回函数

➢ 例如:登录功能,把用户填写的账号密码发给服务器。只需要传入 参数,没有返回值
4.有参有返回函数

➢ 例如:求数组中每一个元素的和。既需要参数,也需要返回值

5.作用域

5.1 作用域概述

通常来说,一段程序代码中所用到的名字并不总是有效和可用的,而限定这个名字的可用性的代码范围就是这 个名字的作用域。作用域的使用提高了程序逻辑的局部性,增强了程序的可靠性,减少了名字冲突。

5.2 变量的作用域

5.2.1 全局变量

函数外部let 的变量 (全局变量在任何区域都 可以访问和修改)

5.2.2 局部变量

函数内部let的变量 (局部变量只能在当前函 数内部访问和修改)

5.2.3 块级变量

{} 内部的let变量 (let定义的变量,只能在 块作用域里访问,不能跨 块访问,也不能跨函数访 问)

image.png

5.3 注意

变量有一个坑, 特殊情况: 如果函数内部或者块级作用域内部,变量没有声明,直接赋值,也当全局变量看,但是强烈不推荐 但是有一种情况,函数内部的形参可以看做是局部变量。

5.4 变量访问原则-作用域链

⚫ 只要是代码,就至少有一个作用域; ⚫ 写在函数内部的局部作用域 ; ⚫ 如果函数中还有函数,那么在这个作用域中就又可以诞生一个作用域 ; ⚫ 根据在内部函数可以访问外部函数变量的这种机制,用链式查找决定哪些数据能被内部函数访 问,就称作作用域链

作用域链:采取就近原则的方式来查找变量最终的值

6.1 匿名函数

function() {} 将匿名函数赋值给一个变量,并且通过变量名称进行调用 我们将这个称为函数表达式

image.png

image.png

6.2 立即执行函数

例子 : ;(function() { // console.log(123) // })()

; 不能遗漏

image.png

  1. 立即执行函数有什么作用? ➢ 防止变量污染

  2. 立即执行函数需要调用吗? 有什么注意事项呢? ➢ 无需调用,立即执行,其实本质已经调用了 ➢ 多个立即执行函数之间用分号隔开

补充
||

1.逻辑运算符(做判断条件使用,写在判断位置 例如if(这里)):一真则真,全假才假 2.短路运算(做赋值使用,写=号右边),第一个为真就第一个值,否则第二个值

&&

1.逻辑运算符使用,做条件判断:一假则假,全真才真

2.短路运算 (做赋值使用,写=号右边),第一个为真还要继续判断第二个值

补充点:基本数据类型和引用数据类型

了解基本数据类型和引用数据类型的存储方式

1.类型区别

简单类型又叫做基本数据类型或者值类型,复杂类型又叫做引用类型。

⚫ 值类型:简单数据类型/基本数据类型,在存储时变量中存储的是值本身,因此叫做值类型 string ,number,boolean,undefined,null

⚫ 引用类型:复杂数据类型,在存储时变量中存储的仅仅是地址(引用),因此叫做引用数据类型 通过 new 关键字创建的对象(系统对象、自定义对象),如 Object、Array、Date等

2.堆栈空间分配区别:

1、栈(操作系统):由操作系统自动分配释放存放函数的参数值、局部变量的值等。其操作方式类似于数据结构 中的栈; 简单数据类型存放到栈里面 2、堆(操作系统):存储复杂类型(对象),一般由程序员分配释放,若程序员不释放,由垃圾回收机制回收。 引用数据类型存放到堆里面

3.内存分配

3.1 简单类型的内存分配

值类型(简单数据类型): string ,number,boolean,undefined,null 值类型变量的数据直接存放在变量(栈空间)中

3.2 复杂类型的内存分配

⚫ 引用类型(复杂数据类型):通过 new 关键字创建的对象(系统对象、自定义对象),如 Object、Array、Date 等

⚫ 引用类型变量(栈空间)里存放的是地址,真正的对象实例存放在堆空间中