一些知识点

131 阅读3分钟
css回笼重绘

重绘:当节点需要改变外观而不影响布局时候 回流:DOM结构的修改引发DOM几何尺寸的变化发生回流 常见的集合属性有width,height,padding,margin,left,top,border,或节点发生增减移动, 减少重绘回流的方法, 使用css3新增属性tranform 替代位置移动 避免频繁使用style 使用class

箭头函数和普通函数的区别

普通函数的this

  • this总时指向它的直接调用者
  • 再默认情况下没有找到直接调用者 this指向window
  • 严格模式下 没有直接调用者 函数中的this是undefined
  • 使用call apply bind绑定,this指向绑定的对象 箭头函数的this
  • this指向它所执行的上下文
  • 不能当作构造函数 不能用new 关键字执行 否则会报错
  • 没有arguments对象 可以用...代替
讲一下var let const 区别
  • var 没有块级作用域支持变量提升
  • let 有块级作用域不支持变量提升 不允许重复声明 存在暂时性死区 不能用window访问
  • const 有块级作用域,不支持变量提升 不允许重复声明 有暂时性死区声明变量必须赋值且不能改变否则报错
实现一个new 关键字的伪代码
  • 创建一个对象
  • 连接原型
  • 绑定this
  • 返回对象
function _new(){
  let obj = new Object();
  let Con = [].shift.call(arguments);
  obj.__proto__ = Con.prototype;
  let result = Con.apply(obj,arguments);
  return typeof result === 'object' ? result : obj
}
原型和原型链

每个实例都有一个__proto__属性,它指向构造该对象构造函数的prototype属性 同事该对象可以通过__proto__找到不属于自己的属性 原型:是实现继承中产生的一个概念

继承

复制父类的属性和方法来重写子的原型对象

  • 原型继承
  • 构造函数继承
  • 组合继承
  • 寄生继承
  • 寄生组合继承
  • class
  • 等等
闭包

闭包就是有权访问一个函数内部变量的函数就是常说的函数内部嵌套函数,内部函数访问外部函数的变量,从而导致垃圾回收机制没有将当前变量回收,这样操作有可能造成内存泄漏,好处就是可以设置私有的方法和变量

深浅拷贝

浅拷贝:1.用Object.assign()2.用...扩展运算符 深拷贝

  • JSON.parse(JSON.stringify(obj)),该方法自动忽略掉undefined,Symbol,function,适合简单的深拷贝
  • 手写递归函数
  • 第三方深拷贝方法
函数防抖和节流

防抖:多次触发只执行一次

function debounce(fn,wait){
  let timer = null;
  return function (){
    let arg = arguments;
    if(timer){
      clearTimeout(timer);
      timer = null;
    }
    timer = setTimeout(()=>{
       fn.apply(this,arg)
    },wait)
  }
}
function clg(){
  console.log('clg')
}
window.addEventListener('resize',debounce(clg,1000))

节流函数:将频繁执行的函数每间隔一个时间点去执行

function throttle(fn,time){
  let lastTime = null;
  return function(){
    let nowTime = Date.now();
    if(nowTime - lastTime > time || !lastTime){
      fn();
      last = nowTime
    }
  }
}
function sayHi(){
  console.log('hi')
}
setInterval(throttle(sayHi,1000),500)