目录
- 1. 函数
- 1.1 声明函数
- 1.2 调用函数
- 1.3 匿名函数
- 1.3.1 函数表达式
- 1.3.2 立即执行函数
- 1.4 箭头函数
- 1.5 构造函数
1. 函数
1.1 声明函数
- 函数的调用不传递值给形参,且形参没有默认值,则其值为undefined
- 如果没有return返回值,则返回undefined
- 函数内部,变量没有声明,直接用
num = 1
赋值,也当全局变量看 - 两个相同名称的函数,后面定义的会覆盖前面定义的
- 局部变量和全局变量同名,则局部变量优先
function getMinMax(x = 0, y = 0) {// 局部变量let min = x > y ? y : xlet max = x > y ? x : yreturn [min, max]}
1.2 调用函数
- 如果实参过多, 那么多余的实参会被忽略
- 可以使用
...arr
声明一个形参,放在形参的最后,接收多余的实参。使用的时候直接用arr(真数组) - 函数内部有一个伪数组arguments,里面装着所有的实参
- 函数调用存在提升: 函数在当前作用域声明之前即可被调用。但函数表达式不存在函数提升
let minMaxArr1 = getMinMax(1, 3)console.log(minMaxArr1) // [1, 3]
1.3 匿名函数
1.3.1 函数表达式
- 必须先声明,再调用
- 应用场景: 可以将函数赋值给按钮的点击事件
let func = function (x = 0,y = 0) {let min = x > y ? y : xlet max = x > y ? x : yreturn [min, max]}let minMaxArr2 = func(1,3)console.log(minMaxArr2) // [1, 3]
1.3.2 立即执行函数
方式1
- 多个立即函数中间如果没有;隔开,可能会报错
- 应用场景: 可以避免定义全局变量
let minMaxArr3 = (function (x = 0,y = 0) {let min = x > y ? y : xlet max = x > y ? x : yreturn [min, max]})(1, 3)console.log(minMaxArr3) // [1, 3]
方式二
let minMaxArr4 = (function (x = 0,y = 0) {let min = x > y ? y : xlet max = x > y ? x : yreturn [min, max]}(1, 3))console.log(minMaxArr4) // [1, 3]
1.4 箭头函数
写法更简单,属于表达式函数,可以更好的实现匿名函数
- 只有一个参数可以省略小括号
- 如果函数体只有一行代码,可以写到一行上,并且无需写return,直接返回值。如果返回值是对象需要加小括号,例如
(uname) => ({uname: uname})
- 箭头函数没有arguments动态参数,但是有剩余参数
...arr
- 箭头函数不会创建自己的this, 它里面的this是自己的作用域链的上一层的this。例如事件回调函数使用箭头函数时,this为全局的window
使用示例:
<!DOCTYPE html>
<html lang="zh-CN">
<head><meta charset="UTF-8"><title>Title</title></head>
<body><script>const fn = (x) => {console.log(x)}fn(6)</script>
</body>
</html>
1.5 构造函数
- 用处: 用来初始化对象
- 声明: 虽然是常规函数。但约定命名以大写字母开头。可以给构造函数声明静态变量和静态方法
- 实例化:
- 只能由new操作符来创建对象
- 如果没有参数,可以省略
()
function Person(uname) {this.uname = uname // 动态变量this.printName = () => console.log(`hi, ${this.uname}`) // 动态方法}Person.type = 'person' // 静态变量Person.sayHi = () => console.log('hi') // 静态方法const lily = new Person('lily')console.log(lily) // {uname: 'lily', printName: ƒ}lily.printName() // hi, lilyconsole.log(Person.type) // personPerson.sayHi() // hi