1.函数的概念
-
函数的概念
* 首先一定要明确, 和数学中的函数完全是两回事 * * 在 JS 中, 函数可以理解为 一段在程序(页面)中 多次出现的代码段 封装起来的盒子 * * * 简单来说, JS 的函数就是一个盒子, 盒子里边装的是 在当前页面中 多次出现的 较为复杂的代码段
2.函数的使用
* 函数的使用
*
* 1. 函数的定义(创建一个盒子)
*
* 2. 函数的调用(使用盒子内的代码)
*
*
* 如果函数只定义 不调用, 那么没有任何意义
*/
/**
* 1. 函数的定义
* 分为两种方式定义
*
* 1.1 声明式定义
* 语法: function fn () {}
* function: 关键字 -> 表明后续的是一段函数
* fn: 函数的名字 -> 将来函数调用的时候需要用到, 函数名自定义
* (): 内部填写参数 -> 欠着, 后续详细的讲解
* {}: 内部填写函数调用时要执行的代码段
*
* 1.2 赋值式定义
* 语法: var fn = function () {}
*/
// 1.1 声明式定义函数
function fn1() {
console.log('我是 fn1 函数')
}
// 1.2 赋值式定义函数
var fn2 = function () {
console.log('我是 fn2 函数')
}
/**
* 2. 函数的调用
* 不管是 声明式还是赋值式定义的函数, 调用方式都是一样的
*
* 调用语法: 函数名() / 变量名()
3.声明式与赋值式
* 声明式与赋值式的区别
*
* 1. 写法不同
* 2. 调用上略有不同
* 声明式定义的函数, 可以在 函数定义前 去调用 (先不考虑原理)
* 赋值式定义函数, 不能再函数定义前 去调用
*
* 赋值式定义函数不能再函数定义前调用的原因
* 赋值式定义, 其实就是声明一个变量, 然后给他赋值为一个函数
*
* 再 JS 中, 如果再定义变量之前 使用变量的话, 那么变量的值为 undefined (变量提升 面试可能会问)
*
* 函数的执行结果, 一般默认都是 undefined, 除非手动更改
// 1.1 声明式定义函数
// fn1()
// console.log('我是fn1函数定义前的 输出~~~~~~~')
function fn1() {
console.log('我是 fn1 函数')
}
// fn1()
// fn1()
// 1.2 赋值式定义函数
// fn2()
// console.log(fn2) // undefined
var fn2 = function () {
console.log('我是 fn2 函数')
}
// fn2()
4.函数的参数
* 函数的参数
*
* 函数的参数如何书写?
* 书写再 function 后的 小括号内
* 参数的作用?
* 如果一个函数没有书写参数, 那么这个函数的功能相对来说比较单一
* 如果书写了参数, 能够使我们这个函数的使用更加灵活
*
* 参数的书写, 分为两个
* 1. function 后的小括号内 书写的参数我们叫做 "形参"!!!
* 形参的作用: 书写之后, 相当于在函数内部创建了一个变量, 变量实际的值由 "实参" 传递
* 2. 函数名后的小括号内 书写的参数我们叫做 "实参"!!!
* 实参的作用: 将自身的值, 按照一一对应的关系, 传递给 形参
5.函数参数的注意
* 函数的参数
* 形参 和 实参 两个的数量, 要一一对应
*
* 1. 形参的数量如果大于实参
* 如果 形参的数量大于实参的数量, 那么会将 实参按照顺序一一传递给 对应的形参
* 多出来的形参, 相当于变量只定义没赋值, 所以他们的值 是 undefined
*
* 2. 实参的数量如果大于形参
* 如果 实参的数量大于形参的数量, 那么会将 实参按照顺序 一一传递给对应的形参
* 多出来的实参, 无法在函数内部通过参数的方式调用
*/
// function fn(a, b, c, d) {
// console.log(a, b, c, d)
// }
// fn(1, 2)
// function fn1(a, b) {
// console.log(a, b)
// }
// fn1(100, 200, 300, 400, 500)
/**
* 函数参数的默认值
*
* 函数再创建形参的时候, 默认给一个值, 将来在调用函数的时候,
* 如果没有传递那么这个形参的值也不会是 undefined 而是给的默认值
*
* 如果传递了对应的值, 那么形参的值是实参传递进来的值, 否则按照默认值来运行
6.函数的返回值
* 函数的返回值(函数的执行结果)
*
* JS 有一个规定: 在函数内部创建(定义)的变量, 只能在函数内部使用
* 后续学习作用域的时候, 会详细讲解
*
*
* 我们如果想在函数外部得到函数内部的某一个值, 或者运算结果,
* 我们可以通过 return 这个关键字来帮我们完成
7.return的注意事项
* retrun 的注意事项
*
* return 具有中断函数的能力
*
* 所以一般来说我们将它放在函数的尾部
function fn() {
console.log(1)
console.log(2)
return 666
console.log(3)
console.log(4)
console.log(5)
}
fn()
8.