JS高级-ES6/递归函数

578 阅读1分钟

## instanceof 和 constructor

判断数据对象的构造函数是否是某个构造函数

判断对象是否是某个构造函数创建的

es6 class(重点)

作用

定义类型,功能类似于构造函数

成员

  • 构造器:constructor 初始化成员
  • 方法

使用

new调用 new就是调用class类的constructor

class实现继承

关键字:extends class 类 extends 父类 {}

子类也会拥有父类中定义的成员,同时也可以访问父的类的原型

复用父类的构造器 在使用this之前一定要调用super

class Tab {
  // 构造器:添加属性并为属性赋值
  constructor(selector) {
    //获取插件起作用的范围
    let element = document.querySelector(selector)
    // 获取所有导航项  使用element查找,可以缩小查找的范围,效率更高
    this.spans = element.querySelectorAll('.hd span')
    // 获取所有内容面板
    this.lis = element.querySelectorAll('.bd li')

    this.element = element

    // 顺便调用方法实现功能
    this.tabClick()
  }

  // 行为--功能:实现单击操作
  tabClick() {
    let that = this

    this.spans.forEach((v, i) => {
      v.addEventListener('click', function() {
        // 1. 去除当前有current样式的span元素的current样式
        that.element.querySelector('.hd .current').classList.remove('current')
        v.classList.add('current')

        that.element.querySelector('.bd .current').classList.remove('current')
        that.lis[i].classList.add('current')
      })
    })
  }
}

递归

  • 解决:嵌套次数不确定的问题
  • 递归一定要有结束条件
  • 递归写之前要使用化归思想,总结递归实现过程
  • 画图理解递归的实现过程