前端面试(更新中)

1.防抖和节流

1.自己封装

防抖：触发事件后，在n秒内，事件只执行一次，如果在n秒内又触发了事件，则会重新计算函数的执行时间。

比如点击按钮，2秒后调用函数，结果在1.5秒的时候又点了，则会重新计算2秒后在调用函数。

应用场景：input验证、resize。

//创建debounce.js：
const debounce=function(fn, delay){
    let timer = null;
    return function(){
        let that = this;
        let args = arguments;
        if(timer){
            clearTimeout(timer)
        }
        timer = setTimeout(()=>{
            fn.apply(that,args)
        }, delay)
    }
}
export default debounce

//页面 
<el-input v-model="input" @change="changeSeletc" placeholder="请输入内容防抖"></el-input>
import debounce from "../api/debounce"

data() {
  return {
    input:''
  }
}
 
methods:{
    changeSeletc:debounce(function () {
                console.log(this.input)
    },500),
}

节流：连续发生的事件在n秒内，只执行为一次

//throttle.js
const throttle=(fn, delay) => {
    let timer = null; // 定时器
    return function () {
        let that = this;
        if (timer) { // 如果定时器还在，说明前一次延迟执行还没有完成，直接退出函数
            return false;
        }
        fn.apply(that, arguments); // 时间过后，直接执行，无延迟，若想每次延迟，使用下面函数
        timer = setTimeout(function () { // 延迟一段时间执行
            clearTimeout(timer);
            timer = null; //删掉也行
            //fn.apply(that, arguments); // 若每次都是延时执行，则在这里执行fn,上面不执行
        }, delay);
    }
}
export default throttle

//页面
<el-button type="primary" @click="submit">提交</el-button>
import throttle from "@/common/throttle"
 
methods:{
    submit:throttle(function()  {
		console.log('节流')
    },500)
}

2.使用lodash

import _ from 'lodash'

// debounce
方法名:_.debounce(function(传递参数){
        //具体方法
      },300),

// throttle
方法名:_.throttle(function(传递参数){
        //具体方法
      },300),

1.JS篇

1.JS 数据类型

数据类型主要包括两部分：

基本数据类型： Undefined、Null、Boolean、Number 和 String
引用数据类型： Object (包括 Object 、Array 、Function)
ECMAScript 2015 新增:Symbol(创建后独一无二且不可变的数据类型 )

2.判断一个值是什么类型有哪些方法？

typeof 运算符
instanceof 运算符
Object.prototype.toString 方法

3.null 和 undefined 的区别？

null 表示一个对象被定义了，值为“空值”；
undefined 表示不存在这个值。
（1）变量被声明了，但没有赋值时，就等于undefined。

（2) 调用函数时，应该提供的参数没有提供，该参数等于undefined。

（3）对象没有赋值的属性，该属性的值为undefined。

（4）函数没有返回值时，默认返回undefined。