JS常见面试题整理

1.JS的数据类型

• 引用数据类型(对象类型)：array,object,function，data,正则
• 基本类型（值类型）：Number,string,null,undefind,Boolean

2.null与undefined的区别

• 1.null代表该变量有声明，但是未赋值，值为空；undefind代表该变量不纯在；
• 2.null转化为number,值为0；undiefind转化为number，值为NAN(not a number);
• 3.null通过typeof判断数据类型为object，undefind通过typeof判断的数据类型为undefined；

3.== 和 === 的区别

• 1.两个等号只判断值是否相同；
• 2.三个等号，不仅判断值是否相同，还要校验数据类型是否相同；

4.JS引入方式

• 1.外部引用方式：写在head标签内，通过路径引用

<script src='../../app.js'></script>

• 2.内部引用方式：在script标签内进行js书写

<script>
    function(){
    .....
    }
</script>

• 3.行内引用方式：通过标签的事件进行行内书写

<button onclick='alert("hello,js")'></button>

5.this对象的理解

• this对象是基于其函数的执行环境绑定的，在全局环境中，this等于window；
• 有对象就指向调用对象
• 没调用对象就指向全局对象
• 通过 apply 或 call 或 bind 来改变 this 的所指。

6.对事件循环的理解？宏任务跟微任务

7.js闭包

• 闭包就是能够读取其他函数内部变量的函数。
• 闭包的优点就是可以实现数据共享，缺点就是滥用闭包会造成内存泄漏；

8.JS变量和函数声明的提升

• js的执行顺序是自上而下，如果提前调用了未声明的变量或者函数，浏览器会报错；但是通过var/function声明的变量跟函数会进行提升；
• var声明的变量，提前访问会打印出undefined；function声明的函数提前访问，可以访问到函数；
• 函数的提升优先级高于变量，但是值会被变量覆盖；

9.对作用域的理解

• 作用域指一个变量的作用的范围;
• 作用域分为全局作用域跟局部作用域，全局作用域里的变量可以在全局使用，局部作用域的变量具有局限性，但是对局部变量也是一种保护，避免了名字冲突跟变量污染；

10.原型和原型链

11.JS如何实现继承

1.原型链的继承，通过构造函数增加属性或者方法，由构造函数创造出的实例可以继承该属性或方法；
2.通过apply()或者call()将父对象的构造函数绑定在子对象上完成继承，其实也就是改变this指向；
3.es6的class方法也可以实现继承；

12.节流和防抖，如何实现？

• 首先需要了解为什么要进行防抖和节流？因为js引擎执行是单线程的，每次只能执行一个任务，执行多次同样的任务其实是一种性能消耗，某些场景下我们可以通过防抖跟节流去避免性能消耗；
• 防抖：避免用户在单位时间内多次点击，触发同一个事件；方法通过定时器去控制触发频率，首先我们要声明一个timer=null的变量，记作初始值；然后通过判断timer是否存在判断，是否需要进行防抖；如果timer存在，代表单位时间内的逻辑没有走完，本次逻辑需要忽略，进行防抖；如果timer不存在证明逻辑已经走完，不需要防抖；判断完timer后，就需要使用定时器去处理相关逻辑，处理完后需要将timer置空，完成循环；
• 节流：避免在监听情况下多次触发同一事件；应用场景：跟进页面滑动状态去处理一些问题；方法是监听滑动距离，在单位距离内处理逻辑，未满足条件，就忽略本次行为；首先要声明一个变量distance = 0；假定滑动距离超过500触发监听事件，那么接下来我们需要判断当前位置 减去 distance是否大于500，如果小于500，忽略本次操作。如果大于500继续往下进行，然后需要记录distance = 当前的滑动位置；在进行正常逻辑处理，完成循环；

13.深浅拷贝

14.js本地存储方式有哪些，区别与应用场景

• 类型：cookie,locaStorage,sessionStroage
• 区别：大小:cookie最小（4kb）,locaStorage,sessionStroage(5M);
• • 存储数据类型不同：cookie储存的是键值对；locaStorage,sessionStroage储存的是字符串；
• • 生命周期不同：localStorage需要用户手动清理才会消失；sessionStrorage页面关闭就会消失；cookie在浏览器过期之前都存在，过期就会消失；
• • 应用场景：需要标记用户行为，跟服务器进行交互的情况下，需要用cookie；不需要跟服务器通讯，长时间保留用户信息的场景用localStorage;一次性登录等敏感信息，使用sessionStorage;

15.JS的事件模型理解

• 一种是事件捕获，另一种是事件冒泡。
• 事件捕获：事件从上向下进行触发，事件首先从最外侧父元素开始触发，然后一直向里延伸，知道触发到最内层的元素。
• 事件冒泡：事件从下向上进行触发，事件首先会触发最底层的子节点，然后一直向上触发父元素事件。

16.typeof 与 instanceof 的区别

• typeof和instanceof的区别是：
• typeof的返回值是一个字符串，用来说明变量的数据类型；
• instanceof的返回值是布尔值，用于判断一个变量是否属于某个对象的实例。

17.对事件代理的理解

• 事件代理其实就是利用事件冒泡的原理，将子元素的绑定到父元素上；使用场景：我们需要对多个子元素进行事件管理，可以将事件委托给父元素进行统一管理；

18.重排与重绘

19.new操作符干了什么？

• 通过构造函数创建一个新的实例对象obj
• 将对象与构建函数通过原型链连接起来

20.什么是Ajax，如何实现的？

• 1、创建 XMLHTTPRequest 对象,也就是创建一个异步调用对象
• 2、创建一个新的 HTTP 请求,并指定该 HTTP 请求的方法、URL 及验证信息
• 3、设置响应 HTTP 请求状态变化的函数
• 4、发送 HTTP 请求
• 5、获取异步调用返回的数据
• 6、使用 JavaScript 和 DOM 实现局部刷新

21.箭头函数与普通函数的区别

• 1、外形不同：箭头函数使用箭头定义，普通函数中没有。
• 2、箭头函数全都是匿名函数：普通函数可以有匿名函数，也可以有具名函数
• 3、箭头函数不能用于构造函数：普通函数可以用于构造函数，以此创建对象实例。
• 4、箭头函数中 this 的指向不同：在普通函数中，this 总是指向调用它的对象，如果用作构造函数，它指向创建的对象实例。
• 5、箭头函数不具有 prototype 原型对象

22.bind,call,apply的区别？

• 1.参数类型不同：apply第二个参数为数组；call,bind第二个参数为数列
• 2.返回值也不同：bind是返回绑定this之后的函数，apply、call 则是立即执行
• 3.apply,call的参数需要一次性传入，bind可以多次传入

23.js内存泄漏有哪几种情况，如何避免

• 什么是内存泄漏？就是不再需要的变量或者运行程序仍然在占用资源，影响性能；
• 情况：1.不必要的全局变量；2.使用完的定时器没有及时销毁；3.闭包
• 如何避免：一一对应处理

24.数组常用方法整理

25.常见手写功能 juejin.cn/post/687351…