-
函数 前端的函数, 与数学的函数, 完全是两个概念 可以粗暴的理解为 一个盒子 当一段需要多次使用的复杂代码段, 我们可以把它放在(抽离)一个盒子中(就是函数) 在需要使用的地方去调用即可 如何拥有(使用)函数 函数分为 定义(创建)和调用 定义(创建): 必须要有, 没有的话, 无法调用 调用: 也必须要有, 没有的话, 定义就没有意义了
-
定义 语法: function () {} 1.赋值式定义 var fn = function () {} 声明式定义 function 函数名() {} 具体含义: function ---> 关键字 函数名(可以不写) ---> 不写的函数, 我们称之为匿名函数, 如果有 叫具名函数(函数) () ---> 书写参数的位置(暂时不讲) {} ---> 代码, 函数调用要执行的代码 2.调用 函数的定义分两种方式, 调用 只有 1 种 语法: 函数名() 3.声明式与赋值式的区别 区别: 1. 书写 2. 调用 赋值式定义, 不能再定义前 调用函数, 声明式可以 fn() fn1() // 正常调用 var fn = function () { console.log(1) } function fn1() { console.log(2) }
fn() fn1() -
变量提升 在 浏览器读 JS 代码的时候 有一个 预解析, 此时会有一个变量提升 什么是变量提升 在预解析时, 将 JS 内部的 变量 全部提升到 当前作用域顶端(当前代码的最上边) 变量提升的时候, 值不会到最顶端, 可以理解为, 把声明变量提升到最顶端, 但是没赋值 什么是 变量提升 自己写的代码: fn() var fn = function () { console.log(1) } fn()
浏览器预解析 fn() ---> 不需要变量提升 var fn = function () { ---> 需要变量提升 console.log(1) } fn() ---> 不需要变量提升 变量提升后 var fn; ---> fn == undefined fn() ---> undefined() fn = function () {console.log(1)} fn() ---> 打印1浏览器在预解析的时候, 除了会做 变量提升 还会做一件事; 函数的声明提升(值也跟着上去了) 自己写的代码 fn() function fn() { console.log(1) } fn()
浏览器预解析 fn() ---> 不需要提升 function fn() { ---> 需要 函数声明提升 console.log(1) } fn() ---> 不需要提升 函数声明提升后 function fn() { console.log(1) } fn() ---> 正常打印 fn() ---> 正常打印 -
函数的参数 为什么要有 参数? 如果 没有 参数, 那么函数的功能 相对单一, 不够灵活 函数的参数 他的 作用 ---> 能够让函数的功能更加灵活, 更方便在多个地方调用 参数也可以让我们的函数更具有 差异性 参数语法 1. 形参 ---> function或者函数名后的 小括号 2. 实参 ---> 函数调用时的 小括号中 参数的作用 1. 形参 每书写一个形参, 就相当于在函数内部创建一个变量, 形参的值 是由 实参传递进来的 2. 实参 按照书写顺序 一一对应, 传递给形参
-
函数参数的数量 参数数量不一致 1. 形参少, 实参多 2. 实参少, 形参多 1. 形参少, 实参多 function fn(a) { console.log(a) } fn(1, 2, 3)
1. 形参少, 实参多 我们当前案例, 传递 1个形参, 3个实参 第一个实参, 传递给 对应的形参 后续的所有参数, 都不能通过形参获取 2. 实参少, 形参多 我们当前案例, 传递 3个形参, 1个实参 第一个实参, 传递给对应的形参 后续没有实参 所以, 后续的形参相当于 之声明不赋值 ===> undefined -
函数参数的默认值 函数参数的默认值 创建形参的时候, 直接赋值 如果传递对应实参, 按照实参的值 如果没有传递对应实参, 按照默认值 function fn(a, b, c){ console.log(a, b, c) } fn(200)
function fn1(a, b = 100, c = 200){ console.log(a, b, c) } fn1(50) fn1(50,100) fn1(50,100,200) -
函数的返回值 函数的返回值 每一个函数都有返回值, 不管是否写了返回值 每个函数 默认都会有返回值 ---> 默认返回 undefined 如果我们自己手写了 返回值, 那么就不会返回默认值了, 返回的是 我们书写的 函数返回值书写语法 return 要返回的内容 注意点: 函数的返回值具有中断函数的功能, 所以我们手写返回值需要放在最后 var num = prompt('请输入一个值') function fn() { console.log(1) } var myFn = fn() // fn 函数的返回值, 会赋值给 变量 myFn console.log(myFn) // ---> undefined
function fn1() { return '我是 fn1 的返回值' } var myFn1 = fn1() console.log(myFn1) // 我是 fn1 的返回值 function fn() { console.log(1) console.log(2) console.log(3) return 500 } fn() function fn(a) { 规定, 函数不能接受数字。 if (typeof (a) == 'number') { console.log('哈哈哈') return } if (typeof (a) == 'number') return console.log('参数 a 不是数字类型的, 所以会执行到我这个位置') } fn('100')