JavaScript (函数进阶)

149 阅读2分钟

一起养成写作习惯!这是我参与「掘金日新计划 · 4 月更文挑战」的第N天,点击查看活动详情

函数四种调用模式

this:谁调用我,我就指向谁

无法修改this指向:三种

  • 全局函数:window普通函数: 函数名() this -> window
  • 对象的方法: 对象名.方法名() this -> 对象
  • 构造函数: new 函数名() this->new创建的实例对象
  • ps: 默认情况下 this指向是确定的 无法被修改

可以动态修改this指向:上下文模式

  • typeof 数据: 有两种数据类型无法检测 null和数组 得到的都是object
  • 万能数据类型: Object.prototype.toString.call(数据) call()
  • 函数名.call(this修改后的指向,arg1,arg2…………)
  • 适用于只有一个参数的函数 应用场景
  • 伪数组排序 检测数据类型 apply()
  • 函数名.apply(this修改之后的指向,伪数组或者数组)
  • 适用于有多个参数的函数 应用场景
  • 伪数组转真数组
  • 求数组最大值 bind()
  • 函数名.bind(this修改后的指向,arg1,arg2....)
  • 适用于回调函数(定时器,事件处理函数) 应用场景:
  • 定时器
  • bind()语法并不会立即执行函数,而是返回一个修改指向后的新函数,常用于回调函数

image.png call apply bind 区别

相同点:

  • 作用一致 都是修改函数的this指向 不同点:
  1. 传参方式不同: call是单个传参,apply是数组/伪数组传参
  2. 执行机制不同: call和apply会立即执行,bind不会立即执行而是得到修改this的新函数

递归函数

  • 递归函数:在函数中 调用自己 递归函数特点:
  • 一定要有结束条件,否则会导致死循环 递归函数应用场景:
  • 浅拷贝与深拷贝
  • 渲染DOM树

闭包函数

  • 闭包: 是一个可以访问其他函数内部变量的函数
  • 闭包 = 函数+上下文组合
  • 闭包作用:避免变量污染
  • 闭包应用场景: 闭包实际开发中一般用于 回调函数

image.png

浅拷贝与深拷贝

  • 浅拷贝: 拷贝的是地址 修改拷贝后的数据 对原数据有影响
  • 深拷贝: 拷贝的是数据 修改 修改后的数据 对原数据没有影响

image.png