一、数据类型

. JavaScript有哪些数据类型，它们的区别？JavaScript共有八种数据类型，分别是 Undefined、Null、Boolean、Number、String、Object、Symbol、BigInt。

其中 Symbol 和 BigInt 是ES6 中新增的数据类型：

●Symbol 代表创建后独一无二且不可变的数据类型，它主要是为了解决可能出现的全局变量冲突的问题。

●BigInt 是一种数字类型的数据，它可以表示任意精度格式的整数，使用 BigInt 可以安全地存储和操作大整数，即使这个数已经超出了 Number 能够表示的安全整数范围。

这些数据可以分为原始数据类型和引用数据类型：

●栈：原始数据类型（Undefined、Null、Boolean、Number、String）

●堆：引用数据类型（对象、数组和函数）

两种类型的区别在于存储位置的不同：

●原始数据类型直接存储在栈（stack）中的简单数据段，占据空间小、大小固定，属于被频繁使用数据，所以放入栈中存储；

●引用数据类型存储在堆（heap）中的对象，占据空间大、大小不固定。如果存储在栈中，将会影响程序运行的性能；引用数据类型在栈中存储了指针，该指针指向堆中该实体的起始地址。

当解释器寻找引用值时，会首先检索其在栈中的地址，取得地址后从堆中获得实体。堆和栈的概念存在于数据结构和操作系统内存中，在数据结构中：

●在数据结构中，栈中数据的存取方式为先进后出。

●堆是一个优先队列，是按优先级来进行排序的，优先级可以按照大小来规定。在操作系统中，内存被分为栈区和堆区

●栈区内存由编译器自动分配释放，存放函数的参数值，局部变量的值等。其操作方式类似于数据结构中的栈。

●堆区内存一般由开发着分配释放，若开发者不释放，程序结束时可能由垃圾回收机制回收。

2. 数据类型检测的方式有哪些

（1）typeof    其中数组、对象、null都会被判断为object，其他判断都正确。

（2）instanceofinstanceof可以正确判断对象的类型，其内部运行机制是判断在其原型链中能否找到该类型  的原型。可以看到，instanceof只能正确判断引用数据类型，而不能判断基本数据类型。instanceof 运算符可以用来测试一个对象在其原型链中是否存在一个构造函数的 prototype 属性。

 （3）constructor  有两个作用，一是判断数据的类型，二是对象实例通过 constrcutor 对象访问它的构造函数。需要注意，如果创建一个对象来改变它的原型，constructor就不能用来判断数据类型了

（4）Object.prototype.toString.call()   使用 Object 对象的原型方法 toString 来判断数据类型：

3. 判断数组的方式有哪些

●通过Object.prototype.toString.call()做判断

●通过原型链做判断

●通过ES6的Array.isArray()做判断

●通过instanceof做判断

●通过Array.prototype.isPrototypeOf

4. null和undefined区别

首先 Undefined 和 Null 都是基本数据类型，这两个基本数据类型分别都只有一个值，就是 undefined 和 null。undefined 代表的含义是未定义，null 代表的含义是空对象。一般变量声明了但还没有定义的时候会返回 undefined，null主要用于赋值给一些可能会返回对象的变量，作为初始化。

undefined 在 JavaScript 中不是一个保留字，这意味着可以使用 undefined 来作为一个变量名，但是这样的做法是非常危险的，它会影响对 undefined 值的判断。我们可以通过一些方法获得安全的 undefined 值，比如说 void 0。当对这两种类型使用 typeof 进行判断时，Null 类型化会返回 “object”，这是一个历史遗留的问题。当使用双等号对两种类型的值进行比较时会返回 true，使用三个等号时会返回 false。

5. typeof null 的结果是什么，为什么？

typeof null 的结果是Object。在 JavaScript 第一个版本中，所有值都存储在 32 位的单元中，每个单元包含一个小的 类型标签(1-3 bits) 以及当前要存储值的真实数据。类型标签存储在每个单元的低位中，共有五种数据类型：如果最低位是 1，则类型标签标志位的长度只有一位；如果最低位是 0，则类型标签标志位的长度占三位，为存储其他四种数据类型提供了额外两个 bit 的长度。

有两种特殊数据类型：

●undefined的值是 (-2)30(一个超出整数范围的数字)；

●null 的值是机器码 NULL 指针(null 指针的值全是 0)那也就是说null的类型标签也是000，和Object的类型标签一样，所以会被判定为Object。

6. intanceof 操作符的实现原理及实现

instanceof 运算符用于判断构造函数的 prototype 属性是否出现在对象的原型链中的任何位置。

7. 如何获取安全的 undefined 值？

因为 undefined 是一个标识符，所以可以被当作变量来使用和赋值，但是这样会影响 undefined 的正常判断。表达式 void ___ 没有返回值，因此返回结果是 undefined。void 并不改变表达式的结果，只是让表达式不返回值。因此可以用 void 0 来获得 undefined。

9. typeof NaN 的结果是什么？

NaN 指“不是一个数字”（not a number），NaN 是一个“警戒值”（sentinel value，有特殊用途的常规值），用于指出数字类型中的错误情况，即“执行数学运算没有成功，这是失败后返回的结果”。NaN 是一个特殊值，它和自身不相等，是唯一一个非自反（自反，reflexive，即 x === x 不成立）的值。而 NaN !== NaN 为 true。

10. isNaN 和 Number.isNaN 函数的区别？

●函数 isNaN 接收参数后，会尝试将这个参数转换为数值，任何不能被转换为数值的的值都会返回 true，因此非数字值传入也会返回 true ，会影响 NaN 的判断。

●函数 Number.isNaN 会首先判断传入参数是否为数字，如果是数字再继续判断是否为 NaN ，不会进行数据类型的转换，这种方法对于 NaN 的判断更为准确。

11. 其他值到字符串的转换规则？

●Null 和 Undefined 类型 ，null 转换为 "null"，undefined 转换为 "undefined"，

●Boolean 类型，true 转换为 "true"，false 转换为 "false"。

●Number 类型的值直接转换，不过那些极小和极大的数字会使用指数形式。

●Symbol 类型的值直接转换，但是只允许显式强制类型转换，使用隐式强制类型转换会产生错误。

●对普通对象来说，除非自行定义 toString() 方法，否则会调用 toString()（Object.prototype.toString()）来返回内部属性 [[Class]] 的值，如"[object Object]"。如果对象有自己的 toString() 方法，字符串化时就会调用该方法并使用其返回值。

12. 其他值到数字值的转换规则？

●Undefined 类型的值转换为 NaN。

●Null 类型的值转换为 0。

●Boolean 类型的值，true 转换为 1，false 转换为 0。

●String 类型的值转换如同使用 Number() 函数进行转换，如果包含非数字值则转换为 NaN，空字符串为 0。

●Symbol 类型的值不能转换为数字，会报错。

●对象（包括数组）会首先被转换为相应的基本类型值，如果返回的是非数字的基本类型值，则再遵循以上规则将其强制转换为数字。为了将值转换为相应的基本类型值，抽象操作 ToPrimitive 会首先（通过内部操作 DefaultValue）检查该值是否有valueOf()方法。如果有并且返回基本类型值，就使用该值进行强制类型转换。如果没有就使用 toString() 的返回值（如果存在）来进行强制类型转换。如果 valueOf() 和 toString() 均不返回基本类型值，会产生 TypeError 错误。

13. 其他值到布尔类型的值的转换规则？

以下这些是假值：• undefined• null• false• +0、-0 和 NaN• ""假值的布尔强制类型转换结果为 false。从逻辑上说，假值列表以外的都应该是真值。

14. || 和 && 操作符的返回值？

|| 和 && 首先会对第一个操作数执行条件判断，如果其不是布尔值就先强制转换为布尔类型，然后再执行条件判断。

●对于 || 来说，如果条件判断结果为 true 就返回第一个操作数的值，如果为 false 就返回第二个操作数的值。

●&& 则相反，如果条件判断结果为 true 就返回第二个操作数的值，如果为 false 就返回第一个操作数的值。

|| 和 && 返回它们其中一个操作数的值，而非条件判断的结果

15. Object.is() 与比较操作符 “===”、“==” 的区别？

●使用双等号（==）进行相等判断时，如果两边的类型不一致，则会进行强制类型转化后再进行比较。

●使用三等号（===）进行相等判断时，如果两边的类型不一致时，不会做强制类型准换，直接返回 false。

●使用 Object.is 来进行相等判断时，一般情况下和三等号的判断相同，它处理了一些特殊的情况，比如 -0 和 +0 不再相等，两个 NaN 是相等的。

16. 什么是 JavaScript 中的包装类型？

在 JavaScript 中，基本类型是没有属性和方法的，但是为了便于操作基本类型的值，在调用基本类型的属性或方法时 JavaScript 会在后台隐式地将基本类型的值转换为对象，如：在访问'abc'.length时，JavaScript 将'abc'在后台转换成String('abc')，然后再访问其length属性。JavaScript也可以使用Object函数显式地将基本类型转换为包装类型：也可以使用valueOf方法将包装类型倒转成基本类型：看看如下代码会打印出什么：答案是什么都不会打印，因为虽然包裹的基本类型是false，但是false被包裹成包装类型后就成了对象，所以其非值为false，所以循环体中的内容不会运行。

17. JavaScript 中如何进行隐式类型转换？

首先要介绍ToPrimitive方法，这是 JavaScript 中每个值隐含的自带的方法，用来将值 （无论是基本类型值还是对象）转换为基本类型值。如果值为基本类型，则直接返回值本身；如果值为对象，其看起来大概是这样：type的值为number或者string。

（1）当type为number时规则如下：

●调用obj的valueOf方法，如果为原始值，则返回，否则下一步；

●调用obj的toString方法，后续同上；

●抛出TypeError 异常。

（2）当type为string时规则如下：

●调用obj的toString方法，如果为原始值，则返回，否则下一步；

●调用obj的valueOf方法，后续同上；

●抛出TypeError 异常。可以看出两者的主要区别在于调用toString和valueOf的先后顺序。

默认情况下：

●如果对象为 Date 对象，则type默认为string；

●其他情况下，type默认为number。

总结上面的规则，对于 Date 以外的对象，转换为基本类型的大概规则可以概括为一个函数：而 JavaScript 中的隐式类型转换主要发生在+、-、*、/以及==、>、<这些运算符之间。而这些运算符只能操作基本类型值，所以在进行这些运算前的第一步就是将两边的值用ToPrimitive转换成基本类型，再进行操作。以下是基本类型的值在不同操作符的情况下隐式转换的规则 （对于对象，其会被ToPrimitive转换成基本类型，所以最终还是要应用基本类型转换规则）：1+操作符+操作符的两边有至少一个string类型变量时，两边的变量都会被隐式转换为字符串；其他情况下两边的变量都会被转换为数字。2-、*、\操作符NaN也是一个数字3对于==操作符操作符两边的值都尽量转成number：4对于<和>比较符如果两边都是字符串，则比较字母表顺序：其他情况下，转换为数字再比较：以上说的是基本类型的隐式转换，而对象会被ToPrimitive转换为基本类型再进行转换：其对比过程如下：又比如：运算过程如下：

18. + 操作符什么时候用于字符串的拼接？

根据 ES5 规范，如果某个操作数是字符串或者能够通过以下步骤转换为字符串的话，+ 将进行拼接操作。如果其中一个操作数是对象（包括数组），则首先对其调用 ToPrimitive 抽象操作，该抽象操作再调用 [[DefaultValue]]，以数字作为上下文。如果不能转换为字符串，则会将其转换为数字类型来进行计算。简单来说就是，如果 + 的其中一个操作数是字符串（或者通过以上步骤最终得到字符串），则执行字符串拼接，否则执行数字加法。那么对于除了加法的运算符来说，只要其中一方是数字，那么另一方就会被转为数字。

19. 为什么会有BigInt的提案？

JavaScript中Number.MAX_SAFE_INTEGER表示最⼤安全数字，计算结果是9007199254740991，即在这个数范围内不会出现精度丢失（⼩数除外）。但是⼀旦超过这个范围，js就会出现计算不准确的情况，这在⼤数计算的时候不得不依靠⼀些第三⽅库进⾏解决，因此官⽅提出了BigInt来解决此问题。

20. object.assign和扩展运算法是深拷贝还是浅拷贝，

两者区别扩展运算符：Object.assign():可以看到，两者都是浅拷贝。

●Object.assign()方法接收的第一个参数作为目标对象，后面的所有参数作为源对象。然后把所有的源对象合并到目标对象中。它会修改了一个对象，因此会触发 ES6 setter。

●扩展操作符（…）使用它时，数组或对象中的每一个值都会被拷贝到一个新的数组或对象中。它不复制继承的属性或类的属性，但是它会复制ES6的 symbols 属性。

21. 如何判断一个对象是空对象

●使用JSON自带的.stringify方法来判断：

●使用ES6新增的方法Object.keys()来判断：

二、ES61. let、const、var的区别

（1）块级作用域：块作用域由 { }包裹，let和const具有块级作用域，var不存在块级作用域。

      块级作用域解决了ES5中的两个问题：

        ●内层变量可能覆盖外层变量

       ●用来计数的循环变量泄露为全局变量

（2）变量提升：var存在变量提升，let和const不存在变量提升，即在变量只能在声明之后使用，否在会报错。

（3）给全局添加属性：浏览器的全局对象是window，Node的全局对象是global。var声明的变量为全局变量，并且会将该变量添加为全局对象的属性，但是let和const不会。

（4）重复声明：var声明变量时，可以重复声明变量，后声明的同名变量会覆盖之前声明的遍历。const和let不允许重复声明变量。

（5）暂时性死区：在使用let、const命令声明变量之前，该变量都是不可用的。这在语法上，称为暂时性死区。使用var声明的变量不存在暂时性死区。

（6）初始值设置：在变量声明时，var 和 let 可以不用设置初始值。而const声明变量必须设置初始值。

（7）指针指向：let和const都是ES6新增的用于创建变量的语法。 let创建的变量是可以更改指针指向（可以重新赋值）。但const声明的变量是不允许改变指针的指向。区别varletconst

2. const对象的属性可以修改吗

const保证的并不是变量的值不能改动，而是变量指向的那个内存地址不能改动。

对于基本类型的数据（数值、字符串、布尔值），其值就保存在变量指向的那个内存地址，因此等同于常量。但对于引用类型的数据（主要是对象和数组）来说，变量指向数据的内存地址，保存的只是一个指针，const只能保证这个指针是固定不变的，至于它指向的数据结构是不是可变的，就完全不能控制了。

3. 如果new一个箭头函数的会怎么样

箭头函数是ES6中的提出来的，它没有prototype，也没有自己的this指向，更不可以使用arguments参数，所以不能New一个箭头函数。

new操作符的实现步骤如下：

1创建一个对象

2将构造函数的作用域赋给新对象（也就是将对象的__proto__属性指向构造函数的prototype属性）

3指向构造函数中的代码，构造函数中的this指向该对象（也就是为这个对象添加属性和方法）

4返回新的对象所以，上面的第二、三步，箭头函数都是没有办法执行的。

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

（1）箭头函数比普通函数更加简洁

       ●如果没有参数，就直接写一个空括号即可

       ●如果只有一个参数，可以省去参数的括号

       ●如果有多个参数，用逗号分割

       ●如果函数体的返回值只有一句，可以省略大括号

       ●如果函数体不需要返回值，且只有一句话，可以给这个语句前面加一个void关键字。最常见的就是调用一个函数：

（2）箭头函数没有自己的this箭头函数不会创建自己的this， 所以它没有自己的this，它只会在自己作用域的上一层继承this。所以箭头函数中this的指向在它在定义时已经确定了，之后不会改变。

（3）箭头函数继承来的this指向永远不会改变对象obj的方法b是使用箭头函数定义的，这个函数中的this就永远指向它定义时所处的全局执行环境中的this，即便这个函数是作为对象obj的方法调用，this依旧指向Window对象。需要注意，定义对象的大括号{}是无法形成一个单独的执行环境的，它依旧是处于全局执行环境中。

（4）call()、apply()、bind()等方法不能改变箭头函数中this的指向

（5）箭头函数不能作为构造函数使用构造函数在new的步骤在上面已经说过了，实际上第二步就是将函数中的this指向该对象。 但是由于箭头函数时没有自己的this的，且this指向外层的执行环境，且不能改变指向，所以不能当做构造函数使用。

（6）箭头函数没有自己的arguments箭头函数没有自己的arguments对象。在箭头函数中访问arguments实际上获得的是它外层函数的arguments值。

（7）箭头函数没有prototype

（8）箭头函数不能用作Generator函数，不能使用yeild关键字

5. 箭头函数的this指向哪⾥？

箭头函数不同于传统JavaScript中的函数，箭头函数并没有属于⾃⼰的this，它所谓的this是捕获其所在上下⽂的 this 值，作为⾃⼰的 this 值，并且由于没有属于⾃⼰的this，所以是不会被new调⽤的，这个所谓的this也不会被改变。

6. 扩展运算符的作用及使用场景

（1）对象扩展运算符对象的扩展运算符(...)用于取出参数对象中的所有可遍历属性，拷贝到当前对象之中。

上述方法实际上等价于:Object.assign方法用于对象的合并，将源对象（source）的所有可枚举属性，复制到目标对象（target）。

Object.assign方法的第一个参数是目标对象，后面的参数都是源对象。(如果目标对象与源对象有同名属性，或多个源对象有同名属性，则后面的属性会覆盖前面的属性)。同样，如果用户自定义的属性，放在扩展运算符后面，则扩展运算符内部的同名属性会被覆盖掉。利用上述特性就可以很方便的修改对象的部分属性。在redux中的reducer函数规定必须是一个纯函数，reducer中的state对象要求不能直接修改，可以通过扩展运算符把修改路径的对象都复制一遍，然后产生一个新的对象返回。需要注意：扩展运算符对对象实例的拷贝属于浅拷贝。

（2）数组扩展运算符数组的扩展运算符可以将一个数组转为用逗号分隔的参数序列，且每次只能展开一层数组。

下面是数组的扩展运算符的应用：

  ●将数组转换为参数序列

●复制数组要记住：扩展运算符(…)用于取出参数对象中的所有可遍历属性，拷贝到当前对象之中，这里参数对象是个数组，数组里面的所有对象都是基础数据类型，将所有基础数据类型重新拷贝到新的数组中。

●合并数组如果想在数组内合并数组，

●扩展运算符与解构赋值结合起来，用于生成数组需要注意：如果将扩展运算符用于数组赋值，只能放在参数的最后一位，否则会报错。

●将字符串转为真正的数组

●任何 Iterator 接口的对象，都可以用扩展运算符转为真正的数组比较常见的应用是可以将某些数据结构转为数组：用于替换es5中的Array.prototype.slice.call(arguments)写法。

●使用Math函数获取数组中特定的值

7. 对对象与数组的解构的理解

解构是 ES6 提供的一种新的提取数据的模式，这种模式能够从对象或数组里有针对性地拿到想要的数值。

1）数组的解构在解构数组时，以元素的位置为匹配条件来提取想要的数据的：最终，a、b、c分别被赋予了数组第0、1、2个索引位的值：数组里的0、1、2索引位的元素值，精准地被映射到了左侧的第0、1、2个变量里去，这就是数组解构的工作模式。还可以通过给左侧变量数组设置空占位的方式，实现对数组中某几个元素的精准提取：通过把中间位留空，可以顺利地把数组第一位和最后一位的值赋给 a、c 两个变量：

2）对象的解构对象解构比数组结构稍微复杂一些，也更显强大。在解构对象时，是以属性的名称为匹配条件，来提取想要的数据的。现在定义一个对象：假如想要解构它的两个自有属性，可以这样：这样就得到了 name 和 age 两个和 stu 平级的变量：注意，对象解构严格以属性名作为定位依据，所以就算调换了 name 和 age 的位置，结果也是一样的：

8. 如何提取高度嵌套的对象里的指定属性？

有时会遇到一些嵌套程度非常深的对象：像此处的 name 这个变量，嵌套了四层，此时如果仍然尝试老方法来提取它：显然是不奏效的，因为 school 这个对象本身是没有 name 这个属性的，name 位于 school 对象的“儿子的儿子”对象里面

要想把 name 提取出来，一种比较笨的方法是逐层解构：但是还有一种更标准的做法，可以用一行代码来解决这个问题：可以在解构出来的变量名右侧，通过冒号+{目标属性名}这种形式，进一步解构它，一直解构到拿到目标数据为止。

9. 对 rest 参数的理解

扩展运算符被用在函数形参上时，它还可以把一个分离的参数序列整合成一个数组：这里，传入 mutiple 的是四个分离的参数，但是如果在 mutiple 函数里尝试输出 args 的值，会发现它是一个数组：这就是 … rest运算符的又一层威力了，它可以把函数的多个入参收敛进一个数组里。这一点经常用于获取函数的多余参数，或者像上面这样处理函数参数个数不确定的情况。

10. ES6中模板语法与字符串处理ES6 提出了“模板语法”的概念。

在 ES6 以前，拼接字符串是很麻烦的事情：仅仅几个变量，写了这么多加号，还要时刻小心里面的空格和标点符号有没有跟错地方。

但是有了模板字符串，拼接难度直线下降：字符串不仅更容易拼了，也更易读了，代码整体的质量都变高了。

这就是模板字符串的第一个优势——允许用${}的方式嵌入变量。但这还不是问题的关键，

模板字符串的关键优势有两个：

●在模板字符串中，空格、缩进、换行都会被保留

●模板字符串完全支持“运算”式的表达式，可以在${}里完成一些计算基于第一点，可以在模板字符串里无障碍地直接写 html 代码：基于第二点，可以把一些简单的计算和调用丢进 ${} 来做：除了模板语法外， ES6中还新增了一系列的字符串方法用于提升开发效率：

●存在性判定：在过去，当判断一个字符/字符串是否在某字符串中时，只能用 indexOf > -1 来做。现在 ES6 提供了三个方法：includes、startsWith、endsWith，它们都会返回一个布尔值来告诉你是否存在。○includes：判断字符串与子串的包含关系：○startsWith：判断字符串是否以某个/某串字符开头：○endsWith：判断字符串是否以某个/某串字符结尾：

●自动重复：可以使用 repeat 方法来使同一个字符串输出多次（被连续复制多次）

三、JavaScript基础

1. new操作符的实现原理new操作符的执行过程：

（1）首先创建了一个新的空对象

（2）设置原型，将对象的原型设置为函数的 prototype 对象。

（3）让函数的 this 指向这个对象，执行构造函数的代码（为这个新对象添加属性）

（4）判断函数的返回值类型，如果是值类型，返回创建的对象。如果是引用类型，就返回这个引用类型的对象

2. map和Object的区别MapObject

意外的键Map默认情况不包含任何键，只包含显式插入的键。Object 有一个原型, 原型链上的键名有可能和自己在对象上的设置的键名产生冲突。

键的类型Map的键可以是任意值，包括函数、对象或任意基本类型。Object 的键必须是 String 或是Symbol。

键的顺序Map 中的 key 是有序的。因此，当迭代的时候， Map 对象以插入的顺序返回键值。Object 的键是无序的

SizeMap 的键值对个数可以轻易地通过size 属性获取Object 的键值对个数只能手动计算

迭代Map 是 iterable 的，所以可以直接被迭代。迭代Object需要以某种方式获取它的键然后才能迭代。

性能在频繁增删键值对的场景下表现更好。在频繁添加和删除键值对的场景下未作出优化。

3. map和weakMap的区别

（1）Mapmap本质上就是键值对的集合，但是普通的Object中的键值对中的键只能是字符串。而ES6提供的Map数据结构类似于对象，但是它的键不限制范围，可以是任意类型，是一种更加完善的Hash结构。如果Map的键是一个原始数据类型，只要两个键严格相同，就视为是同一个键。实际上Map是一个数组，它的每一个数据也都是一个数组，

●size： map.size 返回Map结构的成员总数。

●set(key,value)：设置键名key对应的键值value，然后返回整个Map结构，如果key已经有值，则键值会被更新，否则就新生成该键。（因为返回的是当前Map对象，所以可以链式调用）

●get(key)：该方法读取key对应的键值，如果找不到key，返回undefined。

●has(key)：该方法返回一个布尔值，表示某个键是否在当前Map对象中

●delete(key)：该方法删除某个键，返回true，如果删除失败，返回false。

●clear()：map.clear()清除所有成员，没有返回值。Map结构原生提供是三个遍历器生成函数和一个遍历方法

●keys()：返回键名的遍历器。

●values()：返回键值的遍历器。

●entries()：返回所有成员的遍历器。

●forEach()：遍历Map的所有成员。

（2）WeakMapWeakMap 对象也是一组键值对的集合，其中的键是弱引用的。其键必须是对象，原始数据类型不能作为key值，而值可以是任意的。

该对象也有以下几种方法：

●set(key,value)：设置键名key对应的键值value，然后返回整个Map结构，如果key已经有值，则键值会被更新，否则就新生成该键。（因为返回的是当前Map对象，所以可以链式调用）

●get(key)：该方法读取key对应的键值，如果找不到key，返回undefined。

●has(key)：该方法返回一个布尔值，表示某个键是否在当前Map对象中。

●delete(key)：该方法删除某个键，返回true，如果删除失败，返回false。其clear()方法已经被弃用，所以可以通过创建一个空的WeakMap并替换原对象来实现清除。WeakMap的设计目的在于，有时想在某个对象上面存放一些数据，但是这会形成对于这个对象的引用。一旦不再需要这两个对象，就必须手动删除这个引用，否则垃圾回收机制就不会释放对象占用的内存。而WeakMap的键名所引用的对象都是弱引用，即垃圾回收机制不将该引用考虑在内。因此，只要所引用的对象的其他引用都被清除，垃圾回收机制就会释放该对象所占用的内存。也就是说，一旦不再需要，WeakMap 里面的键名对象和所对应的键值对会自动消失，不用手动删除引用。

总结：●Map 数据结构。它类似于对象，也是键值对的集合，但是“键”的范围不限于字符串，各种类型的值（包括对象）都可以当作键。●WeakMap 结构与 Map 结构类似，也是用于生成键值对的集合。但是 WeakMap 只接受对象作为键名（ null 除外），不接受其他类型的值作为键名。而且 WeakMap 的键名所指向的对象，不计入垃圾回收机制。

4. JavaScript有哪些内置对象

全局的对象（ global objects ）或称标准内置对象，不要和 "全局对象（global object）" 混淆。这里说的全局的对象是说在全局作用域里的对象。全局作用域中的其他对象可以由用户的脚本创建或由宿主程序提供。

标准内置对象的分类：

（1）值属性，这些全局属性返回一个简单值，这些值没有自己的属性和方法。例如 Infinity、NaN、undefined、null 字面量

（2）函数属性，全局函数可以直接调用，不需要在调用时指定所属对象，执行结束后会将结果直接返回给调用者。例如 eval()、parseFloat()、parseInt() 等

（3）基本对象，基本对象是定义或使用其他对象的基础。基本对象包括一般对象、函数对象和错误对象。例如 Object、Function、Boolean、Symbol、Error 等

（4）数字和日期对象，用来表示数字、日期和执行数学计算的对象。例如 Number、Math、Date

（5）字符串，用来表示和操作字符串的对象。例如 String、RegExp

（6）可索引的集合对象，这些对象表示按照索引值来排序的数据集合，包括数组和类型数组，以及类数组结构的对象。例如 Array

（7）使用键的集合对象，这些集合对象在存储数据时会使用到键，支持按照插入顺序来迭代元素。例如 Map、Set、WeakMap、WeakSet

（8）矢量集合，SIMD 矢量集合中的数据会被组织为一个数据序列。例如 SIMD 等

（9）结构化数据，这些对象用来表示和操作结构化的缓冲区数据，或使用 JSON 编码的数据。例如 JSON 等

（10）控制抽象对象例如 Promise、Generator 等

（11）反射例如 Reflect、Proxy

（12）国际化，为了支持多语言处理而加入 ECMAScript 的对象。例如 Intl、Intl.Collator 等

（13）WebAssembly

（14）其他例如 arguments总结：js 中的内置对象主要指的是在程序执行前存在全局作用域里的由 js 定义的一些全局值属性、函数和用来实例化其他对象的构造函数对象。一般经常用到的如全局变量值 NaN、undefined，全局函数如 parseInt()、parseFloat() 用来实例化对象的构造函数如 Date、Object 等，还有提供数学计算的单体内置对象如 Math 对象。

6. 对JSON的理解JSON 是一种基于文本的轻量级的数据交换格式。

它可以被任何的编程语言读取和作为数据格式来传递。在项目开发中，使用 JSON 作为前后端数据交换的方式。

在前端通过将一个符合 JSON 格式的数据结构序列化为JSON 字符串，然后将它传递到后端，后端通过 JSON 格式的字符串解析后生成对应的数据结构，以此来实现前后端数据的一个传递。因为 JSON 的语法是基于 js 的，因此很容易将 JSON 和 js 中的对象弄混，但是应该注意的是 JSON 和 js 中的对象不是一回事，JSON 中对象格式更加严格，比如说在 JSON 中属性值不能为函数，不能出现 NaN 这样的属性值等，因此大多数的 js 对象是不符合 JSON 对象的格式的。在 js 中提供了两个函数来实现 js 数据结构和 JSON 格式的转换处理，

●JSON.stringify 函数，通过传入一个符合 JSON 格式的数据结构，将其转换为一个 JSON 字符串。如果传入的数据结构不符合 JSON 格式，那么在序列化的时候会对这些值进行对应的特殊处理，使其符合规范。在前端向后端发送数据时，可以调用这个函数将数据对象转化为 JSON 格式的字符串

●JSON.parse() 函数，这个函数用来将 JSON 格式的字符串转换为一个 js 数据结构，如果传入的字符串不是标准的 JSON 格式的字符串的话，将会抛出错误。当从后端接收到 JSON 格式的字符串时，可以通过这个方法来将其解析为一个 js 数据结构，以此来进行数据的访问。

7. JavaScript脚本延迟加载的方式有哪些？

延迟加载就是等页面加载完成之后再加载 JavaScript 文件。

 js 延迟加载有助于提高页面加载速度。一般有以下几种方式：

●defer 属性：给 js 脚本添加 defer 属性，这个属性会让脚本的加载与文档的解析同步解析，然后在文档解析完成后再执行这个脚本文件，这样的话就能使页面的渲染不被阻塞。多个设置了 defer 属性的脚本按规范来说最后是顺序执行的，但是在一些浏览器中可能不是这样。

●async 属性：给 js 脚本添加 async 属性，这个属性会使脚本异步加载，不会阻塞页面的解析过程，但是当脚本加载完成后立即执行 js 脚本，这个时候如果文档没有解析完成的话同样会阻塞。多个 async 属性的脚本的执行顺序是不可预测的，一般不会按照代码的顺序依次执行

●动态创建 DOM 方式：动态创建 DOM 标签的方式，可以对文档的加载事件进行监听，当文档加载完成后再动态的创建 script 标签来引入 js 脚本。●使用 setTimeout 延迟方法：设置一个定时器来延迟加载js脚本文件

●让 JS 最后加载：将 js 脚本放在文档的底部，来使 js 脚本尽可能的在最后来加载执行。

8. JavaScript 类数组对象的定义？

一个拥有 length 属性和若干索引属性的对象就可以被称为类数组对象，类数组对象和数组类似，但是不能调用数组的方法。常见的类数组对象有 arguments 和 DOM 方法的返回结果，还有一个函数也可以被看作是类数组对象，因为它含有 length 属性值，代表可接收的参数个数。

常见的类数组转换为数组的方法有这样几种：

（1）通过 call 调用数组的 slice 方法来实现转换

（2）通过 call 调用数组的 splice 方法来实现转换

（3）通过 apply 调用数组的 concat 方法来实现转换

（4）通过 Array.from 方法来实现转换9. 

9.数组有哪些原生方法？

●数组和字符串的转换方法：toString()、toLocalString()、join() 其中 join() 方法可以指定转换为字符串时的分隔符。

●数组尾部操作的方法 pop() 和 push()，push 方法可以传入多个参数。

●数组首部操作的方法 shift() 和 unshift() 重排序的方法 reverse() 和 sort()，sort() 方法可以传入一个函数来进行比较，传入前后两个值，如果返回值为正数，则交换两个参数的位置。

●数组连接的方法 concat() ，返回的是拼接好的数组，不影响原数组。

●数组截取办法 slice()，用于截取数组中的一部分返回，不影响原数组。

●数组插入方法 splice()，影响原数组查找特定项的索引的方法，indexOf() 和 lastIndexOf() 迭代方法 every()、some()、filter()、map() 和 forEach() 方法

●数组归并方法 reduce() 和 reduceRight() 方法

10. 为什么函数的 arguments 参数是类数组而不是数组？

如何遍历类数组?arguments是一个对象，它的属性是从 0 开始依次递增的数字，还有callee和length等属性，与数组相似；但是它却没有数组常见的方法属性，如forEach, reduce等，所以叫它们类数组。要遍历类数组，有三个方法：（1）将数组的方法应用到类数组上，这时候就可以使用call和apply方法，如：（2）使用Array.from方法将类数组转化成数组：（3）使用展开运算符将类数组转化成数组

11. 什么是 DOM 和 BOM？

●DOM 指的是文档对象模型，它指的是把文档当做一个对象，这个对象主要定义了处理网页内容的方法和接口。

●BOM 指的是浏览器对象模型，它指的是把浏览器当做一个对象来对待，这个对象主要定义了与浏览器进行交互的法和接口。

BOM的核心是 window，而 window 对象具有双重角色，它既是通过 js 访问浏览器窗口的一个接口，又是一个 Global（全局）对象。这意味着在网页中定义的任何对象，变量和函数，都作为全局对象的一个属性或者方法存在。window 对象含有 location 对象、navigator 对象、screen 对象等子对象，并且 DOM 的最根本的对象 document 对象也是 BOM 的 window 对象的子对象。

14. 对类数组对象的理解，如何转化为

数组一个拥有 length 属性和若干索引属性的对象就可以被称为类数组对象，类数组对象和数组类似，但是不能调用数组的方法。常见的类数组对象有 arguments 和 DOM 方法的返回结果，函数参数也可以被看作是类数组对象，因为它含有 length属性值，代表可接收的参数个数。

常见的类数组转换为数组的方法有这样几种：

●通过 call 调用数组的 slice 方法来实现转换

●通过 call 调用数组的 splice 方法来实现转换

●通过 apply 调用数组的 concat 方法来实现转换

●通过 Array.from 方法来实现转换

15. 对AJAX的理解，实现一个AJAX请求

AJAX是 Asynchronous JavaScript and XML 的缩写，指的是通过 JavaScript 的 异步通信，从服务器获取 XML 文档从中提取数据，再更新当前网页的对应部分，而不用刷新整个网页

。创建AJAX请求的步骤：

●创建一个 XMLHttpRequest 对象。

●在这个对象上使用 open 方法创建一个 HTTP 请求，open 方法所需要的参数是请求的方法、请求的地址、是否异步和用户的认证信息。

●在发起请求前，可以为这个对象添加一些信息和监听函数。比如说可以通过 setRequestHeader 方法来为请求添加头信息。还可以为这个对象添加一个状态监听函数。一个 XMLHttpRequest 对象一共有 5 个状态，当它的状态变化时会触发onreadystatechange 事件，可以通过设置监听函数，来处理请求成功后的结果。当对象的 readyState 变为 4 的时候，代表服务器返回的数据接收完成，这个时候可以通过判断请求的状态，如果状态是 2xx 或者 304 的话则代表返回正常。这个时候就可以通过 response 中的数据来对页面进行更新了

。●当对象的属性和监听函数设置完成后，最后调用 sent 方法来向服务器发起请求，可以传入参数作为发送的数据体。使用Promise封装AJAX

17. JavaScript为什么要进行变量提升，它导致了什么问题？

变量提升的表现是，无论在函数中何处位置声明的变量，好像都被提升到了函数的首部，可以在变量声明前访问到而不会报错。

造成变量声明提升的本质原因是 js 引擎在代码执行前有一个解析的过程，创建了执行上下文，初始化了一些代码执行时需要用到的对象。

当访问一个变量时，会到当前执行上下文中的作用域链中去查找，而作用域链的首端指向的是当前执行上下文的变量对象，这个变量对象是执行上下文的一个属性，它包含了函数的形参、所有的函数和变量声明，这个对象的是在代码解析的时候创建的。首先要知道，JS在拿到一个变量或者一个函数的时候，会有两步操作，即解析和执行。

●在解析阶段，JS会检查语法，并对函数进行预编译。解析的时候会先创建一个全局执行上下文环境，先把代码中即将执行的变量、函数声明都拿出来，变量先赋值为undefined，函数先声明好可使用。在一个函数执行之前，也会创建一个函数执行上下文环境，跟全局执行上下文类似，不过函数执行上下文会多出this、arguments和函数的参数。○全局上下文：变量定义，函数声明○函数上下文：变量定义，函数声明，this，arguments

●在执行阶段，就是按照代码的顺序依次执行。

那为什么会进行变量提升呢？主要有以下两个原因：

●提高性能

●容错性更好

（1）提高性能在JS代码执行之前，会进行语法检查和预编译，并且这一操作只进行一次。这么做就是为了提高性能，如果没有这一步，那么每次执行代码前都必须重新解析一遍该变量（函数），而这是没有必要的，因为变量（函数）的代码并不会改变，解析一遍就够了。在解析的过程中，还会为函数生成预编译代码。在预编译时，会统计声明了哪些变量、创建了哪些函数，并对函数的代码进行压缩，去除注释、不必要的空白等。这样做的好处就是每次执行函数时都可以直接为该函数分配栈空间（不需要再解析一遍去获取代码中声明了哪些变量，创建了哪些函数），并且因为代码压缩的原因，代码执行也更快了。

（2）容错性更好变量提升可以在一定程度上提高JS的容错性，看下面的代码：如果没有变量提升，这两行代码就会报错，但是因为有了变量提升，这段代码就可以正常执行。虽然，在可以开发过程中，可以完全避免这样写，但是有时代码很复杂的时候。可能因为疏忽而先使用后定义了，这样也不会影响正常使用。由于变量提升的存在，而会正常运行。

总结：

●解析和预编译过程中的声明提升可以提高性能，让函数可以在执行时预先为变量分配栈空间

●声明提升还可以提高JS代码的容错性，使一些不规范的代码也可以正常执行变量提升虽然有一些优点，但是他也会造成一定的问题，在ES6中提出了let、const来定义变量，它们就没有变量提升的机制。下面看一下变量提升可能会导致的问题：在这个函数中，原本是要打印出外层的tmp变量，但是因为变量提升的问题，内层定义的tmp被提到函数内部的最顶部，相当于覆盖了外层的tmp，所以打印结果为undefined。由于遍历时定义的i会变量提升成为一个全局变量，在函数结束之后不会被销毁，所以打印出来11。

18. 什么是尾调用，使用尾调用有什么好处？

尾调用指的是函数的最后一步调用另一个函数。代码执行是基于执行栈的，所以当在一个函数里调用另一个函数时，会保留当前的执行上下文，然后再新建另外一个执行上下文加入栈中。使用尾调用的话，因为已经是函数的最后一步，所以这时可以不必再保留当前的执行上下文，从而节省了内存，这就是尾调用优化。但是 ES6 的尾调用优化只在严格模式下开启，正常模式是无效的。

19. ES6模块与CommonJS模块有什么异同？

ES6 Module和CommonJS模块的区别：

●CommonJS是对模块的浅拷⻉，ES6 Module是对模块的引⽤，即ES6 Module只存只读，不能改变其值，也就是指针指向不能变，类似const；●import的接⼝是read-only（只读状态），不能修改其变量值。 即不能修改其变量的指针指向，但可以改变变量内部指针指向，可以对commonJS对重新赋值（改变指针指向），但是对ES6 Module赋值会编译报错。

ES6 Module和CommonJS模块的共同点：

●CommonJS和ES6 Module都可以对引⼊的对象进⾏赋值，即对对象内部属性的值进⾏改变。

20. 常见的DOM操作有哪些

1）DOM 节点的获取DOM 节点的获取的API及使用

2）DOM 节点的创建创建一个新节点，并把它添加到指定节点的后面。已知的 HTML 结构如下：要求添加一个有内容的 span 节点到 id 为 title 的节点后面，

3）DOM 节点的删除删除指定的 DOM 节点，已知的 HTML 结构如下：需要删除 id 为 title 的元素，做法是：或者通过子节点数组来完成删除：4）修改 DOM 元素修改 DOM 元素这个动作可以分很多维度，比如说移动 DOM 元素的位置，修改 DOM 元素的属性等。将指定的两个 DOM 元素交换位置，已知的 HTML 结构如下：现在需要调换 title 和 content 的位置，可以考虑 insertBefore 或者 appendChild：

21. use strict是什么意思 ? 使用它区别是什么？

use strict 是一种 ECMAscript5 添加的（严格模式）运行模式，这种模式使得 Javascript 在更严格的条件下运行。

设立严格模式的目的如下：

●消除 Javascript 语法的不合理、不严谨之处，减少怪异行为;

●消除代码运行的不安全之处，保证代码运行的安全；

●提高编译器效率，增加运行速度；

●为未来新版本的 Javascript 做好铺垫。

区别：

●禁止使用 with 语句。

●禁止 this 关键字指向全局对象。

●对象不能有重名的属性。