JavaScript基础-DAY04

1.函数

1.1为什么需要函数

• 函数：

function，是被设计为执行特定任务的代码块

• 说明：

函数可以把具有相同或相似逻辑的代码“包裹”起来，通过函数调用执行这些被“包裹”的代码逻辑，这么做的优势就是有利于精简代码方便复用。

比如前面使用的alert()、prompt()等都是一些js函数，只不过已经封装好了，我们直接使用。

1.2函数使用

• 函数的声明语法

function 函数名() {
    函数体
}

• 函数名命名规范

1. 和变量名基本一致

2. 尽量小驼峰式命名法

3. 前缀应该为动词

• 函数的调用语法

函数必须调用，才会被真正执行

函数名()

1.3函数传参

• 声明语法

function 函数名(参数列表) {
    函数体
}

• 调用语法

函数名(传递的参数列表)

形参：声明函数时，写在函数名右边小括号里的叫形参

实参：调用函数时，写在函数名右边小括号里的叫实参

形参可以理解为在这个函数内声明的变量，实参可以理解为是给这个变量赋值

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

1.4函数返回值

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

• 语法：

return 数据

例：
function fn() {
    return 20
    //return后面的代码不会被执行 所以return尽量写在函数最下面
}
//相当于执行了 fn() = 20
console.log(fn())

//或者这么写
let re = fn()
console.log(re)

• 细节：

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

2. return后面代码不会再被执行，会立即结束当前函数，所以return后面的数据不要换行写

3. return函数可以没有return，这种情况函数默认返回值为undefined

• 细节补充：

• 两个相同的函数后面的会覆盖前面的函数

• 在JavaScript中 实参的个数和形参的个数可以不一致

1. 如果形参过多 会自动填上undefined

2. 如果实参过多 那么多余的实参会被忽略 不参与运算（函数内部有一个arguments，里面装着所有的实参）

• 函数一旦碰到return就不会再往下执行了 函数的结束用return

1.5作用域

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

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

• 全局作用域。函数外部或者整个script有效

• 局部作用域。也称为函数作用域，函数内部有效

在JavaScript中，根据作用域的不同，变量可以分为：

• 全局变量

• 函数外部let的变量

• 全局变量在任何区域都可以访问和修改

• 局部变量

• 函数内部let的变量

• 局部变量只能在当前函数内部访问和修改

1.5.1变量访问原则

• 只要是代码，就至少一个作用域

• 写在函数内部的局部作用域

• 如果函数中还有函数，那么在这个作用域中就又可以诞生一个作用域

• 访问原则：在能够访问到的情况下 先局部，局部没有再找全局

1.6匿名函数

没有名字的函数，无法直接使用。

• 使用方式

• 函数表达式

• 立即执行函数

• 语法：

function() {

}

1.6.1函数表达式

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

语法：

let fn = function() {
    函数体
}

1.6.2立即执行函数

避免全局变量之间的污染

语法：

//方式1
(function() {
    console.log(11)
})();

//方式2
(function() { 
    console.log(11)
}());

1.6.3逻辑中断

• 逻辑运算符里的短路

• 短路：只存在于&&和||中，当满足一定条件会让右边代码不执行

符号	短路条件
&&	左边为false就短路
||	左边为true就短路

• 原因：通过左边能得到整个式子的结果，因此没必要再判断右边

• 运算结果：无论&&还是||，运算结果都是最后被执行的表达式值，一般用在变量赋值

function fn(x, y) {
    x = x || 0  //等价于  x = 0
    y = y || 0  //同上
    console.log(x + y)
}
fn(1, 2)

console.log(false && 22) //false
console.log(false && 3 + 5) //false

let age = 18
console.log(false && age++) //false
console.log(age) //18因为一假则假 age++不会执行

console.log(true || age++) //true
console.log(age) //18一真则真 age++不会执行

转换为Boolean型

显示转换：

只有‘’、0、undefined、null、false、NaN转换为布尔值后都是false，其余都为true

隐式转换：

1. 有字符串的加法“”+ 1，结果都是“1”

2. 减法-（像大多数数学运算一样）只能用于数字，它会使空字符串“”转换为0

3. null经过数字转换之后会变为0

4. undefined经过数字转换之后会变成NaN