前端面试宝典一（js基础篇）

1、JS内置类型

JS 中分为七种内置类型，七种内置类型又分为两大类型：基本类型和对象（Object）。

基本类型有六种： null，undefined，boolean，number，string，symbol。

其中 JS 的数字类型是浮点类型的，没有整型。并且浮点类型基于 IEEE 754标准实现，在使用中会遇到某些 Bug。NaN 也属于 number 类型，并且 NaN 不等于自身。

对于基本类型来说，如果使用字面量的方式，那么这个变量只是个字面量，只有在必要的时候才会转换为对应的类型

对象（Object）是引用类型，在使用过程中会遇到浅拷贝和深拷贝的问题。

2、类型判断的方法

typeof返回一个表示数据类型的字符串返回结果包括：number、boolean、string、symbol、object、undefined、function等7种数据类型

对于数组、null、对象来说，其关系错综复杂，使用 typeof 都会统一返回 “object” 字符串。

要想区别对象、数组、函数单纯使用 typeof 是不行的，JavaScript中，通过Object.prototype.toString方法，判断某个对象值属于哪种内置类型

3、闭包的理解

闭包指的是一个函数可以访问另一个函数作用域中变量。常见的构造方法，是在一个函数内部定    义另外一个函数。

内部函数可以引用外层的变量；外层变量不会被垃圾回收机制回收。

注意，闭包的原理是作用域链，所以闭包访问的上级作用域中的变量是个对象，其值为其运算结    束后的最后一个值。

优点：避免全局变量污染。缺点：容易造成内存泄漏。 闭包主要有两个应用场景： 

函数作为参数传递  函数作为返回值

4、深浅拷贝

基本数据类型：String、Number、Boolean、Symbol、Undefined、Null 引用数据类型：Object

其实深拷贝和浅拷贝的主要区别就是其在内存中的存储类型不同。

基本数据类型存放在栈中，基本数据类型值不可变：基本数据类型的值是不可变的，动态修改了基      本数据类型的值，它的原始值也是不会改变的

引用类型（object）是存放在堆内存中的，变量实际上是一个存放在栈内存的指针，这个指针指      向堆内存中的地址。

浅拷贝就是拷贝了一层，除了对象是拷贝的引用类型，其他都是直接将值传递，有自己的内存空间      的。

深拷贝就是对对象以及对象的所有子对象进行拷贝。

1. Object.assign实现浅拷贝，三点运算符也是浅拷贝

2. JSON.parse(JSON.stringify(object)) 实现深拷贝该方法也是有局限性的：

会忽略 undefined

会忽略 symbol

会忽略函数 function

不能解决循环引用的对象 

解决办法 ：使用Lodash库的clone 与 cloneDeep方法

5、commonjs和es module的区别

commonJs是被加载的时候运行，esModule是编译的时候运行commonJs输出的是值的浅拷贝，esModule输出值的引用

commentJs具有缓存。在第一次被加载时，会完整运行整个文件并输出一个对象，拷贝（浅拷贝）      在内存中。下次加载文件时，直接从内存中取值

webpack 中的 webpack_require 对他们处理方式不同

6、防抖和节流，使用场景

防抖（debounce）

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

防抖函数分为非立即执行版和立即执行版

使用场景： 用户输入

节流（throttle）

所谓节流，就是指连续触发事件但是在 n 秒中只执行一次函数。节流会稀释函数的执行频率。

对于节流，一般有两种方式可以实现，分别是时间戳版和定时器版

使用场景：监听滚动，窗口大小变动

7、 call、apply、bind区别

call 和 apply 都是为了解决改变 this 的指向。作用都是相同的，只是传参的方式不同。

除了第一个参数外，call 可以接收一个参数列表，apply 只接受一个参数数组

 bind 和其他两个方法作用也是一致的，只是该方法会返回一个函数，不会立即调用

8、 对Promise，Generator， async和await  的理解

Promise

将原来的用 回调函数 的 异步编程 方法转成用relsove和reject触发事件， 用 then 和 catch 捕获成功或者失败的状态执行相应代码的异步编程的方法

Generator 函数

Generator函数是将函数分步骤阻塞 ，只有主动调用next()才能进行下一步。

dva 中异步处理用的是 Generator

async 函数

简单的说async函数就相当于自执行的Generator函数，相当于自带一个状态机，在 await 的部分等待返回， 返回后自动执行下一步。而且相较于Promise，async 的优越性就是把每次异步返回的结果从 then 中拿到最外层的方法中，不需要链式调用，只要用同步的写法就可以了。

 比 promise 直观，但是 async 必须以一个 Promise 对象开始 ，所以 async 通常是和Promise 结合使用的。

9、es6语法

ES6新增的一些特性：

　　1）let声明变量和const声明常量，两个都有块级作用域

　　ES5中是没有块级作用域的，并且var有变量提升，在let中，使用的变量一定要进行声明

　　2）箭头函数

　　ES6中的函数定义不再使用关键字function()，而是利用了()=>来进行定义

　　3）模板字符串

　　模板字符串是增强版的字符串，用反引号（`）标识，可以当作普通字符串使用，也可以用来定义多行字符串

　　4）解构赋值

　　ES6 允许按照一定模式，从数组和对象中提取值，对变量进行赋值

　　5）for of循环

　　for...of循环可以遍历数组、Set和Map结构、某些类似数组的对象、对象，以及字符串

　　6）import、export导入导出

　　ES6标准中，Js原生支持模块(module)。将JS代码分割成不同功能的小块进行模块化，将不同功能的代码分别写在不同文件中，各模块只需导出公共接口部分，然后通过模块的导入的方式可以在其他地方使用

　　7）set数据结构

　　Set数据结构，类似数组。所有的数据都是唯一的，没有重复的值。它本身是一个构造函数

　　8）... 展开运算符

　　可以将数组或对象里面的值展开；还可以将多个值收集为一个变量

　　9）修饰器 @

　　decorator是一个函数，用来修改类甚至于是方法的行为。修饰器本质就是编译时执行的函数

　　10）class 类的继承

　　ES6中不再像ES5一样使用原型链实现继承，而是引入Class这个概念

　　11）async、await

　　使用 async/await， 搭配promise，可以通过编写形似同步的代码来处理异步流程， 提高代码的简洁性和可读性

　　async 用于申明一个 function 是异步的，而 await 用于等待一个异步方法执行完成

　　12）promise

　　Promise是异步编程的一种解决方案，比传统的解决方案（回调函数和事件）更合理、强大

　　13）Symbol

　　Symbol是一种基本类型。Symbol 通过调用symbol函数产生，它接收一个可选的名字参数，该函数返回的symbol是唯一的

　　14）Proxy代理

　　使用代理（Proxy）监听对象的操作，然后可以做一些相应事情

      15)  var、let、const之间的区别

　　var声明变量可以重复声明，而let不可以重复声明

　　var是不受限于块级的，而let是受限于块级

　　var会与window相映射（会挂一个属性），而let不与window相映射

　　var可以在声明的上面访问变量，而let有暂存死区，在声明的上面访问变量会报错

　　const声明之后必须赋值，否则会报错

　　const定义不可变的量，改变了就会报错

　　const和let一样不会与window相映射、支持块级作用域、在声明的上面访问变量会报错

      16)  使用箭头函数应注意什么？

　　（1）用了箭头函数，this就不是指向window，而是父级（指向是可变的）

　　（2）不能够使用arguments对象

　　（3）不能用作构造函数，这就是说不能够使用new命令，否则会抛出一个错误

　　（4）不可以使用yield命令，因此箭头函数不能用作 Generator 函数

      17)  ES6的模板字符串有哪些新特性？并实现一个类模板字符串的功能

　　基本的字符串格式化。将表达式嵌入字符串中进行拼接。用${}来界定

　　在ES5时我们通过反斜杠()来做多行字符串或者字符串一行行拼接。ES6反引号(``)就能解决

     18)  Set、Map的区别？

　　应用场景Set用于数据重组，Map用于数据储存

　　Set：　

　　（1）成员不能重复

　　（2）只有键值没有键名，类似数组

　　（3）可以遍历，方法有add， delete，has

　　Map:

　　（1）本质上是健值对的集合，类似集合

 　　（2）可以遍历，可以跟各种数据格式转换

10、数组常用的一些方法

isArray，from，pop，reverse，shift，indexOf，every，some，forEach，map，filter，find，findIndex，includes，join，slice，concat，push，splice，unshift，sort，lastIndexOf，reduce，reduceRight，fill